fix(player): Set play request for Ads when clicking on media; fixed w…

…orkflow to check if player can play media; removed setting controls when requesting Ads
openplayerjs · Oct 5, 2018 · ff748bd · ff748bd
1 parent e1d31ba
commit ff748bd
Show file tree

Hide file tree

Showing 6 changed files with 41 additions and 17 deletions.
diff --git a/dist/openplayer.js b/dist/openplayer.js
@@ -5109,6 +5109,10 @@ var Play = function () {
         var el = _this.player.activeElement();
 
         if (el.paused || el.ended) {
+          if (_this.player.adsInstance) {
+            _this.player.adsInstance.playRequested = true;
+          }
+
           el.play();
         } else {
           el.pause();
@@ -6229,7 +6233,11 @@ var Media = function () {
       }
 
       if (this.media && typeof this.media.destroy === 'function') {
-        this.media.destroy();
+        var sameMedia = sources.length === 1 && sources[0].src === this.media.media.src;
+
+        if (!sameMedia) {
+          this.media.destroy();
+        }
       }
 
       sources.some(function (media) {
@@ -6239,7 +6247,14 @@ var Media = function () {
           _this3.media = new html5_1.default(_this3.element, media);
         }
 
-        return _this3.canPlayType(media.type);
+        var canPlay = _this3.canPlayType(media.type);
+
+        if (!canPlay) {
+          _this3.media = new html5_1.default(_this3.element, media);
+          return _this3.canPlayType(media.type);
+        }
+
+        return canPlay;
       });
 
       try {
@@ -7357,7 +7372,6 @@ var Ads = function () {
       this.adsRequest.setAdWillAutoPlay(this.autoplayAllowed);
       this.adsRequest.setAdWillPlayMuted(this.autoplayRequiresMuted);
       this.adsLoader.requestAds(this.adsRequest);
-      this.element.controls = !(constants_1.IS_IPHONE && general_1.isVideo(this.element));
     }
   }, {
     key: "_contentLoadedAction",

diff --git a/dist/openplayer.min.js b/dist/openplayer.min.js
diff --git a/src/js/controls/play.ts b/src/js/controls/play.ts
@@ -80,6 +80,9 @@ class Play implements PlayerComponent {
             this.button.setAttribute('aria-pressed', 'true');
             const el = this.player.activeElement();
             if (el.paused || el.ended) {
+                if (this.player.adsInstance) {
+                    this.player.adsInstance.playRequested = true;
+                }
                 el.play();
             } else {
                 el.pause();

diff --git a/src/js/media.ts b/src/js/media.ts
@@ -348,9 +348,12 @@ class Media {
             throw new TypeError('Media not set');
         }
 
-        // Remove previous media if any is detected
+        // Remove previous media if any is detected and it's different from current one
         if (this.media && typeof this.media.destroy === 'function') {
-            this.media.destroy();
+            const sameMedia = sources.length === 1 && sources[0].src === this.media.media.src;
+            if (!sameMedia) {
+                this.media.destroy();
+            }
         }
 
         // Loop until first playable source is found
@@ -361,7 +364,13 @@ class Media {
                 this.media = new HTML5Media(this.element, media);
             }
 
-            return this.canPlayType(media.type);
+            // If not valid, make one last attempt to check if it plays with native HTML5
+            const canPlay = this.canPlayType(media.type);
+            if (!canPlay) {
+                this.media = new HTML5Media(this.element, media);
+                return this.canPlayType(media.type);
+            }
+            return canPlay;
         });
 
         try {

diff --git a/src/js/media/ads.ts b/src/js/media/ads.ts
@@ -892,8 +892,6 @@ class Ads {
         this.adsRequest.setAdWillAutoPlay(this.autoplayAllowed);
         this.adsRequest.setAdWillPlayMuted(this.autoplayRequiresMuted);
         this.adsLoader.requestAds(this.adsRequest);
-
-        this.element.controls = !(IS_IPHONE && isVideo(this.element));
     }
 
     /**

diff --git a/src/js/player.ts b/src/js/player.ts
@@ -86,6 +86,14 @@ class Player {
      */
     public controls: Controls;
 
+    /**
+     * Instance of Ads object.
+     *
+     * @type Ads
+     * @memberof Player
+     */
+    public adsInstance?: Ads;
+
     /**
      * Unique identified for the current player instance.
      *
@@ -111,14 +119,6 @@ class Player {
      */
     private ads?: string|string[];
 
-    /**
-     * Instance of Ads object.
-     *
-     * @type Ads
-     * @memberof Player
-     */
-    private adsInstance?: Ads;
-
     /**
      * Flag to determine if player must be scaled and scrop to fit parent container
      * (only for video elements)