@clappr/hlsjs-playback 1.0.1 → 1.2.0

package/dist/hlsjs-playback.external.js

@@ -2,7 +2,7 @@
   typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('@clappr/core'), require('hls.js')) :
   typeof define === 'function' && define.amd ? define(['@clappr/core', 'hls.js'], factory) :
   (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.HlsjsPlayback = factory(global.Clappr, global.Hls));
-})(this, (function (core, HLSJS) { 'use strict';
+}(this, (function (core, HLSJS) { 'use strict';
 
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -10,49 +10,65 @@
 
   function ownKeys(object, enumerableOnly) {
     var keys = Object.keys(object);
+
     if (Object.getOwnPropertySymbols) {
       var symbols = Object.getOwnPropertySymbols(object);
-      enumerableOnly && (symbols = symbols.filter(function (sym) {
-        return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-      })), keys.push.apply(keys, symbols);
+
+      if (enumerableOnly) {
+        symbols = symbols.filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+        });
+      }
+
+      keys.push.apply(keys, symbols);
     }
+
     return keys;
   }
+
   function _objectSpread2(target) {
     for (var i = 1; i < arguments.length; i++) {
-      var source = null != arguments[i] ? arguments[i] : {};
-      i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
-        _defineProperty(target, key, source[key]);
-      }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
-        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-      });
+      var source = arguments[i] != null ? arguments[i] : {};
+
+      if (i % 2) {
+        ownKeys(Object(source), true).forEach(function (key) {
+          _defineProperty(target, key, source[key]);
+        });
+      } else if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+      } else {
+        ownKeys(Object(source)).forEach(function (key) {
+          Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+      }
     }
+
     return target;
   }
+
   function _classCallCheck(instance, Constructor) {
     if (!(instance instanceof Constructor)) {
       throw new TypeError("Cannot call a class as a function");
     }
   }
+
   function _defineProperties(target, props) {
     for (var i = 0; i < props.length; i++) {
       var descriptor = props[i];
       descriptor.enumerable = descriptor.enumerable || false;
       descriptor.configurable = true;
       if ("value" in descriptor) descriptor.writable = true;
-      Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+      Object.defineProperty(target, descriptor.key, descriptor);
     }
   }
+
   function _createClass(Constructor, protoProps, staticProps) {
     if (protoProps) _defineProperties(Constructor.prototype, protoProps);
     if (staticProps) _defineProperties(Constructor, staticProps);
-    Object.defineProperty(Constructor, "prototype", {
-      writable: false
-    });
     return Constructor;
   }
+
   function _defineProperty(obj, key, value) {
-    key = _toPropertyKey(key);
     if (key in obj) {
       Object.defineProperty(obj, key, {
         value: value,
@@ -63,12 +79,15 @@
     } else {
       obj[key] = value;
     }
+
     return obj;
   }
+
   function _inherits(subClass, superClass) {
     if (typeof superClass !== "function" && superClass !== null) {
       throw new TypeError("Super expression must either be null or a function");
     }
+
     subClass.prototype = Object.create(superClass && superClass.prototype, {
       constructor: {
         value: subClass,
@@ -76,28 +95,30 @@
         configurable: true
       }
     });
-    Object.defineProperty(subClass, "prototype", {
-      writable: false
-    });
     if (superClass) _setPrototypeOf(subClass, superClass);
   }
+
   function _getPrototypeOf(o) {
-    _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {
+    _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
       return o.__proto__ || Object.getPrototypeOf(o);
     };
     return _getPrototypeOf(o);
   }
+
   function _setPrototypeOf(o, p) {
-    _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
+    _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
       o.__proto__ = p;
       return o;
     };
+
     return _setPrototypeOf(o, p);
   }
+
   function _isNativeReflectConstruct() {
     if (typeof Reflect === "undefined" || !Reflect.construct) return false;
     if (Reflect.construct.sham) return false;
     if (typeof Proxy === "function") return true;
+
     try {
       Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
       return true;
@@ -105,66 +126,84 @@
       return false;
     }
   }
+
   function _assertThisInitialized(self) {
     if (self === void 0) {
       throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
     }
+
     return self;
   }
+
   function _possibleConstructorReturn(self, call) {
     if (call && (typeof call === "object" || typeof call === "function")) {
       return call;
-    } else if (call !== void 0) {
-      throw new TypeError("Derived constructors may only return object or undefined");
     }
+
     return _assertThisInitialized(self);
   }
+
   function _createSuper(Derived) {
     var hasNativeReflectConstruct = _isNativeReflectConstruct();
+
     return function _createSuperInternal() {
       var Super = _getPrototypeOf(Derived),
-        result;
+          result;
+
       if (hasNativeReflectConstruct) {
         var NewTarget = _getPrototypeOf(this).constructor;
+
         result = Reflect.construct(Super, arguments, NewTarget);
       } else {
         result = Super.apply(this, arguments);
       }
+
       return _possibleConstructorReturn(this, result);
     };
   }
+
   function _superPropBase(object, property) {
     while (!Object.prototype.hasOwnProperty.call(object, property)) {
       object = _getPrototypeOf(object);
       if (object === null) break;
     }
+
     return object;
   }
-  function _get() {
+
+  function _get(target, property, receiver) {
     if (typeof Reflect !== "undefined" && Reflect.get) {
-      _get = Reflect.get.bind();
+      _get = Reflect.get;
     } else {
       _get = function _get(target, property, receiver) {
         var base = _superPropBase(target, property);
+
         if (!base) return;
         var desc = Object.getOwnPropertyDescriptor(base, property);
+
         if (desc.get) {
-          return desc.get.call(arguments.length < 3 ? target : receiver);
+          return desc.get.call(receiver);
         }
+
         return desc.value;
       };
     }
-    return _get.apply(this, arguments);
+
+    return _get(target, property, receiver || target);
   }
+
   function _toConsumableArray(arr) {
     return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
   }
+
   function _arrayWithoutHoles(arr) {
     if (Array.isArray(arr)) return _arrayLikeToArray(arr);
   }
+
   function _iterableToArray(iter) {
     if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
   }
+
   function _unsupportedIterableToArray(o, minLen) {
     if (!o) return;
     if (typeof o === "string") return _arrayLikeToArray(o, minLen);
@@ -173,90 +212,48 @@
     if (n === "Map" || n === "Set") return Array.from(o);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
   }
+
   function _arrayLikeToArray(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
+
     for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+
     return arr2;
   }
+
   function _nonIterableSpread() {
     throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
   }
-  function _toPrimitive(input, hint) {
-    if (typeof input !== "object" || input === null) return input;
-    var prim = input[Symbol.toPrimitive];
-    if (prim !== undefined) {
-      var res = prim.call(input, hint || "default");
-      if (typeof res !== "object") return res;
-      throw new TypeError("@@toPrimitive must return a primitive value.");
-    }
-    return (hint === "string" ? String : Number)(input);
-  }
-  function _toPropertyKey(arg) {
-    var key = _toPrimitive(arg, "string");
-    return typeof key === "symbol" ? key : String(key);
-  }
 
   var now = core.Utils.now,
-    assign = core.Utils.assign,
-    listContainsIgnoreCase = core.Utils.listContainsIgnoreCase;
+      listContainsIgnoreCase = core.Utils.listContainsIgnoreCase;
   var AUTO = -1;
+  var DEFAULT_RECOVER_ATTEMPTS = 16;
   core.Events.register('PLAYBACK_FRAGMENT_CHANGED');
   core.Events.register('PLAYBACK_FRAGMENT_PARSING_METADATA');
+
   var HlsjsPlayback = /*#__PURE__*/function (_HTML5Video) {
     _inherits(HlsjsPlayback, _HTML5Video);
+
     var _super = _createSuper(HlsjsPlayback);
+
     function HlsjsPlayback() {
       var _this;
+
       _classCallCheck(this, HlsjsPlayback);
+
       for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
         args[_key] = arguments[_key];
       }
+
       _this = _super.call.apply(_super, [this].concat(args));
-      // backwards compatibility (TODO: remove on 0.3.0)
-      _this.options.playback = _objectSpread2(_objectSpread2({}, _this.options), _this.options.playback);
       _this.options.hlsPlayback = _objectSpread2(_objectSpread2({}, _this.defaultOptions), _this.options.hlsPlayback);
-      _this._minDvrSize = typeof _this.options.hlsMinimumDvrSize === 'undefined' ? 60 : _this.options.hlsMinimumDvrSize;
-      // The size of the start time extrapolation window measured as a multiple of segments.
-      // Should be 2 or higher, or 0 to disable. Should only need to be increased above 2 if more than one segment is
-      // removed from the start of the playlist at a time. E.g if the playlist is cached for 10 seconds and new chunks are
-      // added/removed every 5.
-      _this._extrapolatedWindowNumSegments = !_this.options.playback || typeof _this.options.playback.extrapolatedWindowNumSegments === 'undefined' ? 2 : _this.options.playback.extrapolatedWindowNumSegments;
-      _this._playbackType = core.Playback.VOD;
-      _this._lastTimeUpdate = {
-        current: 0,
-        total: 0
-      };
-      _this._lastDuration = null;
-      // for hls streams which have dvr with a sliding window,
-      // the content at the start of the playlist is removed as new
-      // content is appended at the end.
-      // this means the actual playable start time will increase as the
-      // start content is deleted
-      // For streams with dvr where the entire recording is kept from the
-      // beginning this should stay as 0
-      _this._playableRegionStartTime = 0;
-      // {local, remote} remote is the time in the video element that should represent 0
-      //                 local is the system time when the 'remote' measurment took place
-      _this._localStartTimeCorrelation = null;
-      // {local, remote} remote is the time in the video element that should represents the end
-      //                 local is the system time when the 'remote' measurment took place
-      _this._localEndTimeCorrelation = null;
-      // if content is removed from the beginning then this empty area should
-      // be ignored. "playableRegionDuration" excludes the empty area
-      _this._playableRegionDuration = 0;
-      // #EXT-X-PROGRAM-DATE-TIME
-      _this._programDateTime = 0;
-      // true when the actual duration is longer than hlsjs's live sync point
-      // when this is false playableRegionDuration will be the actual duration
-      // when this is true playableRegionDuration will exclude the time after the sync point
-      _this._durationExcludesAfterLiveSyncPoint = false;
-      // #EXT-X-TARGETDURATION
-      _this._segmentTargetDuration = null;
-      // #EXT-X-PLAYLIST-TYPE
-      _this._playlistType = null;
-      _this._recoverAttemptsRemaining = _this.options.hlsRecoverAttempts || 16;
+
+      _this._setInitialState();
+
       return _this;
     }
+
     _createClass(HlsjsPlayback, [{
       key: "name",
       get: function get() {
@@ -266,7 +263,7 @@
       key: "supportedVersion",
       get: function get() {
         return {
-          min: "0.4.27"
+          min: "0.4.18"
         };
       }
     }, {
@@ -289,6 +286,16 @@
       get: function get() {
         return this._isReadyState;
       }
+    }, {
+      key: "latency",
+      get: function get() {
+        return this._hls.latency;
+      }
+    }, {
+      key: "currentProgramDateTime",
+      get: function get() {
+        return this._hls.playingDate;
+      }
     }, {
       key: "_startTime",
       get: function get() {
@@ -299,40 +306,36 @@
       key: "_now",
       get: function get() {
         return now();
-      }
-
-      // the time in the video element which should represent the start of the sliding window
+      } // the time in the video element which should represent the start of the sliding window
       // extrapolated to increase in real time (instead of jumping as the early segments are removed)
+
     }, {
       key: "_extrapolatedStartTime",
       get: function get() {
         if (!this._localStartTimeCorrelation) return this._playableRegionStartTime;
         var corr = this._localStartTimeCorrelation;
         var timePassed = this._now - corr.local;
-        var extrapolatedWindowStartTime = (corr.remote + timePassed) / 1000;
-        // cap at the end of the extrapolated window duration
-        return Math.min(extrapolatedWindowStartTime, this._playableRegionStartTime + this._extrapolatedWindowDuration);
-      }
+        var extrapolatedWindowStartTime = (corr.remote + timePassed) / 1000; // cap at the end of the extrapolated window duration
 
-      // the time in the video element which should represent the end of the content
+        return Math.min(extrapolatedWindowStartTime, this._playableRegionStartTime + this._extrapolatedWindowDuration);
+      } // the time in the video element which should represent the end of the content
       // extrapolated to increase in real time (instead of jumping as segments are added)
+
     }, {
       key: "_extrapolatedEndTime",
       get: function get() {
         var actualEndTime = this._playableRegionStartTime + this._playableRegionDuration;
         if (!this._localEndTimeCorrelation) return actualEndTime;
-        var corr = this._localEndTimeCorrelation;
-        var timePassed = this._now - corr.local;
-        var extrapolatedEndTime = (corr.remote + timePassed) / 1000;
+        var correlation = this._localEndTimeCorrelation;
+        var timePassed = this._now - correlation.local;
+        var extrapolatedEndTime = (correlation.remote + timePassed) / 1000;
         return Math.max(actualEndTime - this._extrapolatedWindowDuration, Math.min(extrapolatedEndTime, actualEndTime));
       }
     }, {
       key: "_duration",
       get: function get() {
         return this._extrapolatedEndTime - this._startTime;
-      }
-
-      // Returns the duration (seconds) of the window that the extrapolated start time is allowed
+      } // Returns the duration (seconds) of the window that the extrapolated start time is allowed
       // to move in before being capped.
       // The extrapolated start time should never reach the cap at the end of the window as the
       // window should slide as chunks are removed from the start.
@@ -349,6 +352,7 @@
       //                               .       .       .   --> |
       //                               .       .       .       .
       //                                 extrapolatedStartTime
+
     }, {
       key: "_extrapolatedWindowDuration",
       get: function get() {
@@ -372,55 +376,152 @@
       get: function get() {
         return this.options.hlsPlayback && this.options.hlsPlayback.customListeners || [];
       }
+    }, {
+      key: "sourceMedia",
+      get: function get() {
+        return this.options.src;
+      }
+    }, {
+      key: "_setInitialState",
+      value: function _setInitialState() {
+        this._minDvrSize = typeof this.options.hlsMinimumDvrSize === 'undefined' ? 60 : this.options.hlsMinimumDvrSize; // The size of the start time extrapolation window measured as a multiple of segments.
+        // Should be 2 or higher, or 0 to disable. Should only need to be increased above 2 if more than one segment is
+        // removed from the start of the playlist at a time. E.g if the playlist is cached for 10 seconds and new chunks are
+        // added/removed every 5.
+
+        this._extrapolatedWindowNumSegments = !this.options.playback || typeof this.options.playback.extrapolatedWindowNumSegments === 'undefined' ? 2 : this.options.playback.extrapolatedWindowNumSegments;
+        this._playbackType = core.Playback.VOD;
+        this._lastTimeUpdate = {
+          current: 0,
+          total: 0
+        };
+        this._lastDuration = null; // for hls streams which have dvr with a sliding window,
+        // the content at the start of the playlist is removed as new
+        // content is appended at the end.
+        // this means the actual playable start time will increase as the
+        // start content is deleted
+        // For streams with dvr where the entire recording is kept from the
+        // beginning this should stay as 0
+
+        this._playableRegionStartTime = 0; // {local, remote} remote is the time in the video element that should represent 0
+        //                 local is the system time when the 'remote' measurment took place
+
+        this._localStartTimeCorrelation = null; // {local, remote} remote is the time in the video element that should represents the end
+        //                 local is the system time when the 'remote' measurment took place
+
+        this._localEndTimeCorrelation = null; // if content is removed from the beginning then this empty area should
+        // be ignored. "playableRegionDuration" excludes the empty area
+
+        this._playableRegionDuration = 0; // #EXT-X-PROGRAM-DATE-TIME
+
+        this._programDateTime = 0; // true when the actual duration is longer than hlsjs's live sync point
+        // when this is false playableRegionDuration will be the actual duration
+        // when this is true playableRegionDuration will exclude the time after the sync point
+
+        this._durationExcludesAfterLiveSyncPoint = false; // #EXT-X-TARGETDURATION
+
+        this._segmentTargetDuration = null; // #EXT-X-PLAYLIST-TYPE
+
+        this._playlistType = null;
+        this._recoverAttemptsRemaining = this.options.hlsRecoverAttempts || DEFAULT_RECOVER_ATTEMPTS;
+      }
     }, {
       key: "_setup",
       value: function _setup() {
-        var _this2 = this;
+        this._destroyHLSInstance();
+
+        this._createHLSInstance();
+
+        this._listenHLSEvents();
+
+        this._attachHLSMedia();
+      }
+    }, {
+      key: "_destroyHLSInstance",
+      value: function _destroyHLSInstance() {
+        if (!this._hls) return;
         this._manifestParsed = false;
         this._ccIsSetup = false;
         this._ccTracksUpdated = false;
-        this._hls && this._hls.destroy();
-        this._hls = new HLSJS__default["default"](assign({}, this.options.playback.hlsjsConfig));
-        this._hls.once(HLSJS__default["default"].Events.MEDIA_ATTACHED, function () {
+
+        this._setInitialState();
+
+        this._hls.destroy();
+
+        this._hls = null;
+      }
+    }, {
+      key: "_createHLSInstance",
+      value: function _createHLSInstance() {
+        var config = _objectSpread2({}, this.options.playback.hlsjsConfig);
+
+        this._hls = new HLSJS__default['default'](config);
+      }
+    }, {
+      key: "_attachHLSMedia",
+      value: function _attachHLSMedia() {
+        if (!this._hls) return;
+
+        this._hls.attachMedia(this.el);
+      }
+    }, {
+      key: "_listenHLSEvents",
+      value: function _listenHLSEvents() {
+        var _this2 = this;
+
+        if (!this._hls) return;
+
+        this._hls.once(HLSJS__default['default'].Events.MEDIA_ATTACHED, function () {
           _this2.options.hlsPlayback.preload && _this2._hls.loadSource(_this2.options.src);
         });
-        this._hls.on(HLSJS__default["default"].Events.MANIFEST_PARSED, function () {
+
+        this._hls.on(HLSJS__default['default'].Events.MANIFEST_PARSED, function () {
           return _this2._manifestParsed = true;
         });
-        this._hls.on(HLSJS__default["default"].Events.LEVEL_LOADED, function (evt, data) {
+
+        this._hls.on(HLSJS__default['default'].Events.LEVEL_LOADED, function (evt, data) {
           return _this2._updatePlaybackType(evt, data);
         });
-        this._hls.on(HLSJS__default["default"].Events.LEVEL_UPDATED, function (evt, data) {
+
+        this._hls.on(HLSJS__default['default'].Events.LEVEL_UPDATED, function (evt, data) {
           return _this2._onLevelUpdated(evt, data);
         });
-        this._hls.on(HLSJS__default["default"].Events.LEVEL_SWITCHING, function (evt, data) {
+
+        this._hls.on(HLSJS__default['default'].Events.LEVEL_SWITCHING, function (evt, data) {
           return _this2._onLevelSwitch(evt, data);
         });
-        this._hls.on(HLSJS__default["default"].Events.FRAG_CHANGED, function (evt, data) {
+
+        this._hls.on(HLSJS__default['default'].Events.FRAG_CHANGED, function (evt, data) {
           return _this2._onFragmentChanged(evt, data);
         });
-        this._hls.on(HLSJS__default["default"].Events.FRAG_LOADED, function (evt, data) {
+
+        this._hls.on(HLSJS__default['default'].Events.FRAG_LOADED, function (evt, data) {
           return _this2._onFragmentLoaded(evt, data);
         });
-        this._hls.on(HLSJS__default["default"].Events.FRAG_PARSING_METADATA, function (evt, data) {
+
+        this._hls.on(HLSJS__default['default'].Events.FRAG_PARSING_METADATA, function (evt, data) {
           return _this2._onFragmentParsingMetadata(evt, data);
         });
-        this._hls.on(HLSJS__default["default"].Events.ERROR, function (evt, data) {
+
+        this._hls.on(HLSJS__default['default'].Events.ERROR, function (evt, data) {
           return _this2._onHLSJSError(evt, data);
         });
-        this._hls.on(HLSJS__default["default"].Events.SUBTITLE_TRACK_LOADED, function (evt, data) {
+
+        this._hls.on(HLSJS__default['default'].Events.SUBTITLE_TRACK_LOADED, function (evt, data) {
           return _this2._onSubtitleLoaded(evt, data);
         });
-        this._hls.on(HLSJS__default["default"].Events.SUBTITLE_TRACKS_UPDATED, function () {
+
+        this._hls.on(HLSJS__default['default'].Events.SUBTITLE_TRACKS_UPDATED, function () {
           return _this2._ccTracksUpdated = true;
         });
+
         this.bindCustomListeners();
-        this._hls.attachMedia(this.el);
       }
     }, {
       key: "bindCustomListeners",
       value: function bindCustomListeners() {
         var _this3 = this;
+
         this.customListeners.forEach(function (item) {
           var requestedEventName = item.eventName;
           var typeOfListener = item.once ? 'once' : 'on';
@@ -431,6 +532,7 @@
       key: "unbindCustomListeners",
       value: function unbindCustomListeners() {
         var _this4 = this;
+
         this.customListeners.forEach(function (item) {
           var requestedEventName = item.eventName;
           requestedEventName && _this4._hls.off(requestedEventName, item.callback);
@@ -448,6 +550,7 @@
       key: "render",
       value: function render() {
         this._ready();
+
         return _get(_getPrototypeOf(HlsjsPlayback.prototype), "render", this).call(this);
       }
     }, {
@@ -463,10 +566,13 @@
       value: function _recover(evt, data, error) {
         if (!this._recoveredDecodingError) {
           this._recoveredDecodingError = true;
+
           this._hls.recoverMediaError();
         } else if (!this._recoveredAudioCodecError) {
           this._recoveredAudioCodecError = true;
+
           this._hls.swapAudioCodec();
+
           this._hls.recoverMediaError();
         } else {
           core.Log.error('hlsjs: failed to recover', {
@@ -478,21 +584,22 @@
           this.trigger(core.Events.PLAYBACK_ERROR, formattedError);
           this.stop();
         }
-      }
+      } // override
+      // this playback manages the src on the video element itself
 
-      // override
     }, {
       key: "_setupSrc",
-      value: function _setupSrc(srcUrl) {// eslint-disable-line no-unused-vars
-        // this playback manages the src on the video element itself
-      }
+      value: function _setupSrc(srcUrl) {} // eslint-disable-line no-unused-vars
+
     }, {
       key: "_startTimeUpdateTimer",
       value: function _startTimeUpdateTimer() {
         var _this5 = this;
+
         if (this._timeUpdateTimer) return;
         this._timeUpdateTimer = setInterval(function () {
           _this5._onDurationChange();
+
           _this5._onTimeUpdate();
         }, 100);
       }
@@ -507,10 +614,10 @@
       key: "getProgramDateTime",
       value: function getProgramDateTime() {
         return this._programDateTime;
-      }
-      // the duration on the video element itself should not be used
+      } // the duration on the video element itself should not be used
       // as this does not necesarily represent the duration of the stream
       // https://github.com/clappr/clappr/issues/668#issuecomment-157036678
+
     }, {
       key: "getDuration",
       value: function getDuration() {
@@ -523,11 +630,10 @@
         // eventually they will then be kicked to the end by hlsjs if they run out of buffer
         // before the official start time
         return Math.max(0, this.el.currentTime - this._startTime);
-      }
-
-      // the time that "0" now represents relative to when playback started
+      } // the time that "0" now represents relative to when playback started
       // for a stream with a sliding window this will increase as content is
       // removed from the beginning
+
     }, {
       key: "getStartTimeOffset",
       value: function getStartTimeOffset() {
@@ -536,8 +642,7 @@
     }, {
       key: "seekPercentage",
       value: function seekPercentage(percentage) {
-        var seekTo = this._duration;
-        if (percentage > 0) seekTo = this._duration * (percentage / 100);
+        var seekTo = percentage > 0 ? this._duration * (percentage / 100) : this._duration;
         this.seek(seekTo);
       }
     }, {
@@ -546,8 +651,9 @@
         if (time < 0) {
           core.Log.warn('Attempt to seek to a negative time. Resetting to live point. Use seekToLivePoint() to seek to the live point.');
           time = this.getDuration();
-        }
-        // assume live if time within 3 seconds of end of stream
+        } // assume live if time within 3 seconds of end of stream
+
+
         this.dvrEnabled && this._updateDvr(time < this.getDuration() - 3);
         time += this._startTime;
         this.el.currentTime = time;
@@ -581,23 +687,24 @@
           raw: data
         };
         var formattedError;
-        if (data.response) error.description += ", response: ".concat(JSON.stringify(data.response));
-        // only report/handle errors if they are fatal
+        if (data.response) error.description += ", response: ".concat(JSON.stringify(data.response)); // only report/handle errors if they are fatal
         // hlsjs should automatically handle non fatal errors
+
         if (data.fatal) {
           if (this._recoverAttemptsRemaining > 0) {
             this._recoverAttemptsRemaining -= 1;
+
             switch (data.type) {
-              case HLSJS__default["default"].ErrorTypes.NETWORK_ERROR:
+              case HLSJS__default['default'].ErrorTypes.NETWORK_ERROR:
                 switch (data.details) {
                   // The following network errors cannot be recovered with HLS.startLoad()
                   // For more details, see https://github.com/video-dev/hls.js/blob/master/doc/design.md#error-detection-and-handling
                   // For "level load" fatal errors, see https://github.com/video-dev/hls.js/issues/1138
-                  case HLSJS__default["default"].ErrorDetails.MANIFEST_LOAD_ERROR:
-                  case HLSJS__default["default"].ErrorDetails.MANIFEST_LOAD_TIMEOUT:
-                  case HLSJS__default["default"].ErrorDetails.MANIFEST_PARSING_ERROR:
-                  case HLSJS__default["default"].ErrorDetails.LEVEL_LOAD_ERROR:
-                  case HLSJS__default["default"].ErrorDetails.LEVEL_LOAD_TIMEOUT:
+                  case HLSJS__default['default'].ErrorDetails.MANIFEST_LOAD_ERROR:
+                  case HLSJS__default['default'].ErrorDetails.MANIFEST_LOAD_TIMEOUT:
+                  case HLSJS__default['default'].ErrorDetails.MANIFEST_PARSING_ERROR:
+                  case HLSJS__default['default'].ErrorDetails.LEVEL_LOAD_ERROR:
+                  case HLSJS__default['default'].ErrorDetails.LEVEL_LOAD_TIMEOUT:
                     core.Log.error('hlsjs: unrecoverable network fatal error.', {
                       evt: evt,
                       data: data
@@ -606,24 +713,32 @@
                     this.trigger(core.Events.PLAYBACK_ERROR, formattedError);
                     this.stop();
                     break;
+
                   default:
                     core.Log.warn('hlsjs: trying to recover from network error.', {
                       evt: evt,
                       data: data
                     });
                     error.level = core.PlayerError.Levels.WARN;
+
                     this._hls.startLoad();
+
                     break;
                 }
+
                 break;
-              case HLSJS__default["default"].ErrorTypes.MEDIA_ERROR:
+
+              case HLSJS__default['default'].ErrorTypes.MEDIA_ERROR:
                 core.Log.warn('hlsjs: trying to recover from media error.', {
                   evt: evt,
                   data: data
                 });
                 error.level = core.PlayerError.Levels.WARN;
+
                 this._recover(evt, data, error);
+
                 break;
+
               default:
                 core.Log.error('hlsjs: could not recover from error.', {
                   evt: evt,
@@ -658,6 +773,7 @@
             this.stop();
             return;
           }
+
           error.level = core.PlayerError.Levels.WARN;
           core.Log.warn('hlsjs: non-fatal error occurred', {
             evt: evt,
@@ -668,7 +784,7 @@
     }, {
       key: "_keyIsDenied",
       value: function _keyIsDenied(data) {
-        return data.type === HLSJS__default["default"].ErrorTypes.NETWORK_ERROR && data.details === HLSJS__default["default"].ErrorDetails.KEY_LOAD_ERROR && data.response && data.response.code >= 400;
+        return data.type === HLSJS__default['default'].ErrorTypes.NETWORK_ERROR && data.details === HLSJS__default['default'].ErrorDetails.KEY_LOAD_ERROR && data.response && data.response.code >= 400;
       }
     }, {
       key: "_onTimeUpdate",
@@ -689,6 +805,7 @@
         var duration = this.getDuration();
         if (this._lastDuration === duration) return;
         this._lastDuration = duration;
+
         _get(_getPrototypeOf(HlsjsPlayback.prototype), "_onDurationChange", this).call(this);
       }
     }, {
@@ -697,6 +814,7 @@
         if (!this.el.buffered.length) return;
         var buffered = [];
         var bufferedPos = 0;
+
         for (var i = 0; i < this.el.buffered.length; i++) {
           buffered = [].concat(_toConsumableArray(buffered), [{
             // for a stream with sliding window dvr something that is buffered my slide off the start of the timeline
@@ -705,6 +823,7 @@
           }]);
           if (this.el.currentTime >= buffered[i].start && this.el.currentTime <= buffered[i].end) bufferedPos = i;
         }
+
         var progress = {
           start: buffered[bufferedPos].start,
           current: buffered[bufferedPos].end,
@@ -712,12 +831,23 @@
         };
         this.trigger(core.Events.PLAYBACK_PROGRESS, progress, buffered);
       }
+    }, {
+      key: "load",
+      value: function load(url) {
+        this._stopTimeUpdateTimer();
+
+        this.options.src = url;
+
+        this._setup();
+      }
     }, {
       key: "play",
       value: function play() {
         !this._hls && this._setup();
         !this._manifestParsed && !this.options.hlsPlayback.preload && this._hls.loadSource(this.options.src);
+
         _get(_getPrototypeOf(HlsjsPlayback.prototype), "play", this).call(this);
+
         this._startTimeUpdateTimer();
       }
     }, {
@@ -731,29 +861,28 @@
       key: "stop",
       value: function stop() {
         this._stopTimeUpdateTimer();
-        if (this._hls) {
-          _get(_getPrototypeOf(HlsjsPlayback.prototype), "stop", this).call(this);
-          this._hls.destroy();
-          delete this._hls;
-        }
+
+        if (this._hls) _get(_getPrototypeOf(HlsjsPlayback.prototype), "stop", this).call(this);
+
+        this._destroyHLSInstance();
       }
     }, {
       key: "destroy",
       value: function destroy() {
         this._stopTimeUpdateTimer();
-        if (this._hls) {
-          this._hls.destroy();
-          delete this._hls;
-        }
+
+        this._destroyHLSInstance();
+
         _get(_getPrototypeOf(HlsjsPlayback.prototype), "destroy", this).call(this);
       }
     }, {
       key: "_updatePlaybackType",
       value: function _updatePlaybackType(evt, data) {
         this._playbackType = data.details.live ? core.Playback.LIVE : core.Playback.VOD;
-        this._onLevelUpdated(evt, data);
 
-        // Live stream subtitle tracks detection hack (may not immediately available)
+        this._onLevelUpdated(evt, data); // Live stream subtitle tracks detection hack (may not immediately available)
+
+
         if (this._ccTracksUpdated && this._playbackType === core.Playback.LIVE && this.hasClosedCaptionsTracks) this._onSubtitleLoaded();
       }
     }, {
@@ -778,14 +907,15 @@
         var fragments = data.details.fragments;
         var previousPlayableRegionStartTime = this._playableRegionStartTime;
         var previousPlayableRegionDuration = this._playableRegionDuration;
-        if (fragments.length === 0) return;
+        if (fragments.length === 0) return; // #EXT-X-PROGRAM-DATE-TIME
 
-        // #EXT-X-PROGRAM-DATE-TIME
         if (fragments[0].rawProgramDateTime) this._programDateTime = fragments[0].rawProgramDateTime;
+
         if (this._playableRegionStartTime !== fragments[0].start) {
           startTimeChanged = true;
           this._playableRegionStartTime = fragments[0].start;
         }
+
         if (startTimeChanged) {
           if (!this._localStartTimeCorrelation) {
             // set the correlation to map to middle of the extrapolation window
@@ -796,9 +926,10 @@
           } else {
             // check if the correlation still works
             var corr = this._localStartTimeCorrelation;
-            var timePassed = this._now - corr.local;
-            // this should point to a time within the extrapolation window
+            var timePassed = this._now - corr.local; // this should point to a time within the extrapolation window
+
             var startTime = (corr.remote + timePassed) / 1000;
+
             if (startTime < fragments[0].start) {
               // our start time is now earlier than the first chunk
               // (maybe the chunk was removed early)
@@ -819,15 +950,17 @@
             }
           }
         }
-        var newDuration = data.details.totalduration;
-        // if it's a live stream then shorten the duration to remove access
+
+        var newDuration = data.details.totalduration; // if it's a live stream then shorten the duration to remove access
         // to the area after hlsjs's live sync point
         // seeks to areas after this point sometimes have issues
+
         if (this._playbackType === core.Playback.LIVE) {
           var fragmentTargetDuration = data.details.targetduration;
           var hlsjsConfig = this.options.playback.hlsjsConfig || {};
-          var liveSyncDurationCount = hlsjsConfig.liveSyncDurationCount || HLSJS__default["default"].DefaultConfig.liveSyncDurationCount;
+          var liveSyncDurationCount = hlsjsConfig.liveSyncDurationCount || HLSJS__default['default'].DefaultConfig.liveSyncDurationCount;
           var hiddenAreaDuration = fragmentTargetDuration * liveSyncDurationCount;
+
           if (hiddenAreaDuration <= newDuration) {
             newDuration -= hiddenAreaDuration;
             this._durationExcludesAfterLiveSyncPoint = true;
@@ -835,16 +968,18 @@
             this._durationExcludesAfterLiveSyncPoint = false;
           }
         }
+
         if (newDuration !== this._playableRegionDuration) {
           durationChanged = true;
           this._playableRegionDuration = newDuration;
-        }
-
-        // Note the end time is not the playableRegionDuration
+        } // Note the end time is not the playableRegionDuration
         // The end time will always increase even if content is removed from the beginning
+
+
         var endTime = fragments[0].start + newDuration;
         var previousEndTime = previousPlayableRegionStartTime + previousPlayableRegionDuration;
         var endTimeChanged = endTime !== previousEndTime;
+
         if (endTimeChanged) {
           if (!this._localEndTimeCorrelation) {
             // set the correlation to map to the end
@@ -855,9 +990,12 @@
           } else {
             // check if the correlation still works
             var _corr = this._localEndTimeCorrelation;
-            var _timePassed = this._now - _corr.local;
-            // this should point to a time within the extrapolation window from the end
+
+            var _timePassed = this._now - _corr.local; // this should point to a time within the extrapolation window from the end
+
+
             var extrapolatedEndTime = (_corr.remote + _timePassed) / 1000;
+
             if (extrapolatedEndTime > endTime) {
               this._localEndTimeCorrelation = {
                 local: this._now,
@@ -880,10 +1018,10 @@
               };
             }
           }
-        }
-
-        // now that the values have been updated call any methods that use on them so they get the updated values
+        } // now that the values have been updated call any methods that use on them so they get the updated values
         // immediately
+
+
         durationChanged && this._onDurationChange();
         startTimeChanged && this._onProgress();
       }
@@ -916,6 +1054,7 @@
         this.trigger(core.Events.PLAYBACK_LEVEL_SWITCH_END);
         this.trigger(core.Events.PLAYBACK_LEVEL_SWITCH, data);
         var currentLevel = this._hls.levels[data.level];
+
         if (currentLevel) {
           // TODO should highDefinition be private and maybe have a read only accessor if it's used somewhere
           this.highDefinition = currentLevel.height >= 720 || currentLevel.bitrate / 1000 >= 2000;
@@ -951,17 +1090,19 @@
     }], [{
       key: "HLSJS",
       get: function get() {
-        return HLSJS__default["default"];
+        return HLSJS__default['default'];
       }
     }]);
+
     return HlsjsPlayback;
   }(core.HTML5Video);
+
   HlsjsPlayback.canPlay = function (resource, mimeType) {
     var resourceParts = resource.split('?')[0].match(/.*\.(.*)$/) || [];
     var isHls = resourceParts.length > 1 && resourceParts[1].toLowerCase() === 'm3u8' || listContainsIgnoreCase(mimeType, ['application/vnd.apple.mpegurl', 'application/x-mpegURL']);
-    return !!(HLSJS__default["default"].isSupported() && isHls);
+    return !!(HLSJS__default['default'].isSupported() && isHls);
   };
 
   return HlsjsPlayback;
 
-}));
+})));