From 692f099225c0c7f46e8151bbe6f343fe972fc46f Mon Sep 17 00:00:00 2001 From: Cristi Silav Date: Tue, 13 Feb 2024 09:45:55 +0200 Subject: [PATCH 1/5] Add Dock UI fullscreen button support --- .../0.1/amp-connatix-player.js | 41 ++++++++++++++++--- 1 file changed, 35 insertions(+), 6 deletions(-) diff --git a/extensions/amp-connatix-player/0.1/amp-connatix-player.js b/extensions/amp-connatix-player/0.1/amp-connatix-player.js index c07a5825f7dde..aa45890375165 100644 --- a/extensions/amp-connatix-player/0.1/amp-connatix-player.js +++ b/extensions/amp-connatix-player/0.1/amp-connatix-player.js @@ -180,9 +180,18 @@ export class AmpConnatixPlayer extends AMP.BaseElement { break; } case 'cnxFullscreenChanged': { - this.isFullscreen_ = !this.isFullscreen_; + const fullscreenState = dataJSON['args']; + + this.isFullscreen_ = fullscreenState; break; } + case 'cnxToggleFullscreen': { + if (this.isFullscreen_) { + this.fullscreenExit(); + } else { + this.fullscreenEnter(); + } + } case 'cnxVolumeChanged': { const newVolume = dataJSON['args']; @@ -321,6 +330,7 @@ export class AmpConnatixPlayer extends AMP.BaseElement { 'playerId': this.playerId_ || undefined, 'mediaId': this.mediaId_ || undefined, 'url': Services.documentInfoForDoc(element).sourceUrl, + 'isSafariOrIos': this.isSafariOrIos_(), ...getDataParamsFromAttributes(element), }; const iframeUrl = this.iframeDomain_ + '/amp-embed/index.html'; @@ -421,6 +431,16 @@ export class AmpConnatixPlayer extends AMP.BaseElement { return true; } + /** + * @private + * @return {boolean} + */ + isSafariOrIos_() { + const platform = Services.platformFor(this.win); + + return platform.isSafari() || platform.isIos(); + } + // VideoInterface Implementation. See ../src/video-interface.VideoInterface /** @override */ @@ -463,13 +483,18 @@ export class AmpConnatixPlayer extends AMP.BaseElement { // Not supported. } - /** @override */ - fullscreenEnter() { + /** @override */ + fullscreenEnter() { if (!this.iframe_) { return; } - this.sendCommand_('enterFullscreen'); + if (this.isSafariOrIos_()) { + this.sendCommand_('toggleFullscreen', true); + } else { + fullscreenEnter(dev().assertElement(this.iframe_)); + this.sendCommand_('updateFullscreenUi', true); + } } /** @override */ @@ -477,8 +502,12 @@ export class AmpConnatixPlayer extends AMP.BaseElement { if (!this.iframe_) { return; } - - this.sendCommand_('exitFullscreen'); + if (this.isSafariOrIos_()) { + this.sendCommand_('toggleFullscreen', false); + } else { + fullscreenExit(dev().assertElement(this.iframe_)); + this.sendCommand_('updateFullscreenUi', false); + } } /** @override */ From bab18b5bf70acab2a5b157ac1866cb084a89a129 Mon Sep 17 00:00:00 2001 From: Cristi Silav Date: Tue, 13 Feb 2024 10:08:47 +0200 Subject: [PATCH 2/5] small fix --- extensions/amp-connatix-player/0.1/amp-connatix-player.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/extensions/amp-connatix-player/0.1/amp-connatix-player.js b/extensions/amp-connatix-player/0.1/amp-connatix-player.js index aa45890375165..de8e8f4e9776d 100644 --- a/extensions/amp-connatix-player/0.1/amp-connatix-player.js +++ b/extensions/amp-connatix-player/0.1/amp-connatix-player.js @@ -8,6 +8,10 @@ import { getDataParamsFromAttributes, removeElement, } from '#core/dom'; +import { + fullscreenEnter, + fullscreenExit, +} from '#core/dom/fullscreen'; import {applyFillContent, isLayoutSizeDefined} from '#core/dom/layout'; import { observeContentSize, @@ -20,7 +24,7 @@ import {Services} from '#service'; import {installVideoManagerForDoc} from '#service/video-manager-impl'; import {getData} from '#utils/event-helper'; -import {userAssert} from '#utils/log'; +import {dev, userAssert} from '#utils/log'; import { getConsentMetadata, @@ -493,6 +497,7 @@ export class AmpConnatixPlayer extends AMP.BaseElement { this.sendCommand_('toggleFullscreen', true); } else { fullscreenEnter(dev().assertElement(this.iframe_)); + this.isFullscreen_ = true; this.sendCommand_('updateFullscreenUi', true); } } @@ -506,6 +511,7 @@ export class AmpConnatixPlayer extends AMP.BaseElement { this.sendCommand_('toggleFullscreen', false); } else { fullscreenExit(dev().assertElement(this.iframe_)); + this.isFullscreen_ = false; this.sendCommand_('updateFullscreenUi', false); } } From 55bc9cbd006eeb26abdeef673836b4eb6873dbbf Mon Sep 17 00:00:00 2001 From: Cristi Silav Date: Fri, 16 Feb 2024 10:52:05 +0200 Subject: [PATCH 3/5] add break at end of switch statement --- extensions/amp-connatix-player/0.1/amp-connatix-player.js | 1 + 1 file changed, 1 insertion(+) diff --git a/extensions/amp-connatix-player/0.1/amp-connatix-player.js b/extensions/amp-connatix-player/0.1/amp-connatix-player.js index de8e8f4e9776d..a52a22e59a581 100644 --- a/extensions/amp-connatix-player/0.1/amp-connatix-player.js +++ b/extensions/amp-connatix-player/0.1/amp-connatix-player.js @@ -195,6 +195,7 @@ export class AmpConnatixPlayer extends AMP.BaseElement { } else { this.fullscreenEnter(); } + break; } case 'cnxVolumeChanged': { const newVolume = dataJSON['args']; From 09173610704e4618264b52fc6d2f76b0479b6267 Mon Sep 17 00:00:00 2001 From: Cristi Silav Date: Tue, 27 Feb 2024 10:38:25 +0200 Subject: [PATCH 4/5] fix lint --- .../amp-connatix-player/0.1/amp-connatix-player.js | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) diff --git a/extensions/amp-connatix-player/0.1/amp-connatix-player.js b/extensions/amp-connatix-player/0.1/amp-connatix-player.js index a52a22e59a581..cb7888d5e269c 100644 --- a/extensions/amp-connatix-player/0.1/amp-connatix-player.js +++ b/extensions/amp-connatix-player/0.1/amp-connatix-player.js @@ -8,10 +8,7 @@ import { getDataParamsFromAttributes, removeElement, } from '#core/dom'; -import { - fullscreenEnter, - fullscreenExit, -} from '#core/dom/fullscreen'; +import {fullscreenEnter, fullscreenExit} from '#core/dom/fullscreen'; import {applyFillContent, isLayoutSizeDefined} from '#core/dom/layout'; import { observeContentSize, @@ -440,7 +437,7 @@ export class AmpConnatixPlayer extends AMP.BaseElement { * @private * @return {boolean} */ - isSafariOrIos_() { + isSafariOrIos_() { const platform = Services.platformFor(this.win); return platform.isSafari() || platform.isIos(); @@ -488,8 +485,8 @@ export class AmpConnatixPlayer extends AMP.BaseElement { // Not supported. } - /** @override */ - fullscreenEnter() { + /** @override */ + fullscreenEnter() { if (!this.iframe_) { return; } From 4abdadf934d5a4058a655d994c347a999b4d94e4 Mon Sep 17 00:00:00 2001 From: Cristi Silav Date: Tue, 27 Feb 2024 10:41:13 +0200 Subject: [PATCH 5/5] update test --- .../0.1/test/test-amp-connatix-player.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/extensions/amp-connatix-player/0.1/test/test-amp-connatix-player.js b/extensions/amp-connatix-player/0.1/test/test-amp-connatix-player.js index 8ff6b68951d1c..d0ca144027611 100644 --- a/extensions/amp-connatix-player/0.1/test/test-amp-connatix-player.js +++ b/extensions/amp-connatix-player/0.1/test/test-amp-connatix-player.js @@ -40,7 +40,7 @@ describes.realWin( expect(iframe).to.not.be.null; expect(iframe.tagName).to.equal('IFRAME'); expect(iframe.src).to.equal( - 'https://amp.cntxcdm.com/amp-embed/index.html?playerId=f721b0d8-7a79-42b6-b637-fa4e86138ed9&url=about%3Asrcdoc' + 'https://amp.cntxcdm.com/amp-embed/index.html?playerId=f721b0d8-7a79-42b6-b637-fa4e86138ed9&url=about%3Asrcdoc&isSafariOrIos=false' ); expect(iframe.className).to.match(/i-amphtml-fill-content/); }); @@ -54,7 +54,7 @@ describes.realWin( expect(iframe).to.not.be.null; expect(iframe.tagName).to.equal('IFRAME'); expect(iframe.src).to.equal( - 'https://amp.cntxcdm.com/amp-embed/index.html?playerId=f721b0d8-7a79-42b6-b637-fa4e86138ed9&mediaId=527207df-2007-43c4-b87a-f90814bafd2e&url=about%3Asrcdoc' + 'https://amp.cntxcdm.com/amp-embed/index.html?playerId=f721b0d8-7a79-42b6-b637-fa4e86138ed9&mediaId=527207df-2007-43c4-b87a-f90814bafd2e&url=about%3Asrcdoc&isSafariOrIos=false' ); }); it('renders when data-elements-player is set', async () => { @@ -66,7 +66,7 @@ describes.realWin( expect(iframe).to.not.be.null; expect(iframe.tagName).to.equal('IFRAME'); expect(iframe.src).to.equal( - 'https://cdm.elements.video/amp-embed/index.html?playerId=f721b0d8-7a79-42b6-b637-fa4e86138ed9&url=about%3Asrcdoc' + 'https://cdm.elements.video/amp-embed/index.html?playerId=f721b0d8-7a79-42b6-b637-fa4e86138ed9&url=about%3Asrcdoc&isSafariOrIos=false' ); }); it('should pass data-param-* attributes to the iframe src', async () => { @@ -78,7 +78,7 @@ describes.realWin( expect(iframe).to.not.be.null; expect(iframe.tagName).to.equal('IFRAME'); expect(iframe.src).to.equal( - 'https://amp.cntxcdm.com/amp-embed/index.html?playerId=f721b0d8-7a79-42b6-b637-fa4e86138ed9&url=about%3Asrcdoc&myParam=17' + 'https://amp.cntxcdm.com/amp-embed/index.html?playerId=f721b0d8-7a79-42b6-b637-fa4e86138ed9&url=about%3Asrcdoc&isSafariOrIos=false&myParam=17' ); });