@gcorevideo/player 2.20.4 → 2.20.6

package/dist/index.js

@@ -11152,13 +11152,13 @@ var config = {};
 
 function noop$1() {}
 
-var on$1 = noop$1;
+var on = noop$1;
 var addListener = noop$1;
-var once$1 = noop$1;
-var off$1 = noop$1;
+var once = noop$1;
+var off = noop$1;
 var removeListener = noop$1;
 var removeAllListeners = noop$1;
-var emit$1 = noop$1;
+var emit = noop$1;
 
 function binding(name) {
     throw new Error('process.binding is not supported');
@@ -11211,13 +11211,13 @@ var browser$1 = {
   argv: argv,
   version: version$2,
   versions: versions,
-  on: on$1,
+  on: on,
   addListener: addListener,
-  once: once$1,
-  off: off$1,
+  once: once,
+  off: off,
   removeListener: removeListener,
   removeAllListeners: removeAllListeners,
-  emit: emit$1,
+  emit: emit,
   binding: binding,
   cwd: cwd,
   chdir: chdir,
@@ -12114,186 +12114,359 @@ function ifError(err) {
   if (err) throw err;
 }
 
-/**
- * event-lite.js - Light-weight EventEmitter (less than 1KB when gzipped)
- *
- * @copyright Yusuke Kawasaki
- * @license MIT
- * @constructor
- * @see https://github.com/kawanet/event-lite
- * @see http://kawanet.github.io/event-lite/EventLite.html
- * @example
- * var EventLite = require("event-lite");
- *
- * function MyClass() {...}             // your class
- *
- * EventLite.mixin(MyClass.prototype);  // import event methods
- *
- * var obj = new MyClass();
- * obj.on("foo", function() {...});     // add event listener
- * obj.once("bar", function() {...});   // add one-time event listener
- * obj.emit("foo");                     // dispatch event
- * obj.emit("bar");                     // dispatch another event
- * obj.off("foo");                      // remove event listener
- */
-
-function EventLite() {
-  if (!(this instanceof EventLite)) return new EventLite();
+function getDefaultExportFromCjs$1 (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
 }
 
-// (function(EventLite) {
-  // export the class for node.js
-  // if ("undefined" !== typeof module) module.exports = EventLite;
+var eventemitter3$1 = {exports: {}};
 
-  // property name to hold listeners
-  var LISTENERS = "listeners";
+var hasRequiredEventemitter3;
 
-  // methods to export
-  var methods = {
-    on: on,
-    once: once,
-    off: off,
-    emit: emit
-  };
+function requireEventemitter3 () {
+	if (hasRequiredEventemitter3) return eventemitter3$1.exports;
+	hasRequiredEventemitter3 = 1;
+	(function (module) {
 
-  // mixin to self
-  mixin(EventLite.prototype);
+		var has = Object.prototype.hasOwnProperty
+		  , prefix = '~';
 
-  // export mixin function
-  EventLite.mixin = mixin;
+		/**
+		 * Constructor to create a storage for our `EE` objects.
+		 * An `Events` instance is a plain object whose properties are event names.
+		 *
+		 * @constructor
+		 * @private
+		 */
+		function Events() {}
+
+		//
+		// We try to not inherit from `Object.prototype`. In some engines creating an
+		// instance in this way is faster than calling `Object.create(null)` directly.
+		// If `Object.create(null)` is not supported we prefix the event names with a
+		// character to make sure that the built-in object properties are not
+		// overridden or used as an attack vector.
+		//
+		if (Object.create) {
+		  Events.prototype = Object.create(null);
+
+		  //
+		  // This hack is needed because the `__proto__` property is still inherited in
+		  // some old browsers like Android 4, iPhone 5.1, Opera 11 and Safari 5.
+		  //
+		  if (!new Events().__proto__) prefix = false;
+		}
 
-  /**
-   * Import on(), once(), off() and emit() methods into target object.
-   *
-   * @function EventLite.mixin
-   * @param target {Prototype}
-   */
+		/**
+		 * Representation of a single event listener.
+		 *
+		 * @param {Function} fn The listener function.
+		 * @param {*} context The context to invoke the listener with.
+		 * @param {Boolean} [once=false] Specify if the listener is a one-time listener.
+		 * @constructor
+		 * @private
+		 */
+		function EE(fn, context, once) {
+		  this.fn = fn;
+		  this.context = context;
+		  this.once = once || false;
+		}
 
-  function mixin(target) {
-    for (var key in methods) {
-      target[key] = methods[key];
-    }
-    return target;
-  }
+		/**
+		 * Add a listener for a given event.
+		 *
+		 * @param {EventEmitter} emitter Reference to the `EventEmitter` instance.
+		 * @param {(String|Symbol)} event The event name.
+		 * @param {Function} fn The listener function.
+		 * @param {*} context The context to invoke the listener with.
+		 * @param {Boolean} once Specify if the listener is a one-time listener.
+		 * @returns {EventEmitter}
+		 * @private
+		 */
+		function addListener(emitter, event, fn, context, once) {
+		  if (typeof fn !== 'function') {
+		    throw new TypeError('The listener must be a function');
+		  }
 
-  /**
-   * Add an event listener.
-   *
-   * @function EventLite.prototype.on
-   * @param type {string}
-   * @param func {Function}
-   * @returns {EventLite} Self for method chaining
-   */
+		  var listener = new EE(fn, context || emitter, once)
+		    , evt = prefix ? prefix + event : event;
 
-  function on(type, func) {
-    getListeners(this, type).push(func);
-    return this;
-  }
+		  if (!emitter._events[evt]) emitter._events[evt] = listener, emitter._eventsCount++;
+		  else if (!emitter._events[evt].fn) emitter._events[evt].push(listener);
+		  else emitter._events[evt] = [emitter._events[evt], listener];
 
-  /**
-   * Add one-time event listener.
-   *
-   * @function EventLite.prototype.once
-   * @param type {string}
-   * @param func {Function}
-   * @returns {EventLite} Self for method chaining
-   */
+		  return emitter;
+		}
 
-  function once(type, func) {
-    var that = this;
-    wrap.originalListener = func;
-    getListeners(that, type).push(wrap);
-    return that;
+		/**
+		 * Clear event by name.
+		 *
+		 * @param {EventEmitter} emitter Reference to the `EventEmitter` instance.
+		 * @param {(String|Symbol)} evt The Event name.
+		 * @private
+		 */
+		function clearEvent(emitter, evt) {
+		  if (--emitter._eventsCount === 0) emitter._events = new Events();
+		  else delete emitter._events[evt];
+		}
 
-    function wrap() {
-      off.call(that, type, wrap);
-      func.apply(this, arguments);
-    }
-  }
+		/**
+		 * Minimal `EventEmitter` interface that is molded against the Node.js
+		 * `EventEmitter` interface.
+		 *
+		 * @constructor
+		 * @public
+		 */
+		function EventEmitter() {
+		  this._events = new Events();
+		  this._eventsCount = 0;
+		}
 
-  /**
-   * Remove an event listener.
-   *
-   * @function EventLite.prototype.off
-   * @param [type] {string}
-   * @param [func] {Function}
-   * @returns {EventLite} Self for method chaining
-   */
+		/**
+		 * Return an array listing the events for which the emitter has registered
+		 * listeners.
+		 *
+		 * @returns {Array}
+		 * @public
+		 */
+		EventEmitter.prototype.eventNames = function eventNames() {
+		  var names = []
+		    , events
+		    , name;
 
-  function off(type, func) {
-    var that = this;
-    var listners;
-    if (!arguments.length) {
-      delete that[LISTENERS];
-    } else if (!func) {
-      listners = that[LISTENERS];
-      if (listners) {
-        delete listners[type];
-        if (!Object.keys(listners).length) return off.call(that);
-      }
-    } else {
-      listners = getListeners(that, type, true);
-      if (listners) {
-        listners = listners.filter(ne);
-        if (!listners.length) return off.call(that, type);
-        that[LISTENERS][type] = listners;
-      }
-    }
-    return that;
+		  if (this._eventsCount === 0) return names;
 
-    function ne(test) {
-      return test !== func && test.originalListener !== func;
-    }
-  }
+		  for (name in (events = this._events)) {
+		    if (has.call(events, name)) names.push(prefix ? name.slice(1) : name);
+		  }
 
-  /**
-   * Dispatch (trigger) an event.
-   *
-   * @function EventLite.prototype.emit
-   * @param type {string}
-   * @param [value] {*}
-   * @returns {boolean} True when a listener received the event
-   */
+		  if (Object.getOwnPropertySymbols) {
+		    return names.concat(Object.getOwnPropertySymbols(events));
+		  }
 
-  function emit(type, value) {
-    var that = this;
-    var listeners = getListeners(that, type, true);
-    if (!listeners) return false;
-    var arglen = arguments.length;
-    if (arglen === 1) {
-      listeners.forEach(zeroarg);
-    } else if (arglen === 2) {
-      listeners.forEach(onearg);
-    } else {
-      var args = Array.prototype.slice.call(arguments, 1);
-      listeners.forEach(moreargs);
-    }
-    return !!listeners.length;
+		  return names;
+		};
 
-    function zeroarg(func) {
-      func.call(that);
-    }
+		/**
+		 * Return the listeners registered for a given event.
+		 *
+		 * @param {(String|Symbol)} event The event name.
+		 * @returns {Array} The registered listeners.
+		 * @public
+		 */
+		EventEmitter.prototype.listeners = function listeners(event) {
+		  var evt = prefix ? prefix + event : event
+		    , handlers = this._events[evt];
 
-    function onearg(func) {
-      func.call(that, value);
-    }
+		  if (!handlers) return [];
+		  if (handlers.fn) return [handlers.fn];
 
-    function moreargs(func) {
-      func.apply(that, args);
-    }
-  }
+		  for (var i = 0, l = handlers.length, ee = new Array(l); i < l; i++) {
+		    ee[i] = handlers[i].fn;
+		  }
 
-  /**
-   * @ignore
-   */
+		  return ee;
+		};
 
-  function getListeners(that, type, readonly) {
-    if (readonly && !that[LISTENERS]) return;
-    var listeners = that[LISTENERS] || (that[LISTENERS] = {});
-    return listeners[type] || (listeners[type] = []);
-  }
+		/**
+		 * Return the number of listeners listening to a given event.
+		 *
+		 * @param {(String|Symbol)} event The event name.
+		 * @returns {Number} The number of listeners.
+		 * @public
+		 */
+		EventEmitter.prototype.listenerCount = function listenerCount(event) {
+		  var evt = prefix ? prefix + event : event
+		    , listeners = this._events[evt];
+
+		  if (!listeners) return 0;
+		  if (listeners.fn) return 1;
+		  return listeners.length;
+		};
+
+		/**
+		 * Calls each of the listeners registered for a given event.
+		 *
+		 * @param {(String|Symbol)} event The event name.
+		 * @returns {Boolean} `true` if the event had listeners, else `false`.
+		 * @public
+		 */
+		EventEmitter.prototype.emit = function emit(event, a1, a2, a3, a4, a5) {
+		  var evt = prefix ? prefix + event : event;
+
+		  if (!this._events[evt]) return false;
+
+		  var listeners = this._events[evt]
+		    , len = arguments.length
+		    , args
+		    , i;
+
+		  if (listeners.fn) {
+		    if (listeners.once) this.removeListener(event, listeners.fn, undefined, true);
+
+		    switch (len) {
+		      case 1: return listeners.fn.call(listeners.context), true;
+		      case 2: return listeners.fn.call(listeners.context, a1), true;
+		      case 3: return listeners.fn.call(listeners.context, a1, a2), true;
+		      case 4: return listeners.fn.call(listeners.context, a1, a2, a3), true;
+		      case 5: return listeners.fn.call(listeners.context, a1, a2, a3, a4), true;
+		      case 6: return listeners.fn.call(listeners.context, a1, a2, a3, a4, a5), true;
+		    }
+
+		    for (i = 1, args = new Array(len -1); i < len; i++) {
+		      args[i - 1] = arguments[i];
+		    }
+
+		    listeners.fn.apply(listeners.context, args);
+		  } else {
+		    var length = listeners.length
+		      , j;
+
+		    for (i = 0; i < length; i++) {
+		      if (listeners[i].once) this.removeListener(event, listeners[i].fn, undefined, true);
+
+		      switch (len) {
+		        case 1: listeners[i].fn.call(listeners[i].context); break;
+		        case 2: listeners[i].fn.call(listeners[i].context, a1); break;
+		        case 3: listeners[i].fn.call(listeners[i].context, a1, a2); break;
+		        case 4: listeners[i].fn.call(listeners[i].context, a1, a2, a3); break;
+		        default:
+		          if (!args) for (j = 1, args = new Array(len -1); j < len; j++) {
+		            args[j - 1] = arguments[j];
+		          }
+
+		          listeners[i].fn.apply(listeners[i].context, args);
+		      }
+		    }
+		  }
+
+		  return true;
+		};
+
+		/**
+		 * Add a listener for a given event.
+		 *
+		 * @param {(String|Symbol)} event The event name.
+		 * @param {Function} fn The listener function.
+		 * @param {*} [context=this] The context to invoke the listener with.
+		 * @returns {EventEmitter} `this`.
+		 * @public
+		 */
+		EventEmitter.prototype.on = function on(event, fn, context) {
+		  return addListener(this, event, fn, context, false);
+		};
+
+		/**
+		 * Add a one-time listener for a given event.
+		 *
+		 * @param {(String|Symbol)} event The event name.
+		 * @param {Function} fn The listener function.
+		 * @param {*} [context=this] The context to invoke the listener with.
+		 * @returns {EventEmitter} `this`.
+		 * @public
+		 */
+		EventEmitter.prototype.once = function once(event, fn, context) {
+		  return addListener(this, event, fn, context, true);
+		};
+
+		/**
+		 * Remove the listeners of a given event.
+		 *
+		 * @param {(String|Symbol)} event The event name.
+		 * @param {Function} fn Only remove the listeners that match this function.
+		 * @param {*} context Only remove the listeners that have this context.
+		 * @param {Boolean} once Only remove one-time listeners.
+		 * @returns {EventEmitter} `this`.
+		 * @public
+		 */
+		EventEmitter.prototype.removeListener = function removeListener(event, fn, context, once) {
+		  var evt = prefix ? prefix + event : event;
+
+		  if (!this._events[evt]) return this;
+		  if (!fn) {
+		    clearEvent(this, evt);
+		    return this;
+		  }
+
+		  var listeners = this._events[evt];
+
+		  if (listeners.fn) {
+		    if (
+		      listeners.fn === fn &&
+		      (!once || listeners.once) &&
+		      (!context || listeners.context === context)
+		    ) {
+		      clearEvent(this, evt);
+		    }
+		  } else {
+		    for (var i = 0, events = [], length = listeners.length; i < length; i++) {
+		      if (
+		        listeners[i].fn !== fn ||
+		        (once && !listeners[i].once) ||
+		        (context && listeners[i].context !== context)
+		      ) {
+		        events.push(listeners[i]);
+		      }
+		    }
+
+		    //
+		    // Reset the array, or remove it completely if we have no more listeners.
+		    //
+		    if (events.length) this._events[evt] = events.length === 1 ? events[0] : events;
+		    else clearEvent(this, evt);
+		  }
+
+		  return this;
+		};
+
+		/**
+		 * Remove all listeners, or those of the specified event.
+		 *
+		 * @param {(String|Symbol)} [event] The event name.
+		 * @returns {EventEmitter} `this`.
+		 * @public
+		 */
+		EventEmitter.prototype.removeAllListeners = function removeAllListeners(event) {
+		  var evt;
+
+		  if (event) {
+		    evt = prefix ? prefix + event : event;
+		    if (this._events[evt]) clearEvent(this, evt);
+		  } else {
+		    this._events = new Events();
+		    this._eventsCount = 0;
+		  }
+
+		  return this;
+		};
+
+		//
+		// Alias methods names because people roll like that.
+		//
+		EventEmitter.prototype.off = EventEmitter.prototype.removeListener;
+		EventEmitter.prototype.addListener = EventEmitter.prototype.on;
+
+		//
+		// Expose the prefix.
+		//
+		EventEmitter.prefixed = prefix;
+
+		//
+		// Allow `EventEmitter` to be imported as module namespace.
+		//
+		EventEmitter.EventEmitter = EventEmitter;
 
-// })(EventLite);
+		//
+		// Expose the module.
+		//
+		{
+		  module.exports = EventEmitter;
+		} 
+	} (eventemitter3$1));
+	return eventemitter3$1.exports;
+}
+
+var eventemitter3Exports$1 = requireEventemitter3();
+const EventEmitter$1 = /*@__PURE__*/getDefaultExportFromCjs$1(eventemitter3Exports$1);
 
 /**
  * A top-level event on the player object
@@ -12413,10 +12586,6 @@ function isHlsSource(source, mimeType) {
     return source.endsWith('.m3u8');
 }
 
-function getDefaultExportFromCjs$1 (x) {
-	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
-}
-
 var dash_all_min = {exports: {}};
 
 var hasRequiredDash_all_min;
@@ -12443,25 +12612,57 @@ var PlaybackErrorCode;
     /**
      * An unknown or uncategorised error.
      */
-    PlaybackErrorCode[PlaybackErrorCode["Generic"] = 0] = "Generic";
+    PlaybackErrorCode["Generic"] = "GENERIC_ERROR";
     /**
      * The media source is not available. Typically a network error.
      */
-    PlaybackErrorCode[PlaybackErrorCode["MediaSourceUnavailable"] = 1] = "MediaSourceUnavailable";
+    PlaybackErrorCode["MediaSourceUnavailable"] = "MEDIA_SOURCE_UNAVAILABLE";
     /**
      * The media source is not accessible due to some protection policy.
      */
-    PlaybackErrorCode[PlaybackErrorCode["MediaSourceAccessDenied"] = 3] = "MediaSourceAccessDenied";
+    PlaybackErrorCode["MediaSourceAccessDenied"] = "MEDIA_SOURCE_ACCESS_DENIED";
 })(PlaybackErrorCode || (PlaybackErrorCode = {}));
 
+/**
+ * This class adds common behaviors to all playback modules.
+ * @internal
+ * TODO use custom HTML5Video playback with this layer applied
+ */
+class BasePlayback extends HTML5Video {
+    createError(errorData, options) {
+        const i18n = this.i18n ||
+            // @ts-ignore
+            (this.core && this.core.i18n) ||
+            // @ts-ignore
+            (this.container && this.container.i18n);
+        if (i18n &&
+            !errorData.UI &&
+            errorData.code === PlaybackErrorCode.MediaSourceUnavailable) {
+            const defaultUI = {
+                title: i18n.t('no_broadcast'),
+                message: '',
+            };
+            errorData.UI = defaultUI;
+        }
+        if (errorData.level === PlayerError.Levels.FATAL) {
+            this.trigger(Events$1.PLAYBACK_MEDIACONTROL_DISABLE);
+        }
+        return super.createError(errorData, options);
+    }
+    _onPlaying() {
+        super._onPlaying();
+        this.trigger(Events$1.PLAYBACK_MEDIACONTROL_ENABLE);
+    }
+}
+
 // Copyright 2014 Globo.com Player authors. All rights reserved.
 // Use of this source code is governed by a BSD-style
 // license that can be found in the LICENSE file.
 const AUTO$2 = -1;
 const { now: now$2 } = Utils;
-const T$f = 'playback.dash';
+const T$g = 'playback.dash';
 // @ts-expect-error
-class DashPlayback extends HTML5Video {
+class DashPlayback extends BasePlayback {
     _levels = null;
     _currentLevel = null;
     // true when the actual duration is longer than hlsjs's live sync point
@@ -12729,10 +12930,10 @@ class DashPlayback extends HTML5Video {
     }
     _onPlaybackError = (event) => {
         // TODO
-        trace(`${T$f} _onPlaybackError`, { event });
+        trace(`${T$g} _onPlaybackError`, { event });
     };
     _onDASHJSSError = (event) => {
-        trace(`${T$f} _onDASHJSSError`, { event });
+        trace(`${T$g} _onDASHJSSError`, { event });
         this._stopTimeUpdateTimer();
         // Note that the other error types are deprecated
         const e = event.error;
@@ -12767,12 +12968,11 @@ class DashPlayback extends HTML5Video {
         }
     };
     triggerError(error) {
-        trace(`${T$f} triggerError`, { error });
-        this.trigger(Events$1.PLAYBACK_ERROR, {
-            ...error,
-            origin: this.name,
-            scope: DashPlayback.type,
-        });
+        trace(`${T$g} triggerError`, { error });
+        // this triggers Events.ERROR to be handled by the UI
+        this.trigger(Events$1.PLAYBACK_ERROR, this.createError(error, {
+            useCodePrefix: false,
+        }));
         // only reset the dash player in 10ms async, so that the rest of the
         // calling function finishes
         setTimeout(() => {
@@ -12807,7 +13007,7 @@ class DashPlayback extends HTML5Video {
     }
     get dvrEnabled() {
         if (!this._dash) {
-            trace(`${T$f} dvrEnable no dash player instance`);
+            trace(`${T$g} dvrEnable no dash player instance`);
             return false;
         }
         return (this._dash?.getDVRWindowSize() >= this._minDvrSize &&
@@ -12829,7 +13029,7 @@ class DashPlayback extends HTML5Video {
         this.trigger(Events$1.PLAYBACK_PROGRESS, progress, {});
     }
     play() {
-        trace(`${T$f} play`, { dash: !!this._dash });
+        trace(`${T$g} play`, { dash: !!this._dash });
         if (!this._dash) {
             this._setup();
         }
@@ -41570,15 +41770,15 @@ const CLAPPR_VERSION = '0.11.3';
 
 // Copyright 2014 Globo.com Player authors. All rights reserved.
 // Use of this source code is governed by a BSD-style
-// license that can be found in the LICENSE file.
-const { now} = Utils;
+// license that can be found on https://github.com/clappr/hlsjs-playback/blob/main/LICENSE
+const { now } = Utils;
 const AUTO$1 = -1;
 const DEFAULT_RECOVER_ATTEMPTS = 16;
 Events$1.register('PLAYBACK_FRAGMENT_CHANGED');
 Events$1.register('PLAYBACK_FRAGMENT_PARSING_METADATA');
-const T$e = 'playback.hls';
+const T$f = 'playback.hls';
 // @ts-expect-error
-class HlsPlayback extends HTML5Video {
+class HlsPlayback extends BasePlayback {
     _ccIsSetup = false;
     _ccTracksUpdated = false;
     _currentFragment = null;
@@ -41806,7 +42006,7 @@ class HlsPlayback extends HTML5Video {
             maxBufferLength: 2,
             maxMaxBufferLength: 4,
         }, this.options.playback.hlsjsConfig);
-        trace(`${T$e} _createHLSInstance`, { config });
+        trace(`${T$f} _createHLSInstance`, { config });
         this._hls = new Hls(config);
     }
     _attachHLSMedia() {
@@ -41895,7 +42095,7 @@ class HlsPlayback extends HTML5Video {
         }
         else {
             Log.error('hlsjs: failed to recover', { evt, data });
-            trace(`${T$e} _recover failed to recover`, {
+            trace(`${T$f} _recover failed to recover`, {
                 type: data.type,
                 details: data.details,
             });
@@ -41981,7 +42181,7 @@ class HlsPlayback extends HTML5Video {
         this.trigger(Events$1.PLAYBACK_SETTINGSUPDATE);
     }
     _onHLSJSError(evt, data) {
-        trace(`${T$e} _onHLSJSError`, {
+        trace(`${T$f} _onHLSJSError`, {
             fatal: data.fatal,
             type: data.type,
             details: data.details,
@@ -42029,7 +42229,7 @@ class HlsPlayback extends HTML5Video {
                                     evt,
                                     data,
                                 });
-                                trace(`${T$e} _onHLSJSError trying to recover from network error`, {
+                                trace(`${T$f} _onHLSJSError trying to recover from network error`, {
                                     details: data.details,
                                 });
                                 error.level = PlayerError.Levels.WARN;
@@ -42042,7 +42242,7 @@ class HlsPlayback extends HTML5Video {
                             evt,
                             data,
                         });
-                        trace(`${T$e} _onHLSJSError trying to recover from media error`, {
+                        trace(`${T$f} _onHLSJSError trying to recover from media error`, {
                             details: data.details,
                         });
                         error.level = PlayerError.Levels.WARN;
@@ -42072,7 +42272,7 @@ class HlsPlayback extends HTML5Video {
                 return;
             }
             Log.warn('hlsjs: non-fatal error occurred', { evt, data });
-            trace(`${T$e} _onHLSJSError non-fatal error occurred`, {
+            trace(`${T$f} _onHLSJSError non-fatal error occurred`, {
                 type: data.type,
                 details: data.details,
             });
@@ -42383,7 +42583,9 @@ class HlsPlayback extends HTML5Video {
         return this._playbackType === Playback.VOD || this.dvrEnabled;
     }
     triggerError(error) {
-        this.trigger(Events$1.PLAYBACK_ERROR, error);
+        this.trigger(Events$1.PLAYBACK_ERROR, this.createError(error, {
+            useCodePrefix: false,
+        }));
         this.stop();
     }
 }
@@ -42400,7 +42602,7 @@ function registerPlaybacks() {
     Loader.registerPlayback(DashPlayback);
 }
 
-const T$d = 'GPlayer';
+const T$e = 'GPlayer';
 const DEFAULT_OPTIONS = {
     autoPlay: false,
     debug: 'none',
@@ -42421,7 +42623,7 @@ const DEFAULT_OPTIONS = {
  */
 class Player {
     config = DEFAULT_OPTIONS;
-    emitter = new EventLite();
+    emitter = new EventEmitter$1();
     player = null;
     ready = false;
     rootNode = null;
@@ -42495,7 +42697,7 @@ class Player {
         }
         const coreOpts = this.buildCoreOptions(playerElement);
         const { core, container } = Player.getRegisteredPlugins();
-        trace(`${T$d} init`, {
+        trace(`${T$e} init`, {
             registeredPlaybacks: Loader.registeredPlaybacks.map((p) => p.name),
         });
         coreOpts.plugins = {
@@ -42509,7 +42711,7 @@ class Player {
      * Destroys the player, releasing all resources and unmounting its UI from the DOM.
      */
     destroy() {
-        trace(`${T$d} destroy`, {
+        trace(`${T$e} destroy`, {
             player: !!this.player,
         });
         if (this.player) {
@@ -42691,7 +42893,7 @@ class Player {
         this.config = $.extend(true, this.config, config);
     }
     initPlayer(coreOptions) {
-        trace(`${T$d} initPlayer`, {
+        trace(`${T$e} initPlayer`, {
             autoPlay: coreOptions.autoPlay,
             sources: coreOptions.sources,
             // TODO selected options
@@ -42716,7 +42918,7 @@ class Player {
         }
     }
     triggerAutoPlay() {
-        trace(`${T$d} triggerAutoPlay`);
+        trace(`${T$e} triggerAutoPlay`);
         setTimeout(() => {
             this.player?.play({
                 autoPlay: true,
@@ -42734,7 +42936,7 @@ class Player {
     // TODO test
     events = {
         onReady: () => {
-            trace(`${T$d} onReady`, {
+            trace(`${T$e} onReady`, {
                 ready: this.ready,
             });
             if (this.ready) {
@@ -42768,7 +42970,7 @@ class Player {
     buildCoreOptions(rootNode) {
         const sources = this.buildMediaSourcesList();
         const source = sources[0];
-        trace(`${T$d} buildCoreOptions`, {
+        trace(`${T$e} buildCoreOptions`, {
             source,
             sources,
         });
@@ -42829,7 +43031,7 @@ class Player {
         assert.ok(this.player, 'Player is not initialized');
         const core = this.player.core;
         core.on(Events$1.CORE_SCREEN_ORIENTATION_CHANGED, ({ orientation }) => {
-            trace(`${T$d} on CORE_SCREEN_ORIENTATION_CHANGED`, {
+            trace(`${T$e} on CORE_SCREEN_ORIENTATION_CHANGED`, {
                 orientation,
                 rootNode: {
                     width: this.rootNode?.clientWidth,
@@ -42844,14 +43046,14 @@ class Player {
             }
         }, null);
         core.on(Events$1.CORE_RESIZE, ({ width, height }) => {
-            trace(`${T$d} on CORE_RESIZE`, {
+            trace(`${T$e} on CORE_RESIZE`, {
                 width,
                 height,
             });
             this.safeTriggerEvent(PlayerEvent.Resize, { width, height });
         }, null);
         core.on(Events$1.CORE_FULLSCREEN, (isFullscreen) => {
-            trace(`${T$d} CORE_FULLSCREEN`, {
+            trace(`${T$e} CORE_FULLSCREEN`, {
                 isFullscreen,
             });
             this.safeTriggerEvent(PlayerEvent.Fullscreen, isFullscreen);
@@ -42859,7 +43061,7 @@ class Player {
     }
 }
 
-var version$1 = "2.20.4";
+var version$1 = "2.20.6";
 
 var packages = {
 	"node_modules/@clappr/core": {
@@ -43192,7 +43394,7 @@ const volumeOffIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fil
 
 const pluginHtml$7 = "<div class=\"big-mute-icon-wrapper\" data-big-mute>\n    <div class=\"big-mute-icon gcore-skin-border-color\" data-big-mute-icon></div>\n</div>\n";
 
-const T$c = 'plugins.big_mute_button';
+const T$d = 'plugins.big_mute_button';
 // TODO rewrite as a container plugin
 /**
  * Displays a big mute button over the video when it's muted.
@@ -43234,7 +43436,7 @@ class BigMuteButton extends UICorePlugin {
         this.listenTo(this.core, Events$1.CORE_READY, this.onCoreReady);
         this.listenTo(this.core, 'core:advertisement:start', this.onStartAd);
         this.listenTo(this.core, 'core:advertisement:finish', this.onFinishAd);
-        trace(`${T$c} bindEvents`, {
+        trace(`${T$d} bindEvents`, {
             mediacontrol: !!this.core.mediaControl,
         });
         this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED, this.mediaControlRendered);
@@ -43259,12 +43461,12 @@ class BigMuteButton extends UICorePlugin {
     }
     mediaControlRendered() {
         const container = this.core.activeContainer;
-        trace(`${T$c} mediaControlRendered`, {
+        trace(`${T$d} mediaControlRendered`, {
             container: !!container,
         });
         if (container) {
             this.listenTo(container.playback, Events$1.PLAYBACK_PLAY, () => {
-                trace(`${T$c} PLAYBACK_PLAY`);
+                trace(`${T$d} PLAYBACK_PLAY`);
                 this.render();
             });
         }
@@ -43288,7 +43490,7 @@ class BigMuteButton extends UICorePlugin {
         }
         const { autoPlay, wasMuted } = this.options;
         const volume = container.volume;
-        trace(`${T$c} shouldRender`, {
+        trace(`${T$d} shouldRender`, {
             autoPlay,
             wasMuted,
             volume,
@@ -43300,7 +43502,7 @@ class BigMuteButton extends UICorePlugin {
      */
     render() {
         if (this.shouldRender()) {
-            trace(`${T$c} render`, {
+            trace(`${T$d} render`, {
                 el: !!this.$el,
             });
             this.$el.html(BigMuteButton.template());
@@ -43346,7 +43548,7 @@ const gearIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"n
 const gearHdIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n  <g clip-path=\"url(#clip0_28_1567)\">\n    <path\n      d=\"M19.14 12.94C19.18 12.64 19.2 12.33 19.2 12C19.2 11.68 19.18 11.36 19.13 11.06L21.16 9.47999C21.34 9.33999 21.39 9.06999 21.28 8.86999L19.36 5.54999C19.24 5.32999 18.99 5.25999 18.77 5.32999L16.38 6.28999C15.88 5.90999 15.35 5.58999 14.76 5.34999L14.4 2.80999C14.36 2.56999 14.16 2.39999 13.92 2.39999H10.08C9.83999 2.39999 9.64999 2.56999 9.60999 2.80999L9.24999 5.34999C8.65999 5.58999 8.11999 5.91999 7.62999 6.28999L5.23999 5.32999C5.01999 5.24999 4.76999 5.32999 4.64999 5.54999L2.73999 8.86999C2.61999 9.07999 2.65999 9.33999 2.85999 9.47999L4.88999 11.06C4.83999 11.36 4.79999 11.69 4.79999 12C4.79999 12.31 4.81999 12.64 4.86999 12.94L2.83999 14.52C2.65999 14.66 2.60999 14.93 2.71999 15.13L4.63999 18.45C4.75999 18.67 5.00999 18.74 5.22999 18.67L7.61999 17.71C8.11999 18.09 8.64999 18.41 9.23999 18.65L9.59999 21.19C9.64999 21.43 9.83999 21.6 10.08 21.6H13.92C14.16 21.6 14.36 21.43 14.39 21.19L14.75 18.65C15.34 18.41 15.88 18.09 16.37 17.71L18.76 18.67C18.98 18.75 19.23 18.67 19.35 18.45L21.27 15.13C21.39 14.91 21.34 14.66 21.15 14.52L19.14 12.94ZM12 15.6C10.02 15.6 8.39999 13.98 8.39999 12C8.39999 10.02 10.02 8.39999 12 8.39999C13.98 8.39999 15.6 10.02 15.6 12C15.6 13.98 13.98 15.6 12 15.6Z\"\n      fill=\"#C9C9C9\"/>\n    <rect x=\"13\" width=\"11\" height=\"7\" rx=\"1\" fill=\"#F6413B\"/>\n    <path\n      d=\"M14.6962 6V1.63636H15.3546V3.53267H17.53V1.63636H18.1905V6H17.53V4.0973H15.3546V6H14.6962ZM20.562 6H19.1493V1.63636H20.6067C21.0343 1.63636 21.4015 1.72372 21.7083 1.89844C22.0151 2.07173 22.2502 2.32102 22.4135 2.64631C22.5783 2.97017 22.6607 3.35866 22.6607 3.81179C22.6607 4.26634 22.5776 4.65696 22.4114 4.98366C22.2466 5.31037 22.008 5.56179 21.6955 5.73793C21.383 5.91264 21.0051 6 20.562 6ZM19.8077 5.42472H20.5257C20.8581 5.42472 21.1344 5.36222 21.3546 5.23722C21.5748 5.1108 21.7395 4.92827 21.8489 4.68963C21.9583 4.44957 22.013 4.15696 22.013 3.81179C22.013 3.46946 21.9583 3.17898 21.8489 2.94034C21.7409 2.7017 21.5797 2.5206 21.3652 2.39702C21.1507 2.27344 20.8844 2.21165 20.5662 2.21165H19.8077V5.42472Z\"\n      fill=\"#C9C9C9\"/>\n  </g>\n  <defs>\n    <clipPath id=\"clip0_28_1567\">\n      <rect width=\"24\" height=\"24\" fill=\"white\"/>\n    </clipPath>\n  </defs>\n</svg>\n";
 
 const VERSION$5 = '2.19.12';
-const T$b = 'plugins.bottom_gear';
+const T$c = 'plugins.bottom_gear';
 /**
  * Custom events emitted by the plugin
  * @beta
@@ -43432,11 +43634,11 @@ class BottomGear extends UICorePlugin {
         this.$el.find('.gear-wrapper').html(content);
     }
     onActiveContainerChanged() {
-        trace(`${T$b} onActiveContainerChanged`);
+        trace(`${T$c} onActiveContainerChanged`);
         this.bindContainerEvents();
     }
     bindContainerEvents() {
-        trace(`${T$b} bindContainerEvents`);
+        trace(`${T$c} bindContainerEvents`);
         this.listenTo(this.core.activeContainer, Events$1.CONTAINER_HIGHDEFINITIONUPDATE, this.highDefinitionUpdate);
     }
     highDefinitionUpdate(isHd) {
@@ -46238,7 +46440,7 @@ class ClapprStats extends ContainerPlugin {
 //Copyright 2014 Globo.com Player authors. All rights reserved.
 // Use of this source code is governed by a BSD-style
 // license that can be found at https://github.com/clappr/clappr-plugins/blob/master/LICENSE.
-const T$a = 'plugins.click_to_pause_custom';
+const T$b = 'plugins.click_to_pause_custom';
 /**
  * Adds a behavior of toggling the playback state on click over the container
  * @beta
@@ -46268,7 +46470,7 @@ class ClickToPause extends ContainerPlugin {
     click() {
         const isLivePlayback = this.container.getPlaybackType() === Playback.LIVE;
         const isDvrEnabled = this.container.isDvrEnabled();
-        trace(`${T$a} click`, {
+        trace(`${T$b} click`, {
             isLivePlayback,
             isDvrEnabled,
         });
@@ -46286,7 +46488,7 @@ class ClickToPause extends ContainerPlugin {
     settingsUpdate() {
         const isLivePlayback = this.container.getPlaybackType() === Playback.LIVE;
         const pointerEnabled = !isLivePlayback || this.container.isDvrEnabled();
-        trace(`${T$a} settingsUpdate`, {
+        trace(`${T$b} settingsUpdate`, {
             isLivePlayback,
             pointerEnabled,
         });
@@ -46591,7 +46793,7 @@ class ContextMenu extends UIContainerPlugin {
             this._url = this.options.contextMenu.url;
         }
         this.render();
-        this.bindEvents();
+        $('body').on('click', this.hideOnBodyClick);
     }
     /**
      * @internal
@@ -46599,7 +46801,6 @@ class ContextMenu extends UIContainerPlugin {
     bindEvents() {
         this.listenTo(this.container, Events$1.CONTAINER_CONTEXTMENU, this.toggleContextMenu);
         this.listenTo(this.container, Events$1.CONTAINER_CLICK, this.hide);
-        $('body').on('click', this.hideOnBodyClick);
     }
     /**
      * @internal
@@ -46768,183 +46969,116 @@ class DvrControls extends UICorePlugin {
 
 const reloadIcon = "<svg fill=\"#FFFFFF\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\"/>\n    <path d=\"M0 0h24v24H0z\" fill=\"none\"/>\n</svg>";
 
-const templateHtml = "<div class=\"player-error-screen__content\" data-error-screen>\n    <% if (icon) { %>\n        <div class=\"player-error-screen__icon\" data-error-screen><%= icon %></div>\n    <% } %>\n    <div class=\"player-error-screen__title\" data-error-screen><%= title %></div>\n    <% if (message) { %>\n        <div class=\"player-error-screen__message\" data-error-screen><%= message %></div>\n    <% } %>\n    <% if (code) { %>\n        <div class=\"player-error-screen__code\" data-error-screen>Error code: <%= code %></div>\n    <% } %>\n    <div class=\"player-error-screen__reload\" data-error-screen><%= reloadIcon %></div>\n</div>\n";
+const templateHtml = "<div class=\"player-error-screen__content\" data-error-screen>\n    <% if (icon) { %>\n        <div class=\"player-error-screen__icon\" data-error-screen><%= icon %></div>\n    <% } %>\n    <div class=\"player-error-screen__title\" data-error-screen><%= title %></div>\n    <% if (message) { %>\n        <div class=\"player-error-screen__message\" data-error-screen><%= message %></div>\n    <% } %>\n    <% if (code) { %>\n        <div class=\"player-error-screen__code\" data-error-screen>Error code: <%= code %></div>\n    <% } %>\n    <% if (reloadIcon) { %>\n        <div class=\"player-error-screen__reload\" data-error-screen><%= reloadIcon %></div>\n    <% } %>\n</div>\n";
 
-const TIME_FOR_UPDATE = 10000;
-const MAX_RETRY = 10;
-const T$9 = 'plugins.error_screen';
+const T$a = 'plugins.error_screen';
 /**
- * Displays a descriptive error in the overlay on top of the player.
+ * Displays an error nicely in the overlay on top of the player.
  * @beta
  */
 class ErrorScreen extends UICorePlugin {
-    _retry = 0;
     err = null;
-    hideValue = false;
-    timeout = null;
-    reloadButton = null;
+    /**
+     * @internal
+     */
     get name() {
-        return 'error_gplayer';
+        return 'error_screen';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
-    get template() {
-        return tmpl(templateHtml);
-    }
-    get container() {
-        return this.core.activeContainer;
-    }
+    static template = tmpl(templateHtml);
+    /**
+     * @internal
+     */
     get attributes() {
         return {
-            'class': 'player-error-screen',
+            class: 'player-error-screen',
             'data-error-screen': '',
         };
     }
+    /**
+     * @internal
+     */
     bindEvents() {
         this.listenTo(this.core, Events$1.ERROR, this.onError);
-        this.listenTo(this.core, Events$1.CORE_READY, this.onCoreReady);
-        this.listenTo(this.core, 'core:advertisement:start', this.onStartAd);
-        this.listenTo(this.core, 'core:advertisement:finish', this.onFinishAd);
-        this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED, this.onContainerChanged);
-    }
-    onCoreReady() {
-        trace(`${T$9} onCoreReady`);
-        if (this.core.activePlayback) {
-            this.listenTo(this.core.activePlayback, Events$1.PLAYBACK_PLAY, this.onPlay);
-        }
+        this.listenTo(this.core, Events$1.CORE_ACTIVE_CONTAINER_CHANGED, this.onActiveContainerChanged);
     }
     onPlay() {
-        trace(`${T$9} onPlay`);
-        this.destroyError();
+        trace(`${T$a} onPlay`);
+        this.unmount();
     }
-    destroyError() {
-        trace(`${T$9} destroyError`);
-        this._retry = 0;
+    unmount() {
+        trace(`${T$a} unmount`);
         this.err = null;
-        if (this.timeout !== null) {
-            clearTimeout(this.timeout);
-            this.timeout = null;
-        }
-        this.$el.hide();
-    }
-    unBindEvents() {
-        // @ts-ignore
-        this.stopListening(this.core, 'core:advertisement:start');
-        // @ts-ignore
-        this.stopListening(this.core, 'core:advertisement:finish');
-        // @ts-ignore
-        this.stopListening(this.core, Events$1.ERROR);
+        this.$el.remove();
     }
-    bindReload() {
-        this.reloadButton = this.$el.find('.player-error-screen__reload');
-        this.reloadButton && this.reloadButton.on('click', this.reload.bind(this));
+    /**
+     * @internal
+     */
+    get events() {
+        return {
+            'click .player-error-screen__reload': 'reload',
+        };
     }
     reload() {
-        this._retry++;
-        this.core.configure({
-            ...this.options,
-            autoPlay: true
-        });
-        this.core.activeContainer.mediaControlDisabled = false;
-        this.unbindReload();
-    }
-    unbindReload() {
-        this.reloadButton && this.reloadButton.off('click');
+        setTimeout(() => {
+            this.core.configure({
+                reloading: true,
+                source: this.core.options.source,
+                sources: this.core.options.sources,
+            });
+        }, 0);
     }
-    onContainerChanged() {
+    onActiveContainerChanged() {
+        trace(`${T$a} onActiveContainerChanged`, {
+            reloading: this.core.options.reloading,
+        });
         this.err = null;
-        if (this.core.getPlugin('error_screen')) {
-            this.core.getPlugin('error_screen').disable();
-        }
-        this.unbindReload();
-        this.hide();
-    }
-    onStartAd() {
-        this.hideValue = true;
-        if (this.err) {
-            this.hide();
-        }
-    }
-    onFinishAd() {
-        this.hideValue = false;
-        if (this.err) {
-            this.container.disableMediaControl();
-            this.container.stop();
-            this.show();
+        this.listenTo(this.core.activeContainer.playback, Events$1.PLAYBACK_PLAY, this.onPlay);
+        if (this.core.options.reloading) {
+            setTimeout(() => {
+                this.core.options.reloading = false;
+                this.unmount();
+                this.core.activeContainer.play({
+                    reloading: true,
+                });
+            }, 0);
         }
     }
     onError(err) {
-        trace(`${T$9} onError`, { err });
-        if (err.level === PlayerError.Levels.FATAL ||
-            err.details === 'bufferStalledError' ||
-            err.details === 'manifestParsingError') {
+        trace(`${T$a} onError`, { err });
+        if (err.UI) {
+            if (this.err) {
+                this.unmount();
+            }
             this.err = {
-                title: this.core.i18n.t('no_broadcast'),
-                message: '',
-                code: '',
-                // icon: (this.err.UI && this.err.UI.icon) || '',
-                icon: '',
-                reloadIcon,
+                title: err.UI.title,
+                message: err.UI.message,
+                code: err.code,
+                icon: err.UI.icon,
             };
-            if (this.options.errorScreen?.reloadOnError === false) {
-                return;
-            }
-            if (this.options.errorScreen?.neverStopToRetry) {
-                this._retry = 0;
-            }
-            if (this._retry >= MAX_RETRY) {
-                this.drying();
-                return;
-            }
-            const ctp = this.container.getPlugin('click_to_pause_custom');
-            const toggleCTP = !!ctp?.enabled;
-            if (toggleCTP) {
-                // clickToPausePlugin.afterEnabled = true;
-                ctp.disable();
-            }
-            this.timeout = setTimeout(() => {
-                if (toggleCTP) {
-                    ctp.enable();
-                }
-                this.reload();
-            }, TIME_FOR_UPDATE);
-            const spinnerPlugin = this.container.getPlugin('spinner');
-            if (spinnerPlugin) {
-                spinnerPlugin.show(); // TODO remove?
-                setTimeout(() => spinnerPlugin.show(), 0);
-            }
-        }
-    }
-    drying() {
-        const spinnerPlugin = this.container.getPlugin('spinner');
-        spinnerPlugin?.hide();
-        this._retry = 0;
-        if (!this.hideValue) {
-            this.container.disableMediaControl();
-            this.container.stop();
-            this.show();
-        }
-    }
-    show(err) {
-        if (err) {
-            this.err = err;
+            this.render();
         }
-        // TODO use container.disableMediaControl() instead
-        this.core.mediaControl.disable();
-        this.render();
-        this.$el.show();
-    }
-    hide() {
-        this.$el.hide();
     }
+    /**
+     * @internal
+     */
     render() {
         if (!this.err) {
             return this;
         }
-        this.$el.html(this.template(this.err));
-        this.core.$el.append(this.el);
-        this.bindReload();
+        this.$el.html(ErrorScreen.template({
+            ...this.err,
+            reloadIcon: this.options.errorScreen?.noReload ? null : reloadIcon,
+        }));
+        // TODO append to container instead of core?
+        if (!this.el.parentElement) {
+            this.core.$el.append(this.el);
+        }
         return this;
     }
 }
@@ -47388,7 +47522,7 @@ const arrowLeftIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fil
 
 const checkIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n  <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n        d=\"M20.5793 4.19296C20.1216 3.86696 19.4777 3.96396 19.1424 4.40896L9.37295 17.3809L4.81634 12.107C4.45222 11.683 3.80218 11.6289 3.36709 11.9839C2.932 12.3389 2.87543 12.97 3.2416 13.393L8.64165 19.643C8.83708 19.869 9.12506 20 9.42849 20C9.4398 20 9.45114 20 9.46246 19.999C9.77926 19.989 10.0724 19.838 10.2586 19.59L20.8015 5.58996C21.1368 5.14496 21.0371 4.51896 20.5793 4.19296Z\"\n        fill=\"#C9C9C9\"/>\n</svg>\n";
 
-const T$8 = 'plugins.level_selector';
+const T$9 = 'plugins.level_selector';
 const VERSION$4 = '2.19.4';
 /**
  * A {@link MediaControl | media control} plugin that provides a UI to control the quality level of the playback.
@@ -47490,10 +47624,10 @@ class LevelSelector extends UICorePlugin {
         }
     }
     onStop() {
-        trace(`${T$8} onStop`);
+        trace(`${T$9} onStop`);
         const currentPlayback = this.core.activePlayback;
         this.listenToOnce(currentPlayback, Events$1.PLAYBACK_PLAY, () => {
-            trace(`${T$8} on PLAYBACK_PLAY after stop`, { selectedLevelId: this.selectedLevelId });
+            trace(`${T$9} on PLAYBACK_PLAY after stop`, { selectedLevelId: this.selectedLevelId });
             if (currentPlayback.getPlaybackType() === 'live') {
                 if (this.selectedLevelId !== -1) {
                     currentPlayback.currentLevel = this.selectedLevelId;
@@ -47589,13 +47723,13 @@ class LevelSelector extends UICorePlugin {
         return false;
     }
     goBack() {
-        trace(`${T$8} goBack`);
+        trace(`${T$9} goBack`);
         this.isOpen = false;
         this.core.trigger('gear:refresh');
         this.deferRender();
     }
     setLevel(index) {
-        trace(`${T$8} setIndexLevel`, { index });
+        trace(`${T$9} setIndexLevel`, { index });
         this.selectedLevelId = index;
         if (!this.core.activePlayback) {
             return;
@@ -47613,7 +47747,7 @@ class LevelSelector extends UICorePlugin {
         this.deferRender();
     }
     onShowLevelSelectMenu() {
-        trace(`${T$8} onShowLevelSelectMenu`);
+        trace(`${T$9} onShowLevelSelectMenu`);
         this.isOpen = true;
         this.renderDropdown();
         this.highlightCurrentLevel();
@@ -47649,11 +47783,11 @@ class LevelSelector extends UICorePlugin {
         return this.levelLabels[index] ?? formatLevelLabel(this.levels[index]);
     }
     updateCurrentLevel(info) {
-        trace(`${T$8} updateCurrentLevel`, { info });
+        trace(`${T$9} updateCurrentLevel`, { info });
         this.highlightCurrentLevel();
     }
     highlightCurrentLevel() {
-        trace(`${T$8} highlightCurrentLevel`, {
+        trace(`${T$9} highlightCurrentLevel`, {
             selectedLevelId: this.selectedLevelId,
         });
         this.allLevelElements().removeClass('current');
@@ -47905,6 +48039,7 @@ const fullscreenOnIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"
 // Copyright 2014 Globo.com Player authors. All rights reserved.
 // Use of this source code is governed by a BSD-style
 // license that can be found in the LICENSE file.
+const T$8 = 'plugins.media_control';
 const LEFT_ORDER = [
     'playpause',
     'playstop',
@@ -48149,10 +48284,11 @@ class MediaControl extends UICorePlugin {
         }
     }
     /**
-     * Disables the plugin and unmounts its UI
+     * Hides the media control UI
      */
     disable() {
-        this.userDisabled = true;
+        trace(`${T$8} disable`);
+        this.userDisabled = true; // TODO distinguish between user and system (e.g., unplayable) disabled?
         this.hide();
         this.unbindKeyEvents();
         this.$el.hide();
@@ -48161,6 +48297,7 @@ class MediaControl extends UICorePlugin {
      * Reenables the plugin disabled earlier with the {@link MediaControl.disable} method
      */
     enable() {
+        trace(`${T$8} enable`);
         if (this.options.chromeless) {
             return;
         }
@@ -48418,8 +48555,14 @@ class MediaControl extends UICorePlugin {
         this.settingsUpdate();
         this.core.activeContainer &&
             this.core.activeContainer.trigger(Events$1.CONTAINER_PLAYBACKDVRSTATECHANGED, this.core.activeContainer.isDvrInUse());
-        this.core.activeContainer && this.core.activeContainer.mediaControlDisabled && this.disable();
-        this.trigger(Events$1.MEDIACONTROL_CONTAINERCHANGED);
+        // TODO test
+        if (this.core.activeContainer.mediaControlDisabled) {
+            this.disable();
+        }
+        else {
+            this.enable();
+        }
+        this.trigger(Events$1.MEDIACONTROL_CONTAINERCHANGED); // TODO check
         if (this.core.activeContainer.$el) {
             this.core.activeContainer.$el.addClass('container-skin-1');
         }
@@ -48838,13 +48981,13 @@ class MediaControl extends UICorePlugin {
     destroy() {
         $(document).unbind('mouseup', this.stopDrag);
         $(document).unbind('mousemove', this.updateDrag);
+        $(document).unbind('touchend', this.stopDrag);
+        $(document).unbind('touchmove', this.updateDrag);
         this.unbindKeyEvents();
-        // @ts-ignore
-        this.stopListening();
         return super.destroy();
     }
     configure() {
-        this.advertisementPlaying ? this.disable() : this.enable();
+        // this.advertisementPlaying ? this.disable() : this.enable()
         this.trigger(Events$1.MEDIACONTROL_OPTIONS_CHANGE);
     }
     /**
@@ -49240,13 +49383,12 @@ class MultiCamera extends UICorePlugin {
         catch (error) {
             reportError(error);
         }
-        // TODO figure out
-        this.core.getPlugin('error_gplayer')?.show({
+        // TODO trigger error instead
+        this.core.getPlugin('error_screen')?.show({
             title: this.core.i18n.t('source_offline'),
             message: '',
             code: '',
             icon: '',
-            reloadIcon: '',
         });
     }
     hideError() {
@@ -49716,7 +49858,7 @@ class Poster extends UIContainerPlugin {
     }
     static template = tmpl(posterHTML);
     get shouldRender() {
-        if (!this.enabled) {
+        if (!this.enabled || this.options.reloading) {
             return false;
         }
         const showForNoOp = !!this.options.poster?.showForNoOp;
@@ -50357,6 +50499,7 @@ class SpinnerThreeBounce extends UIContainerPlugin {
             'class': 'spinner-three-bounce'
         };
     }
+    hideTimeout = null;
     showTimeout = null;
     template = tmpl(spinnerHTML);
     hasFatalError = false;
@@ -50412,8 +50555,18 @@ class SpinnerThreeBounce extends UIContainerPlugin {
     /**
      * Shows the spinner
      */
-    show() {
-        this.showTimeout = setTimeout(() => this.$el.show(), 300);
+    show(delay = 300) {
+        trace(`${T$4} show`);
+        if (this.showTimeout === null) {
+            if (this.hideTimeout !== null) {
+                clearTimeout(this.hideTimeout);
+                this.hideTimeout = null;
+            }
+            this.showTimeout = setTimeout(() => {
+                this.showTimeout = null;
+                this.$el.show();
+            }, delay);
+        }
     }
     /**
      * Hides the spinner
@@ -50423,7 +50576,12 @@ class SpinnerThreeBounce extends UIContainerPlugin {
             clearTimeout(this.showTimeout);
             this.showTimeout = null;
         }
-        this.$el.hide();
+        this.hideTimeout = setTimeout(() => {
+            this.hideTimeout = null;
+            if (this.showTimeout === null) {
+                this.$el.hide();
+            }
+        }, 0);
     }
     /**
      * @internal
@@ -50546,10 +50704,15 @@ class SourceController extends CorePlugin {
      */
     bindEvents() {
         super.bindEvents();
-        this.listenTo(this.core, Events$1.CORE_ACTIVE_CONTAINER_CHANGED, () => this.onReady());
+        this.listenTo(this.core, Events$1.CORE_READY, this.onCoreReady);
+        this.listenTo(this.core, Events$1.CORE_ACTIVE_CONTAINER_CHANGED, this.onActiveContainerChanged);
     }
-    onReady() {
-        trace(`${T$3} onReady`, {
+    onCoreReady() {
+        trace(`${T$3} onCoreReady`);
+        this.core.getPlugin('error_screen')?.disable(); //  TODO test
+    }
+    onActiveContainerChanged() {
+        trace(`${T$3} onActiveContainerChanged`, {
             retrying: this.active,
             currentSource: this.sourcesList[this.currentSourceIndex],
         });
@@ -50565,7 +50728,7 @@ class SourceController extends CorePlugin {
         this.bindContainerEventListeners();
         if (this.active) {
             this.core.activeContainer?.getPlugin('poster_custom')?.disable();
-            spinner?.show();
+            spinner?.show(0);
         }
     }
     bindContainerEventListeners() {
@@ -50582,7 +50745,7 @@ class SourceController extends CorePlugin {
             switch (error.code) {
                 case PlaybackErrorCode.MediaSourceUnavailable:
                     this.core.activeContainer?.getPlugin('poster_custom')?.disable();
-                    this.retryPlayback();
+                    setTimeout(() => this.retryPlayback(), 0);
                     break;
             }
         });
@@ -50609,6 +50772,7 @@ class SourceController extends CorePlugin {
             currentSource: this.sourcesList[this.currentSourceIndex],
         });
         this.active = true;
+        this.core.activeContainer?.getPlugin('spinner')?.show(0);
         this.getNextMediaSource().then((nextSource) => {
             trace(`${T$3} retryPlayback syncing...`, {
                 nextSource,