src/widgets/PopcornPlayer.js
changeset 1072 ac1eacb3aa33
parent 1069 2409cb4cebaf
--- a/src/widgets/PopcornPlayer.js	Sun Nov 12 22:07:33 2017 +0100
+++ b/src/widgets/PopcornPlayer.js	Wed Sep 04 17:32:50 2024 +0200
@@ -1,139 +1,147 @@
-IriSP.Widgets.PopcornPlayer = function(player, config) {
-    IriSP.Widgets.Widget.call(this, player, config);
-};
-
-IriSP.Widgets.PopcornPlayer.prototype = new IriSP.Widgets.Widget();
+import jQuery from "jquery";
 
-/* A Popcorn-based player for HTML5 Video, Youtube and Vimeo */
-
-IriSP.Widgets.PopcornPlayer.prototype.defaults = {
-};
-
-IriSP.Widgets.PopcornPlayer.prototype.draw = function() {
-    if (typeof this.video === "undefined") {
-        this.video = this.media.video;
+const PopcornPlayer = function (ns) {
+  return class extends ns.Widgets.Widget {
+    constructor(player, config) {
+      super(player, config);
     }
 
-    if (this.url_transform) {
-        this.video = this.url_transform(this.video);
-    }
+    /* A Popcorn-based player for HTML5 Video, Youtube and Vimeo */
+
+    static defaults = {};
 
-    var _url = this.video;
+    draw() {
+      if (typeof this.video === "undefined") {
+        this.video = this.media.video;
+      }
 
-    if (/^(https?:\/\/)?(www\.)?youtube\.com/.test(this.video)) {
+      if (this.url_transform) {
+        this.video = this.url_transform(this.video);
+      }
+
+      var _url = this.video;
+
+      if (/^(https?:\/\/)?(www\.)?youtube\.com/.test(this.video)) {
         /* YOUTUBE */
         var _urlparts = this.video.split(/[?&]/),
-            _params = {};
+          _params = {};
         for (var i = 1; i < _urlparts.length; i++) {
-            var _ppart = _urlparts[i].split('=');
-            _params[_ppart[0]] = decodeURIComponent(_ppart[1]);
+          var _ppart = _urlparts[i].split("=");
+          _params[_ppart[0]] = decodeURIComponent(_ppart[1]);
         }
         _params.controls = 0;
         _params.modestbranding = 1;
         if (this.autostart || this.autoplay) {
-            _params.autoplay = 1;
+          _params.autoplay = 1;
         }
-        _url = _urlparts[0] + '?' + IriSP.jQuery.param(_params);
+        _url = _urlparts[0] + "?" + jQuery.param(_params);
+      } // else {
+      //     /* DEFAULT HTML5 */
+      //     var _tmpId = ns._.uniqueId("popcorn"),
+      //         _videoEl = jQuery('<video>');
+      //     _videoEl.attr({
+      //         id : _tmpId,
+      //         width : this.width,
+      //         height : this.height || undefined
+      //     });
+      //     if(typeof this.video === "string"){
+      //         _videoEl.attr("src",this.video);
+      //     } else {
+      //         for (var i = 0; i < this.video.length; i++) {
+      //             var _srcNode = jQuery('<source>');
+      //             _srcNode.attr({
+      //                 src: this.video[i].src,
+      //                 type: this.video[i].type
+      //             });
+      //             _videoEl.append(_srcNode);
+      //         }
+      //     }
+      //     this.$.html(_videoEl);
+      // }
 
-    }// else {
-    //     /* DEFAULT HTML5 */
-    //     var _tmpId = IriSP._.uniqueId("popcorn"),
-    //         _videoEl = IriSP.jQuery('<video>');
-    //     _videoEl.attr({
-    //         id : _tmpId,
-    //         width : this.width,
-    //         height : this.height || undefined
-    //     });
-    //     if(typeof this.video === "string"){
-    //         _videoEl.attr("src",this.video);
-    //     } else {
-    //         for (var i = 0; i < this.video.length; i++) {
-    //             var _srcNode = IriSP.jQuery('<source>');
-    //             _srcNode.attr({
-    //                 src: this.video[i].src,
-    //                 type: this.video[i].type
-    //             });
-    //             _videoEl.append(_srcNode);
-    //         }
-    //     }
-    //     this.$.html(_videoEl);
-    // }
+      var _popcorn = global.Popcorn.smart("#" + this.container, _url);
+
+      if (this.autostart || this.autoplay) {
+        _popcorn.autoplay(true);
+      }
+
+      var _media = this.media;
 
-    var _popcorn = Popcorn.smart("#"+this.container, _url);
-
-    if (this.autostart || this.autoplay) {
-        _popcorn.autoplay(true);
-    }
-
-    var _media = this.media;
+      // Binding functions to Popcorn
 
-    // Binding functions to Popcorn
-
-    _media.on("setcurrenttime", function(_milliseconds) {
+      _media.on("setcurrenttime", function (_milliseconds) {
         _popcorn.currentTime(_milliseconds / 1000);
-    });
+      });
 
-    _media.on("setvolume", function(_vol) {
+      _media.on("setvolume", function (_vol) {
         _popcorn.volume(_vol);
         _media.volume = _vol;
-    });
+      });
 
-    _media.on("setmuted", function(_muted) {
+      _media.on("setmuted", function (_muted) {
         _popcorn.muted(_muted);
         _media.muted = _muted;
-    });
+      });
 
-    _media.on("setplay", function() {
+      _media.on("setplay", function () {
         _popcorn.play();
-    });
+      });
 
-    _media.on("setpause", function() {
+      _media.on("setpause", function () {
         _popcorn.pause();
-    });
-    _media.on("settimerange", function(_timeRange){
+      });
+      _media.on("settimerange", function (_timeRange) {
         _media.timeRange = _timeRange;
         try {
-            if (_media.getCurrentTime() > _timeRange[0] || _media.getCurrentTime() < _timeRange){
-                _popcorn.currentTime(_timeRange[0] / 1000);
-            }
-        } catch (err) {
-        }
-    })
-    _media.on("resettimerange", function(){
+          if (
+            _media.getCurrentTime() > _timeRange[0] ||
+            _media.getCurrentTime() < _timeRange
+          ) {
+            _popcorn.currentTime(_timeRange[0] / 1000);
+          }
+        } catch (err) {}
+      });
+      _media.on("resettimerange", function () {
         _media.timeRange = false;
-    })
-    // Binding Popcorn events to media
+      });
+      // Binding Popcorn events to media
 
-    function getVolume() {
+      function getVolume() {
         _media.muted = _popcorn.muted();
         _media.volume = _popcorn.volume();
-    }
+      }
 
-    _popcorn.on("loadedmetadata", function() {
+      _popcorn.on("loadedmetadata", function () {
         getVolume();
         _media.trigger("loadedmetadata");
         _media.trigger("volumechange");
-    });
+      });
 
-    _popcorn.on("timeupdate", function() {
-        _media.trigger("timeupdate", new IriSP.Model.Time(1000*_popcorn.currentTime()));
-    });
+      _popcorn.on("timeupdate", function () {
+        _media.trigger(
+          "timeupdate",
+          new ns.Model.Time(1000 * _popcorn.currentTime())
+        );
+      });
 
-    _popcorn.on("volumechange", function() {
+      _popcorn.on("volumechange", function () {
         getVolume();
         _media.trigger("volumechange");
-    });
+      });
 
-    _popcorn.on("play", function(e) {
+      _popcorn.on("play", function (e) {
         _media.trigger("play");
-    });
+      });
 
-    _popcorn.on("pause", function() {
+      _popcorn.on("pause", function () {
         _media.trigger("pause");
-    });
+      });
 
-    _popcorn.on("seeked", function() {
+      _popcorn.on("seeked", function () {
         _media.trigger("seeked");
-    });
+      });
+    }
+  };
+};
 
-};
+export { PopcornPlayer };