Implemented enterFullscreen and exitFullscreen for all video players …

…+ bug fixes and iOS compatibility
ampproject · Jul 21, 2017 · a87213d · a87213d
1 parent ab4c2a3
commit a87213d
Show file tree

Hide file tree

Showing 11 changed files with 227 additions and 68 deletions.
diff --git a/extensions/amp-3q-player/0.1/amp-3q-player.js b/extensions/amp-3q-player/0.1/amp-3q-player.js
@@ -17,7 +17,7 @@
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {tryParseJson} from '../../../src/json';
 import {user, dev} from '../../../src/log';
-import {removeElement} from '../../../src/dom';
+import {removeElement, fullscreenEnter, fullscreenExit} from '../../../src/dom';
 import {
   installVideoManagerForDoc,
 } from '../../../src/service/video-manager-impl';
@@ -215,6 +215,20 @@ class Amp3QPlayer extends AMP.BaseElement {
     this.sdnPostMessage_('hideControlbar');
   }
 
+  /**
+   * @override
+   */
+  fullscreenEnter() {
+    fullscreenEnter(this.iframe_);
+  }
+
+  /**
+   * @override
+   */
+  fullscreenExit() {
+    fullscreenExit(this.iframe_);
+  }
+
   /** @override */
   getCurrentTime() {
     // Not supported.

diff --git a/extensions/amp-brid-player/0.1/amp-brid-player.js b/extensions/amp-brid-player/0.1/amp-brid-player.js
@@ -22,7 +22,7 @@ import {
 import {VideoEvents} from '../../../src/video-interface';
 import {Services} from '../../../src/services';
 import {assertAbsoluteHttpOrHttpsUrl} from '../../../src/url';
-import {removeElement} from '../../../src/dom';
+import {removeElement, fullscreenEnter, fullscreenExit} from '../../../src/dom';
 import {getData, listen} from '../../../src/event-helper';
 
 /**
@@ -286,6 +286,20 @@ class AmpBridPlayer extends AMP.BaseElement {
     // Not supported.
   }
 
+  /**
+   * @override
+   */
+  fullscreenEnter() {
+    fullscreenEnter(this.iframe_);
+  }
+
+  /**
+   * @override
+   */
+  fullscreenExit() {
+    fullscreenExit(this.iframe_);
+  }
+
   /** @override */
   getCurrentTime() {
     // Not supported.

diff --git a/extensions/amp-dailymotion/0.1/amp-dailymotion.js b/extensions/amp-dailymotion/0.1/amp-dailymotion.js
@@ -28,7 +28,11 @@ import {
     addParamsToUrl,
     addParamToUrl,
 } from '../../../src/url';
-import {getDataParamsFromAttributes} from '../../../src/dom';
+import {
+  getDataParamsFromAttributes,
+  fullscreenEnter,
+  fullscreenExit,
+} from '../../../src/dom';
 
 /**
  * Player events reverse-engineered from the Dailymotion API
@@ -337,6 +341,30 @@ class AmpDailymotion extends AMP.BaseElement {
     // Not supported
   }
 
+  /**
+   * @override
+   */
+  fullscreenEnter() {
+    const platform = Services.platformFor(this.win);
+    if (platform.isSafari() || platform.isIos()) {
+      this.sendCommand_('fullscreen', [true]);
+    } else {
+      fullscreenEnter(this.iframe_);
+    }
+  }
+
+  /**
+   * @override
+   */
+  fullscreenExit() {
+    const platform = Services.platformFor(this.win);
+    if (platform.isSafari() || platform.isIos()) {
+      this.sendCommand_('fullscreen', [false]);
+    } else {
+      fullscreenExit(this.iframe_);
+    }
+  }
+
   /** @override */
   getCurrentTime() {
     // Not supported.

diff --git a/extensions/amp-ima-video/0.1/amp-ima-video.js b/extensions/amp-ima-video/0.1/amp-ima-video.js
@@ -30,7 +30,7 @@ import {
   listen,
 } from '../../../src/event-helper';
 import {dict} from '../../../src/utils/object';
-import {removeElement} from '../../../src/dom';
+import {removeElement, fullscreenEnter, fullscreenExit} from '../../../src/dom';
 import {user} from '../../../src/log';
 import {VideoEvents} from '../../../src/video-interface';
 import {Services} from '../../../src/services';
@@ -273,6 +273,22 @@ class AmpImaVideo extends AMP.BaseElement {
     // Not supported.
   }
 
+  /**
+   * @override
+   */
+  fullscreenEnter() {
+    // TODO(@aghassemi) Make internal <video> element go fullscreen instead
+    // using postMessages
+    fullscreenEnter(this.iframe_);
+  }
+
+  /**
+   * @override
+   */
+  fullscreenExit() {
+    fullscreenExit(this.iframe_);
+  }
+
   /** @override */
   getCurrentTime() {
     // Not supported.

diff --git a/extensions/amp-nexxtv-player/0.1/amp-nexxtv-player.js b/extensions/amp-nexxtv-player/0.1/amp-nexxtv-player.js
@@ -22,7 +22,7 @@ import {user} from '../../../src/log';
 import {
   installVideoManagerForDoc,
 } from '../../../src/service/video-manager-impl';
-import {removeElement} from '../../../src/dom';
+import {removeElement, fullscreenEnter, fullscreenExit} from '../../../src/dom';
 import {getData, listen} from '../../../src/event-helper';
 import {isObject} from '../../../src/types';
 import {VideoEvents} from '../../../src/video-interface';
@@ -241,6 +241,20 @@ class AmpNexxtvPlayer extends AMP.BaseElement {
   hideControls() {
   }
 
+  /**
+   * @override
+   */
+  fullscreenEnter() {
+    fullscreenEnter(this.iframe_);
+  }
+
+  /**
+   * @override
+   */
+  fullscreenExit() {
+    fullscreenExit(this.iframe_);
+  }
+
   /** @override */
   getCurrentTime() {
     // Not supported.

diff --git a/extensions/amp-ooyala-player/0.1/amp-ooyala-player.js b/extensions/amp-ooyala-player/0.1/amp-ooyala-player.js
@@ -17,7 +17,7 @@
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {tryParseJson} from '../../../src/json';
 import {user} from '../../../src/log';
-import {removeElement} from '../../../src/dom';
+import {removeElement, fullscreenEnter, fullscreenExit} from '../../../src/dom';
 import {
   installVideoManagerForDoc,
 } from '../../../src/service/video-manager-impl';
@@ -226,6 +226,20 @@ class AmpOoyalaPlayer extends AMP.BaseElement {
   hideControls() {
   }
 
+  /**
+   * @override
+   */
+  fullscreenEnter() {
+    fullscreenEnter(this.iframe_);
+  }
+
+  /**
+   * @override
+   */
+  fullscreenExit() {
+    fullscreenExit(this.iframe_);
+  }
+
   /** @override */
   getCurrentTime() {
     // Not supported.

diff --git a/extensions/amp-video/0.1/amp-video.js b/extensions/amp-video/0.1/amp-video.js
@@ -14,7 +14,7 @@
   * limitations under the License.
   */
 
-import {elementByTag} from '../../../src/dom';
+import {elementByTag, fullscreenEnter, fullscreenExit} from '../../../src/dom';
 import {listen} from '../../../src/event-helper';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {getMode} from '../../../src/mode';
@@ -176,9 +176,9 @@ class AmpVideo extends AMP.BaseElement {
     });
   }
 
-    /**
-     * @private
-     */
+  /**
+   * @private
+   */
   installEventHandlers_() {
     const video = dev().assertElement(this.video_);
     this.forwardEvents([VideoEvents.PLAYING, VideoEvents.PAUSE], video);
@@ -194,37 +194,37 @@ class AmpVideo extends AMP.BaseElement {
     });
   }
 
-    /** @override */
+  /** @override */
   pauseCallback() {
     if (this.video_) {
       this.video_.pause();
     }
   }
 
-    /** @private */
+  /** @private */
   isVideoSupported_() {
     return !!this.video_.play;
   }
 
-    // VideoInterface Implementation. See ../src/video-interface.VideoInterface
+  // VideoInterface Implementation. See ../src/video-interface.VideoInterface
 
-    /**
-     * @override
-     */
+  /**
+   * @override
+   */
   supportsPlatform() {
     return this.isVideoSupported_();
   }
 
-    /**
-     * @override
-     */
+  /**
+   * @override
+   */
   isInteractive() {
     return this.element.hasAttribute('controls');
   }
 
-    /**
-     * @override
-     */
+  /**
+   * @override
+   */
   play(unusedIsAutoplay) {
     const ret = this.video_.play();
 
@@ -239,41 +239,55 @@ class AmpVideo extends AMP.BaseElement {
     }
   }
 
-    /**
-     * @override
-     */
+  /**
+   * @override
+   */
   pause() {
     this.video_.pause();
   }
 
-    /**
-     * @override
-     */
+  /**
+   * @override
+   */
   mute() {
     this.video_.muted = true;
   }
 
-    /**
-     * @override
-     */
+  /**
+   * @override
+   */
   unmute() {
     this.video_.muted = false;
   }
 
-    /**
-     * @override
-     */
+  /**
+   * @override
+   */
   showControls() {
     this.video_.controls = true;
   }
 
-    /**
-     * @override
-     */
+  /**
+   * @override
+   */
   hideControls() {
     this.video_.controls = false;
   }
 
+  /**
+   * @override
+   */
+  fullscreenEnter() {
+    fullscreenEnter(this.video_);
+  }
+
+  /**
+   * @override
+   */
+  fullscreenExit() {
+    fullscreenExit(this.video_);
+  }
+
   /** @override */
   getCurrentTime() {
     return this.video_.currentTime;

diff --git a/extensions/amp-youtube/0.1/amp-youtube.js b/extensions/amp-youtube/0.1/amp-youtube.js
@@ -14,9 +14,13 @@
  * limitations under the License.
  */
 
-import {getDataParamsFromAttributes} from '../../../src/dom';
+import {
+  getDataParamsFromAttributes,
+  removeElement,
+  fullscreenEnter,
+  fullscreenExit,
+} from '../../../src/dom';
 import {tryParseJson} from '../../../src/json';
-import {removeElement} from '../../../src/dom';
 import {getData, listen} from '../../../src/event-helper';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {dev, user} from '../../../src/log';
@@ -433,6 +437,21 @@ class AmpYoutube extends AMP.BaseElement {
     // Not supported.
   }
 
+  /**
+   * @override
+   */
+  fullscreenEnter() {
+    fullscreenEnter(this.iframe_);
+  }
+
+  /**
+   * @override
+   */
+  fullscreenExit() {
+    fullscreenExit(this.iframe_);
+  }
+
+
   /** @override */
   getCurrentTime() {
     // Not supported.