@gcorevideo/player 2.19.15 → 2.20.3

package/dist/plugins/index.js

@@ -31431,1328 +31431,1360 @@ const pluginHtml$8 = "<button data-track-selector-button class='gcore-skin-butto
 
 const audioArrow = "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<svg width=\"9px\" height=\"6px\" viewBox=\"0 0 9 6\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\"\n     xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n  <!-- Generator: Sketch 49 (51002) - http://www.bohemiancoding.com/sketch -->\n  <title>quality-arrow</title>\n  <desc>Created with Sketch.</desc>\n  <defs></defs>\n  <g id=\"quality-arrow\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n    <path\n      d=\"M5.07079194,5.78553848 C4.91457318,5.94277844 4.70551573,6.00941824 4.50028717,5.99893557 C4.2950586,6.00941824 4.08676693,5.94277844 3.92978239,5.78553848 L0.221118462,1.2997069 C-0.0737061539,1.00469478 -0.0737061539,0.526236029 0.221118462,0.231972666 C0.515177299,-0.0630394586 1.23500883,0.00734414472 1.64852907,0.00734414472 L7.77475484,0.00734414472 C8.21201421,0.00734414472 8.48539703,-0.0630394586 8.77945587,0.231972666 C9.07351471,0.526236029 9.07351471,1.00469478 8.77945587,1.2997069 L5.07079194,5.78553848 Z\"\n      fill=\"#FFFFFE\"></path>\n  </g>\n</svg>\n";
 
-const VERSION$6 = '0.0.1';
-// const T = 'plugins.audio_selector';
-const AUTO = 0;
+const global$1 = (typeof global !== "undefined" ? global :
+  typeof self !== "undefined" ? self :
+  typeof window !== "undefined" ? window : {});
+
+// the following is from is-buffer, also by Feross Aboukhadijeh and with same lisence
+// The _isBuffer check is for Safari 5-7 support, because it's missing
+// Object.prototype.constructor. Remove this eventually
+function isBuffer(obj) {
+  return obj != null && (!!obj._isBuffer || isFastBuffer(obj) || isSlowBuffer(obj))
+}
+
+function isFastBuffer (obj) {
+  return !!obj.constructor && typeof obj.constructor.isBuffer === 'function' && obj.constructor.isBuffer(obj)
+}
+
+// For Node v0.10 support. Remove this eventually.
+function isSlowBuffer (obj) {
+  return typeof obj.readFloatLE === 'function' && typeof obj.slice === 'function' && isFastBuffer(obj.slice(0, 0))
+}
+
+var inherits;
+if (typeof Object.create === 'function'){
+  inherits = function inherits(ctor, superCtor) {
+    // implementation from standard node.js 'util' module
+    ctor.super_ = superCtor;
+    ctor.prototype = Object.create(superCtor.prototype, {
+      constructor: {
+        value: ctor,
+        enumerable: false,
+        writable: true,
+        configurable: true
+      }
+    });
+  };
+} else {
+  inherits = function inherits(ctor, superCtor) {
+    ctor.super_ = superCtor;
+    var TempCtor = function () {};
+    TempCtor.prototype = superCtor.prototype;
+    ctor.prototype = new TempCtor();
+    ctor.prototype.constructor = ctor;
+  };
+}
+
 /**
- * @beta
+ * Echos the value of a value. Trys to print the value out
+ * in the best way possible given the different types.
+ *
+ * @param {Object} obj The object to print out.
+ * @param {Object} opts Optional options object that alters the output.
  */
-class AudioSelector extends UICorePlugin {
-    selectedTrackId;
-    currentTrack = null;
-    tracks = [];
-    get name() {
-        return 'media_control_audio_selector';
-    }
-    get supportedVersion() {
-        return { min: CLAPPR_VERSION };
+/* legacy: obj, showHidden, depth, colors*/
+function inspect$1(obj, opts) {
+  // default options
+  var ctx = {
+    seen: [],
+    stylize: stylizeNoColor
+  };
+  // legacy...
+  if (arguments.length >= 3) ctx.depth = arguments[2];
+  if (arguments.length >= 4) ctx.colors = arguments[3];
+  if (isBoolean(opts)) {
+    // legacy...
+    ctx.showHidden = opts;
+  } else if (opts) {
+    // got an "options" object
+    _extend(ctx, opts);
+  }
+  // set default options
+  if (isUndefined(ctx.showHidden)) ctx.showHidden = false;
+  if (isUndefined(ctx.depth)) ctx.depth = 2;
+  if (isUndefined(ctx.colors)) ctx.colors = false;
+  if (isUndefined(ctx.customInspect)) ctx.customInspect = true;
+  if (ctx.colors) ctx.stylize = stylizeWithColor;
+  return formatValue(ctx, obj, ctx.depth);
+}
+
+// http://en.wikipedia.org/wiki/ANSI_escape_code#graphics
+inspect$1.colors = {
+  'bold' : [1, 22],
+  'italic' : [3, 23],
+  'underline' : [4, 24],
+  'inverse' : [7, 27],
+  'white' : [37, 39],
+  'grey' : [90, 39],
+  'black' : [30, 39],
+  'blue' : [34, 39],
+  'cyan' : [36, 39],
+  'green' : [32, 39],
+  'magenta' : [35, 39],
+  'red' : [31, 39],
+  'yellow' : [33, 39]
+};
+
+// Don't use 'blue' not visible on cmd.exe
+inspect$1.styles = {
+  'special': 'cyan',
+  'number': 'yellow',
+  'boolean': 'yellow',
+  'undefined': 'grey',
+  'null': 'bold',
+  'string': 'green',
+  'date': 'magenta',
+  // "name": intentionally not styling
+  'regexp': 'red'
+};
+
+
+function stylizeWithColor(str, styleType) {
+  var style = inspect$1.styles[styleType];
+
+  if (style) {
+    return '\u001b[' + inspect$1.colors[style][0] + 'm' + str +
+           '\u001b[' + inspect$1.colors[style][1] + 'm';
+  } else {
+    return str;
+  }
+}
+
+
+function stylizeNoColor(str, styleType) {
+  return str;
+}
+
+
+function arrayToHash(array) {
+  var hash = {};
+
+  array.forEach(function(val, idx) {
+    hash[val] = true;
+  });
+
+  return hash;
+}
+
+
+function formatValue(ctx, value, recurseTimes) {
+  // Provide a hook for user-specified inspect functions.
+  // Check that value is an object with an inspect function on it
+  if (ctx.customInspect &&
+      value &&
+      isFunction(value.inspect) &&
+      // Filter out the util module, it's inspect function is special
+      value.inspect !== inspect$1 &&
+      // Also filter out any prototype objects using the circular check.
+      !(value.constructor && value.constructor.prototype === value)) {
+    var ret = value.inspect(recurseTimes, ctx);
+    if (!isString(ret)) {
+      ret = formatValue(ctx, ret, recurseTimes);
     }
-    static get version() {
-        return VERSION$6;
+    return ret;
+  }
+
+  // Primitive types cannot have properties
+  var primitive = formatPrimitive(ctx, value);
+  if (primitive) {
+    return primitive;
+  }
+
+  // Look up the keys of the object.
+  var keys = Object.keys(value);
+  var visibleKeys = arrayToHash(keys);
+
+  if (ctx.showHidden) {
+    keys = Object.getOwnPropertyNames(value);
+  }
+
+  // IE doesn't make error fields non-enumerable
+  // http://msdn.microsoft.com/en-us/library/ie/dww52sbt(v=vs.94).aspx
+  if (isError(value)
+      && (keys.indexOf('message') >= 0 || keys.indexOf('description') >= 0)) {
+    return formatError(value);
+  }
+
+  // Some type of object without properties can be shortcutted.
+  if (keys.length === 0) {
+    if (isFunction(value)) {
+      var name = value.name ? ': ' + value.name : '';
+      return ctx.stylize('[Function' + name + ']', 'special');
     }
-    get template() {
-        return tmpl(pluginHtml$8);
+    if (isRegExp(value)) {
+      return ctx.stylize(RegExp.prototype.toString.call(value), 'regexp');
     }
-    get attributes() {
-        return {
-            'class': this.name,
-            'data-track-selector': ''
-        };
+    if (isDate(value)) {
+      return ctx.stylize(Date.prototype.toString.call(value), 'date');
     }
-    get events() {
-        return {
-            'click [data-track-selector-select]': 'onTrackSelect',
-            'click [data-track-selector-button]': 'onShowLevelSelectMenu'
-        };
+    if (isError(value)) {
+      return formatError(value);
     }
-    bindEvents() {
-        this.listenTo(this.core, Events$1.CORE_READY, this.bindPlaybackEvents);
-        this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED, this.reload);
-        this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED, this.render);
-        this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_HIDE, this.hideSelectTrackMenu);
+  }
+
+  var base = '', array = false, braces = ['{', '}'];
+
+  // Make Array say that they are Array
+  if (isArray(value)) {
+    array = true;
+    braces = ['[', ']'];
+  }
+
+  // Make functions say that they are functions
+  if (isFunction(value)) {
+    var n = value.name ? ': ' + value.name : '';
+    base = ' [Function' + n + ']';
+  }
+
+  // Make RegExps say that they are RegExps
+  if (isRegExp(value)) {
+    base = ' ' + RegExp.prototype.toString.call(value);
+  }
+
+  // Make dates with properties first say the date
+  if (isDate(value)) {
+    base = ' ' + Date.prototype.toUTCString.call(value);
+  }
+
+  // Make error with message first say the error
+  if (isError(value)) {
+    base = ' ' + formatError(value);
+  }
+
+  if (keys.length === 0 && (!array || value.length == 0)) {
+    return braces[0] + base + braces[1];
+  }
+
+  if (recurseTimes < 0) {
+    if (isRegExp(value)) {
+      return ctx.stylize(RegExp.prototype.toString.call(value), 'regexp');
+    } else {
+      return ctx.stylize('[Object]', 'special');
     }
-    unBindEvents() {
-        // @ts-ignore
-        this.stopListening(this.core, Events$1.CORE_READY);
-        // @ts-ignore
-        this.stopListening(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED);
-        // @ts-ignore
-        this.stopListening(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED);
-        // @ts-ignore
-        this.stopListening(this.core.mediaControl, Events$1.MEDIACONTROL_HIDE);
-    }
-    bindPlaybackEvents() {
-        // this.currentTrack = {};
-        // this.removeAuto = false;
-        this.selectedTrackId = undefined;
-        const currentPlayback = this.core.activePlayback;
-        this.listenTo(currentPlayback, Events$1.PLAYBACK_STOP, this.onStop);
-        this.setupAudioTrackListeners();
-    }
-    setupAudioTrackListeners() {
-        const currentPlayback = this.core.activePlayback;
-        // TODO no-crutch:currentPlayback._hls
-        if (currentPlayback._hls) {
-            // TODO AUDIO_TRACKS_UPDATED
-            // currentPlayback._hls.on('hlsAudioTracksUpdated', (e, data) => {
-            currentPlayback._hls.on(Events.AUDIO_TRACKS_UPDATED, (e, data) => {
-                // let id = -1;
-                // for (const audioTrack of data.audioTracks) {
-                //   if (audioTrack.default) {
-                //     id = audioTrack.id;
-                //     this.currentTrack = audioTrack;
-                //   }
-                // }
-                const defaultTrack = data.audioTracks.find((track) => track.default);
-                if (defaultTrack) {
-                    this.currentTrack = {
-                        id: defaultTrack.id,
-                        label: defaultTrack.name
-                    };
-                }
-                this.fillTracks(data.audioTracks.map(p => ({
-                    id: p.id,
-                    label: p.name
-                })), defaultTrack?.id);
-            });
-            currentPlayback._hls.on(Events.AUDIO_TRACK_SWITCHING, this.startTrackSwitch.bind(this));
-            currentPlayback._hls.on(Events.AUDIO_TRACK_SWITCHED, this.updateCurrentTrack.bind(this));
-            currentPlayback._hls.on(Events.AUDIO_TRACK_LOADED, this.updateCurrentTrack.bind(this));
-        }
-        else {
-            this.listenToOnce(currentPlayback, Events$1.PLAYBACK_PLAY, () => {
-                const mediaElement = currentPlayback.$el.get(0);
-                // const { audioTracks } = currentPlayback.$el.get(0);
-                const audioTracks = mediaElement.audioTracks;
-                if (audioTracks && audioTracks.length) {
-                    let index = 0;
-                    const trackItems = [];
-                    for (const audioTrack of audioTracks) {
-                        if (audioTrack.enabled) {
-                            const t = {
-                                id: index,
-                                label: audioTrack.label,
-                            };
-                            this.currentTrack = t;
-                            trackItems.push(t);
-                            index++;
-                        }
-                    }
-                    audioTracks.addEventListener('change', () => this.updateCurrentTrackW3C());
-                    this.fillTracks(trackItems, trackItems[0].id);
-                }
-            });
-        }
-    }
-    onStop() { }
-    reload() {
-        this.unBindEvents();
-        this.bindEvents();
-        this.bindPlaybackEvents();
-    }
-    shouldRender() {
-        if (!this.core.activeContainer) {
-            return false;
-        }
-        const currentPlayback = this.core.activePlayback;
-        if (!currentPlayback) {
-            return false;
-        }
-        const { audioTracks } = (currentPlayback.activePlayback._hls || currentPlayback.$el.get(0));
-        this.tracks = audioTracks;
-        // Only care if we have at least 2 to choose from
-        return this.tracks && this.tracks.length > 1;
-    }
-    render() {
-        if (this.shouldRender()) {
-            this.$el.html(this.template({ 'tracks': this.tracks, 'title': this.getTitle() }));
-            if (Object.prototype.hasOwnProperty.call(this.core.mediaControl, '$audioTracksSelector') &&
-                this.core.mediaControl.$audioTracksSelector.length > 0) {
-                this.core.mediaControl.$audioTracksSelector.append(this.el);
-            }
-            this.highlightCurrentTrack();
-        }
-        if (Object.prototype.hasOwnProperty.call(this.core.mediaControl, '$audioTracksSelector') &&
-            this.core.mediaControl.$audioTracksSelector.find('span.audio-arrow').length > 0) {
-            this.core.mediaControl.$audioTracksSelector.find('span.audio-arrow').append(audioArrow);
-        }
-        return this;
+  }
+
+  ctx.seen.push(value);
+
+  var output;
+  if (array) {
+    output = formatArray(ctx, value, recurseTimes, visibleKeys, keys);
+  } else {
+    output = keys.map(function(key) {
+      return formatProperty(ctx, value, recurseTimes, visibleKeys, key, array);
+    });
+  }
+
+  ctx.seen.pop();
+
+  return reduceToSingleString(output, base, braces);
+}
+
+
+function formatPrimitive(ctx, value) {
+  if (isUndefined(value))
+    return ctx.stylize('undefined', 'undefined');
+  if (isString(value)) {
+    var simple = '\'' + JSON.stringify(value).replace(/^"|"$/g, '')
+                                             .replace(/'/g, "\\'")
+                                             .replace(/\\"/g, '"') + '\'';
+    return ctx.stylize(simple, 'string');
+  }
+  if (isNumber(value))
+    return ctx.stylize('' + value, 'number');
+  if (isBoolean(value))
+    return ctx.stylize('' + value, 'boolean');
+  // For some reason typeof null is "object", so special case here.
+  if (isNull(value))
+    return ctx.stylize('null', 'null');
+}
+
+
+function formatError(value) {
+  return '[' + Error.prototype.toString.call(value) + ']';
+}
+
+
+function formatArray(ctx, value, recurseTimes, visibleKeys, keys) {
+  var output = [];
+  for (var i = 0, l = value.length; i < l; ++i) {
+    if (hasOwnProperty(value, String(i))) {
+      output.push(formatProperty(ctx, value, recurseTimes, visibleKeys,
+          String(i), true));
+    } else {
+      output.push('');
     }
-    fillTracks(tracks, selected = AUTO) {
-        if (this.selectedTrackId === undefined) {
-            this.selectedTrackId = selected;
-        }
-        // this.tracks = levels.audioTracks;
-        // for (let i = 0; i < this.tracks.length; i++) {
-        //   if (this.tracks[i].name && !this.tracks[i].label) {
-        //     this.tracks[i].label = this.tracks[i].name;
-        //   }
-        // }
-        this.tracks = tracks;
-        // Player.player.trigger('tracks', this.tracks);
-        // this.core.trigger('tracks', this.tracks);
-        this.render();
+  }
+  keys.forEach(function(key) {
+    if (!key.match(/^\d+$/)) {
+      output.push(formatProperty(ctx, value, recurseTimes, visibleKeys,
+          key, true));
     }
-    findTrackBy(id) {
-        return this.tracks.find((track) => track.id === id);
+  });
+  return output;
+}
+
+
+function formatProperty(ctx, value, recurseTimes, visibleKeys, key, array) {
+  var name, str, desc;
+  desc = Object.getOwnPropertyDescriptor(value, key) || { value: value[key] };
+  if (desc.get) {
+    if (desc.set) {
+      str = ctx.stylize('[Getter/Setter]', 'special');
+    } else {
+      str = ctx.stylize('[Getter]', 'special');
     }
-    onTrackSelect(event) {
-        // this.selectedTrackId = parseInt(event.target.dataset.levelSelectorSelect, 10)
-        const id = event.target?.dataset?.trackSelectorSelect;
-        if (id) {
-            this.setIndexTrack(Number(id));
-        }
-        this.toggleContextMenu();
-        event.stopPropagation();
-        return false;
+  } else {
+    if (desc.set) {
+      str = ctx.stylize('[Setter]', 'special');
     }
-    setIndexTrack(index) {
-        this.selectedTrackId = index;
-        if (this.core.activePlayback._hls) {
-            if (this.core.activePlayback._hls.audioTrack.id === this.selectedTrackId) {
-                return;
-            }
-            this.core.activePlayback._hls.audioTrack = this.selectedTrackId;
-        }
-        else {
-            const { audioTracks } = this.core.activePlayback.$el.get(0);
-            for (const track of audioTracks) {
-                track.enabled = track.id === this.selectedTrackId;
-            }
+  }
+  if (!hasOwnProperty(visibleKeys, key)) {
+    name = '[' + key + ']';
+  }
+  if (!str) {
+    if (ctx.seen.indexOf(desc.value) < 0) {
+      if (isNull(recurseTimes)) {
+        str = formatValue(ctx, desc.value, null);
+      } else {
+        str = formatValue(ctx, desc.value, recurseTimes - 1);
+      }
+      if (str.indexOf('\n') > -1) {
+        if (array) {
+          str = str.split('\n').map(function(line) {
+            return '  ' + line;
+          }).join('\n').substr(2);
+        } else {
+          str = '\n' + str.split('\n').map(function(line) {
+            return '   ' + line;
+          }).join('\n');
         }
-        this.updateText(this.selectedTrackId);
-    }
-    onShowLevelSelectMenu() {
-        this.toggleContextMenu();
-    }
-    hideSelectTrackMenu() {
-        this.$('.audio_selector ul').hide();
-    }
-    toggleContextMenu() {
-        this.$('.audio_selector ul').toggle();
-    }
-    buttonElement() {
-        return this.$('.audio_selector button');
+      }
+    } else {
+      str = ctx.stylize('[Circular]', 'special');
     }
-    buttonElementText() {
-        return this.$('.audio_selector button .audio-text');
+  }
+  if (isUndefined(name)) {
+    if (array && key.match(/^\d+$/)) {
+      return str;
     }
-    trackElement(id) {
-        return this.$('.audio_selector ul a' + (id !== undefined ? '[data-track-selector-select="' + id + '"]' : '')).parent();
+    name = JSON.stringify('' + key);
+    if (name.match(/^"([a-zA-Z_][a-zA-Z_0-9]*)"$/)) {
+      name = name.substr(1, name.length - 2);
+      name = ctx.stylize(name, 'name');
+    } else {
+      name = name.replace(/'/g, "\\'")
+                 .replace(/\\"/g, '"')
+                 .replace(/(^"|"$)/g, "'");
+      name = ctx.stylize(name, 'string');
     }
-    getTitle() {
-        if (!this.tracks) {
-            return '';
-        }
-        const selectedTrackId = this.selectedTrackId || 0;
-        const selectedTrack = this.tracks[selectedTrackId];
-        return selectedTrack?.label || '';
-    }
-    startTrackSwitch() {
-        this.buttonElement().addClass('changing');
-    }
-    updateText(trackId) {
-        if (trackId === undefined) {
-            return;
-        }
-        const track = this.findTrackBy(trackId);
-        if (track) {
-            this.buttonElementText().text(track.label);
-        }
-    }
-    updateCurrentTrack(e, info) {
-        // if (!info) {
-        //   const { audioTracks } = this.core.activePlayback.$el.get(0);
-        //   for (const track of audioTracks) {
-        //     if (track.enabled) {
-        //       info = track;
-        //     }
-        //   }
-        // }
-        // if (!info) {
-        //   return;
-        // }
-        // const track = this.findTrackBy(info.id);
-        // this.currentTrack = track ? track : null;
-        // this.selectedTrackId = track?.id;
-        // this.highlightCurrentTrack();
-        // this.buttonElement().removeClass('changing');
-        this.setCurrentTrack(info.id);
-    }
-    updateCurrentTrackW3C() {
-        const { audioTracks } = this.core.activePlayback.$el.get(0);
-        const index = audioTracks.findIndex((track) => track.enabled);
-        if (index >= 0) {
-            this.setCurrentTrack(index);
-        }
-    }
-    setCurrentTrack(index) {
-        const track = this.findTrackBy(index);
-        this.currentTrack = track ?? null;
-        this.selectedTrackId = index;
-        this.highlightCurrentTrack();
-        this.buttonElement().removeClass('changing');
-    }
-    highlightCurrentTrack() {
-        this.trackElement().removeClass('current');
-        this.trackElement().find('a').removeClass('gcore-skin-active');
-        if (this.currentTrack) {
-            const currentTrackElement = this.trackElement(this.currentTrack.id);
-            currentTrackElement.addClass('current');
-            currentTrackElement.find('a').addClass('gcore-skin-active');
-        }
-        this.updateText(this.selectedTrackId);
-    }
-}
+  }
 
-/**
- * @public
- * @param msg
- * @param data
- */
-function trace(msg, data = {}) {
+  return name + ': ' + str;
 }
 
-const volumeOffIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n  <path\n    d=\"M5.50025 8.00025C4.67125 8.00025 4.00025 8.67225 4.00025 9.50025V14.5003C4.00025 15.3283 4.67125 16.0003 5.50025 16.0003H7.24824C7.65024 16.0003 8.03627 16.1613 8.31727 16.4483L12.5443 20.7413C12.7083 20.9073 12.9262 20.9963 13.1492 20.9963C13.2572 20.9963 13.3672 20.9763 13.4722 20.9333C13.7932 20.8013 14.0003 20.4923 14.0003 20.1462V16.3283C14.0003 16.1963 13.9473 16.0683 13.8543 15.9753L6.02528 8.14625C5.93228 8.05325 5.80425 8.00025 5.67225 8.00025H5.50025ZM14.0003 3.85426C14.0003 3.50826 13.7932 3.19927 13.4722 3.06727C13.1502 2.93627 12.7873 3.01226 12.5443 3.25926L9.33827 6.51527C9.14627 6.71127 9.14626 7.02625 9.34126 7.22025L13.5733 11.4522C13.7313 11.6102 14.0003 11.4982 14.0003 11.2752V3.85426ZM20.8543 20.8543C20.7563 20.9513 20.6283 21.0003 20.5003 21.0003C20.3723 21.0003 20.2442 20.9513 20.1462 20.8543L3.14625 3.85426C2.95125 3.65826 2.95125 3.34225 3.14625 3.14625C3.34225 2.95125 3.65826 2.95125 3.85426 3.14625L20.8543 20.1462C21.0493 20.3422 21.0493 20.6583 20.8543 20.8543Z\"\n    fill=\"#C9C9C9\"/>\n</svg>\n";
 
-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";
+function reduceToSingleString(output, base, braces) {
+  var length = output.reduce(function(prev, cur) {
+    if (cur.indexOf('\n') >= 0) ;
+    return prev + cur.replace(/\u001b\[\d\d?m/g, '').length + 1;
+  }, 0);
 
-const T$8 = "plugins.big_mute_button";
-/**
- * @beta
- */
-class BigMuteButton extends UICorePlugin {
-    isBigMuteButtonHidden = false;
-    _adIsPlaying = false;
-    $bigMuteBtnContainer = null;
-    $bigMuteButton = null;
-    get name() {
-        return 'big_mute_button';
-    }
-    get supportedVersion() {
-        return { min: CLAPPR_VERSION };
-    }
-    get template() {
-        return tmpl(pluginHtml$7);
-    }
-    get events() {
-        return {
-            'click .big-mute-icon': 'handleBigMuteBtnClick',
-            'click .big-mute-icon-wrapper': 'destroyBigMuteBtn',
-        };
-    }
-    bindEvents() {
-        super.bindEvents();
-        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$8} bindEvents`, {
-            mediacontrol: !!this.core.mediaControl,
-        });
-        this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED, this.mediaControlRendered);
-    }
-    unBindEvents() {
-        // @ts-ignore
-        this.stopListening(this.core, Events$1.CORE_READY);
-        this.stopListening(this.core, 'core:advertisement:start', this.onStartAd);
-        this.stopListening(this.core, 'core:advertisement:finish', this.onFinishAd);
-        this.stopListening(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED, this.mediaControlRendered);
-        const container = this.core.activeContainer;
-        if (container) {
-            this.stopListening(container.playback, Events$1.PLAYBACK_PLAY, this.render);
-        }
-    }
-    onCoreReady() {
-        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_VOLUME, this.onContainerVolume);
-        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_READY, this.onContainerStart);
-        this.listenTo(this.core.activePlayback, Events$1.PLAYBACK_ENDED, this.onPlaybackEnded);
-    }
-    onContainerVolume(value) {
-        if (value !== 0) {
-            this.destroyBigMuteBtn();
-        }
-    }
-    onContainerStart() {
-        if (this.isBigMuteButtonHidden) {
-            this.showBigMuteBtn();
-        }
-    }
-    onPlaybackEnded() {
-        this.hideBigMuteBtn();
-    }
-    mediaControlRendered() {
-        const container = this.core.activeContainer;
-        if (container) {
-            this.listenTo(container.playback, Events$1.PLAYBACK_PLAY, () => {
-                this.render();
-            });
-        }
-    }
-    onStartAd() {
-        this._adIsPlaying = true;
-        if (this.$bigMuteBtnContainer) {
-            this.$bigMuteBtnContainer.addClass('hide');
-        }
-    }
-    onFinishAd() {
-        this._adIsPlaying = false;
-        if (this.$bigMuteBtnContainer) {
-            this.$bigMuteBtnContainer.removeClass('hide');
-        }
-    }
-    shouldRender() {
-        const container = this.core.activeContainer;
-        if (!container) {
-            return false;
-        }
-        const { autoPlay, wasMuted } = this.options;
-        const volume = container.volume;
-        return autoPlay && !wasMuted && volume === 0;
-    }
-    render() {
-        if (this.shouldRender()) {
-            trace(`${T$8} render`, {
-                el: !!this.$el,
-            });
-            this.$el.html(this.template());
-            this.$bigMuteBtnContainer = this.$el.find('.big-mute-icon-wrapper[data-big-mute]');
-            this._adIsPlaying && this.$bigMuteBtnContainer.addClass('hide');
-            this.$bigMuteButton = this.$bigMuteBtnContainer.find('.big-mute-icon');
-            this.$bigMuteButton.append(volumeOffIcon);
-            const container = this.core.activeContainer;
-            container.$el.append(this.$el.get(0));
-        }
-        return this;
-    }
-    hideBigMuteBtn() {
-        this.isBigMuteButtonHidden = true;
-        this.$bigMuteBtnContainer?.addClass('hide');
-    }
-    showBigMuteBtn() {
-        this.isBigMuteButtonHidden = false;
-        if (this.$bigMuteBtnContainer) {
-            this.$bigMuteBtnContainer.removeClass('hide');
-        }
-    }
-    destroyBigMuteBtn(e) {
-        this.hideBigMuteBtn();
-        if (e && e.stopPropagation) {
-            e.stopPropagation();
-        }
-        this.destroy();
-    }
-    handleBigMuteBtnClick(e) {
-        const localVolume = Utils.Config.restore('volume');
-        const volume = !isNaN(localVolume) ? localVolume : 100;
-        // TODO use container.setVolume() instead
-        this.core.mediaControl.setVolume(volume === 0 ? 100 : volume);
-        this.destroyBigMuteBtn(e);
-    }
+  if (length > 60) {
+    return braces[0] +
+           (base === '' ? '' : base + '\n ') +
+           ' ' +
+           output.join(',\n  ') +
+           ' ' +
+           braces[1];
+  }
+
+  return braces[0] + base + ' ' + output.join(', ') + ' ' + braces[1];
 }
 
-const global$1 = (typeof global !== "undefined" ? global :
-  typeof self !== "undefined" ? self :
-  typeof window !== "undefined" ? window : {});
 
-// the following is from is-buffer, also by Feross Aboukhadijeh and with same lisence
-// The _isBuffer check is for Safari 5-7 support, because it's missing
-// Object.prototype.constructor. Remove this eventually
-function isBuffer(obj) {
-  return obj != null && (!!obj._isBuffer || isFastBuffer(obj) || isSlowBuffer(obj))
+// NOTE: These type checking functions intentionally don't use `instanceof`
+// because it is fragile and can be easily faked with `Object.create()`.
+function isArray(ar) {
+  return Array.isArray(ar);
 }
 
-function isFastBuffer (obj) {
-  return !!obj.constructor && typeof obj.constructor.isBuffer === 'function' && obj.constructor.isBuffer(obj)
+function isBoolean(arg) {
+  return typeof arg === 'boolean';
 }
 
-// For Node v0.10 support. Remove this eventually.
-function isSlowBuffer (obj) {
-  return typeof obj.readFloatLE === 'function' && typeof obj.slice === 'function' && isFastBuffer(obj.slice(0, 0))
+function isNull(arg) {
+  return arg === null;
 }
 
-var inherits;
-if (typeof Object.create === 'function'){
-  inherits = function inherits(ctor, superCtor) {
-    // implementation from standard node.js 'util' module
-    ctor.super_ = superCtor;
-    ctor.prototype = Object.create(superCtor.prototype, {
-      constructor: {
-        value: ctor,
-        enumerable: false,
-        writable: true,
-        configurable: true
-      }
-    });
-  };
-} else {
-  inherits = function inherits(ctor, superCtor) {
-    ctor.super_ = superCtor;
-    var TempCtor = function () {};
-    TempCtor.prototype = superCtor.prototype;
-    ctor.prototype = new TempCtor();
-    ctor.prototype.constructor = ctor;
-  };
+function isNumber(arg) {
+  return typeof arg === 'number';
 }
 
-/**
- * Echos the value of a value. Trys to print the value out
- * in the best way possible given the different types.
- *
- * @param {Object} obj The object to print out.
- * @param {Object} opts Optional options object that alters the output.
- */
-/* legacy: obj, showHidden, depth, colors*/
-function inspect$1(obj, opts) {
-  // default options
-  var ctx = {
-    seen: [],
-    stylize: stylizeNoColor
-  };
-  // legacy...
-  if (arguments.length >= 3) ctx.depth = arguments[2];
-  if (arguments.length >= 4) ctx.colors = arguments[3];
-  if (isBoolean(opts)) {
-    // legacy...
-    ctx.showHidden = opts;
-  } else if (opts) {
-    // got an "options" object
-    _extend(ctx, opts);
-  }
-  // set default options
-  if (isUndefined(ctx.showHidden)) ctx.showHidden = false;
-  if (isUndefined(ctx.depth)) ctx.depth = 2;
-  if (isUndefined(ctx.colors)) ctx.colors = false;
-  if (isUndefined(ctx.customInspect)) ctx.customInspect = true;
-  if (ctx.colors) ctx.stylize = stylizeWithColor;
-  return formatValue(ctx, obj, ctx.depth);
+function isString(arg) {
+  return typeof arg === 'string';
 }
 
-// http://en.wikipedia.org/wiki/ANSI_escape_code#graphics
-inspect$1.colors = {
-  'bold' : [1, 22],
-  'italic' : [3, 23],
-  'underline' : [4, 24],
-  'inverse' : [7, 27],
-  'white' : [37, 39],
-  'grey' : [90, 39],
-  'black' : [30, 39],
-  'blue' : [34, 39],
-  'cyan' : [36, 39],
-  'green' : [32, 39],
-  'magenta' : [35, 39],
-  'red' : [31, 39],
-  'yellow' : [33, 39]
-};
-
-// Don't use 'blue' not visible on cmd.exe
-inspect$1.styles = {
-  'special': 'cyan',
-  'number': 'yellow',
-  'boolean': 'yellow',
-  'undefined': 'grey',
-  'null': 'bold',
-  'string': 'green',
-  'date': 'magenta',
-  // "name": intentionally not styling
-  'regexp': 'red'
-};
-
-
-function stylizeWithColor(str, styleType) {
-  var style = inspect$1.styles[styleType];
+function isUndefined(arg) {
+  return arg === undefined;
+}
 
-  if (style) {
-    return '\u001b[' + inspect$1.colors[style][0] + 'm' + str +
-           '\u001b[' + inspect$1.colors[style][1] + 'm';
-  } else {
-    return str;
-  }
+function isRegExp(re) {
+  return isObject(re) && objectToString(re) === '[object RegExp]';
 }
 
+function isObject(arg) {
+  return typeof arg === 'object' && arg !== null;
+}
 
-function stylizeNoColor(str, styleType) {
-  return str;
+function isDate(d) {
+  return isObject(d) && objectToString(d) === '[object Date]';
 }
 
+function isError(e) {
+  return isObject(e) &&
+      (objectToString(e) === '[object Error]' || e instanceof Error);
+}
 
-function arrayToHash(array) {
-  var hash = {};
+function isFunction(arg) {
+  return typeof arg === 'function';
+}
 
-  array.forEach(function(val, idx) {
-    hash[val] = true;
-  });
+function isPrimitive(arg) {
+  return arg === null ||
+         typeof arg === 'boolean' ||
+         typeof arg === 'number' ||
+         typeof arg === 'string' ||
+         typeof arg === 'symbol' ||  // ES6 symbol
+         typeof arg === 'undefined';
+}
 
-  return hash;
+function objectToString(o) {
+  return Object.prototype.toString.call(o);
 }
 
+function _extend(origin, add) {
+  // Don't do anything if add isn't an object
+  if (!add || !isObject(add)) return origin;
 
-function formatValue(ctx, value, recurseTimes) {
-  // Provide a hook for user-specified inspect functions.
-  // Check that value is an object with an inspect function on it
-  if (ctx.customInspect &&
-      value &&
-      isFunction(value.inspect) &&
-      // Filter out the util module, it's inspect function is special
-      value.inspect !== inspect$1 &&
-      // Also filter out any prototype objects using the circular check.
-      !(value.constructor && value.constructor.prototype === value)) {
-    var ret = value.inspect(recurseTimes, ctx);
-    if (!isString(ret)) {
-      ret = formatValue(ctx, ret, recurseTimes);
-    }
-    return ret;
+  var keys = Object.keys(add);
+  var i = keys.length;
+  while (i--) {
+    origin[keys[i]] = add[keys[i]];
   }
+  return origin;
+}
+function hasOwnProperty(obj, prop) {
+  return Object.prototype.hasOwnProperty.call(obj, prop);
+}
 
-  // Primitive types cannot have properties
-  var primitive = formatPrimitive(ctx, value);
-  if (primitive) {
-    return primitive;
+function compare(a, b) {
+  if (a === b) {
+    return 0;
   }
 
-  // Look up the keys of the object.
-  var keys = Object.keys(value);
-  var visibleKeys = arrayToHash(keys);
+  var x = a.length;
+  var y = b.length;
 
-  if (ctx.showHidden) {
-    keys = Object.getOwnPropertyNames(value);
+  for (var i = 0, len = Math.min(x, y); i < len; ++i) {
+    if (a[i] !== b[i]) {
+      x = a[i];
+      y = b[i];
+      break;
+    }
   }
 
-  // IE doesn't make error fields non-enumerable
-  // http://msdn.microsoft.com/en-us/library/ie/dww52sbt(v=vs.94).aspx
-  if (isError(value)
-      && (keys.indexOf('message') >= 0 || keys.indexOf('description') >= 0)) {
-    return formatError(value);
+  if (x < y) {
+    return -1;
   }
-
-  // Some type of object without properties can be shortcutted.
-  if (keys.length === 0) {
-    if (isFunction(value)) {
-      var name = value.name ? ': ' + value.name : '';
-      return ctx.stylize('[Function' + name + ']', 'special');
-    }
-    if (isRegExp(value)) {
-      return ctx.stylize(RegExp.prototype.toString.call(value), 'regexp');
-    }
-    if (isDate(value)) {
-      return ctx.stylize(Date.prototype.toString.call(value), 'date');
-    }
-    if (isError(value)) {
-      return formatError(value);
-    }
+  if (y < x) {
+    return 1;
   }
+  return 0;
+}
+var hasOwn = Object.prototype.hasOwnProperty;
 
-  var base = '', array = false, braces = ['{', '}'];
-
-  // Make Array say that they are Array
-  if (isArray(value)) {
-    array = true;
-    braces = ['[', ']'];
+var objectKeys = Object.keys || function (obj) {
+  var keys = [];
+  for (var key in obj) {
+    if (hasOwn.call(obj, key)) keys.push(key);
   }
-
-  // Make functions say that they are functions
-  if (isFunction(value)) {
-    var n = value.name ? ': ' + value.name : '';
-    base = ' [Function' + n + ']';
+  return keys;
+};
+var pSlice = Array.prototype.slice;
+var _functionsHaveNames;
+function functionsHaveNames() {
+  if (typeof _functionsHaveNames !== 'undefined') {
+    return _functionsHaveNames;
   }
-
-  // Make RegExps say that they are RegExps
-  if (isRegExp(value)) {
-    base = ' ' + RegExp.prototype.toString.call(value);
+  return _functionsHaveNames = (function () {
+    return function foo() {}.name === 'foo';
+  }());
+}
+function pToString (obj) {
+  return Object.prototype.toString.call(obj);
+}
+function isView(arrbuf) {
+  if (isBuffer(arrbuf)) {
+    return false;
   }
-
-  // Make dates with properties first say the date
-  if (isDate(value)) {
-    base = ' ' + Date.prototype.toUTCString.call(value);
+  if (typeof global$1.ArrayBuffer !== 'function') {
+    return false;
   }
-
-  // Make error with message first say the error
-  if (isError(value)) {
-    base = ' ' + formatError(value);
+  if (typeof ArrayBuffer.isView === 'function') {
+    return ArrayBuffer.isView(arrbuf);
   }
-
-  if (keys.length === 0 && (!array || value.length == 0)) {
-    return braces[0] + base + braces[1];
+  if (!arrbuf) {
+    return false;
   }
-
-  if (recurseTimes < 0) {
-    if (isRegExp(value)) {
-      return ctx.stylize(RegExp.prototype.toString.call(value), 'regexp');
-    } else {
-      return ctx.stylize('[Object]', 'special');
-    }
+  if (arrbuf instanceof DataView) {
+    return true;
+  }
+  if (arrbuf.buffer && arrbuf.buffer instanceof ArrayBuffer) {
+    return true;
   }
+  return false;
+}
+// 1. The assert module provides functions that throw
+// AssertionError's when particular conditions are not met. The
+// assert module must conform to the following interface.
 
-  ctx.seen.push(value);
-
-  var output;
-  if (array) {
-    output = formatArray(ctx, value, recurseTimes, visibleKeys, keys);
-  } else {
-    output = keys.map(function(key) {
-      return formatProperty(ctx, value, recurseTimes, visibleKeys, key, array);
-    });
-  }
-
-  ctx.seen.pop();
-
-  return reduceToSingleString(output, base, braces);
-}
+function assert(value, message) {
+  if (!value) fail(value, true, message, '==', ok);
+}
 
+// 2. The AssertionError is defined in assert.
+// new assert.AssertionError({ message: message,
+//                             actual: actual,
+//                             expected: expected })
 
-function formatPrimitive(ctx, value) {
-  if (isUndefined(value))
-    return ctx.stylize('undefined', 'undefined');
-  if (isString(value)) {
-    var simple = '\'' + JSON.stringify(value).replace(/^"|"$/g, '')
-                                             .replace(/'/g, "\\'")
-                                             .replace(/\\"/g, '"') + '\'';
-    return ctx.stylize(simple, 'string');
+var regex = /\s*function\s+([^\(\s]*)\s*/;
+// based on https://github.com/ljharb/function.prototype.name/blob/adeeeec8bfcc6068b187d7d9fb3d5bb1d3a30899/implementation.js
+function getName(func) {
+  if (!isFunction(func)) {
+    return;
   }
-  if (isNumber(value))
-    return ctx.stylize('' + value, 'number');
-  if (isBoolean(value))
-    return ctx.stylize('' + value, 'boolean');
-  // For some reason typeof null is "object", so special case here.
-  if (isNull(value))
-    return ctx.stylize('null', 'null');
-}
-
-
-function formatError(value) {
-  return '[' + Error.prototype.toString.call(value) + ']';
+  if (functionsHaveNames()) {
+    return func.name;
+  }
+  var str = func.toString();
+  var match = str.match(regex);
+  return match && match[1];
 }
+assert.AssertionError = AssertionError;
+function AssertionError(options) {
+  this.name = 'AssertionError';
+  this.actual = options.actual;
+  this.expected = options.expected;
+  this.operator = options.operator;
+  if (options.message) {
+    this.message = options.message;
+    this.generatedMessage = false;
+  } else {
+    this.message = getMessage(this);
+    this.generatedMessage = true;
+  }
+  var stackStartFunction = options.stackStartFunction || fail;
+  if (Error.captureStackTrace) {
+    Error.captureStackTrace(this, stackStartFunction);
+  } else {
+    // non v8 browsers so we can have a stacktrace
+    var err = new Error();
+    if (err.stack) {
+      var out = err.stack;
 
+      // try to strip useless frames
+      var fn_name = getName(stackStartFunction);
+      var idx = out.indexOf('\n' + fn_name);
+      if (idx >= 0) {
+        // once we have located the function frame
+        // we need to strip out everything before it (and its line)
+        var next_line = out.indexOf('\n', idx + 1);
+        out = out.substring(next_line + 1);
+      }
 
-function formatArray(ctx, value, recurseTimes, visibleKeys, keys) {
-  var output = [];
-  for (var i = 0, l = value.length; i < l; ++i) {
-    if (hasOwnProperty(value, String(i))) {
-      output.push(formatProperty(ctx, value, recurseTimes, visibleKeys,
-          String(i), true));
-    } else {
-      output.push('');
+      this.stack = out;
     }
   }
-  keys.forEach(function(key) {
-    if (!key.match(/^\d+$/)) {
-      output.push(formatProperty(ctx, value, recurseTimes, visibleKeys,
-          key, true));
-    }
-  });
-  return output;
 }
 
+// assert.AssertionError instanceof Error
+inherits(AssertionError, Error);
 
-function formatProperty(ctx, value, recurseTimes, visibleKeys, key, array) {
-  var name, str, desc;
-  desc = Object.getOwnPropertyDescriptor(value, key) || { value: value[key] };
-  if (desc.get) {
-    if (desc.set) {
-      str = ctx.stylize('[Getter/Setter]', 'special');
-    } else {
-      str = ctx.stylize('[Getter]', 'special');
-    }
+function truncate(s, n) {
+  if (typeof s === 'string') {
+    return s.length < n ? s : s.slice(0, n);
   } else {
-    if (desc.set) {
-      str = ctx.stylize('[Setter]', 'special');
-    }
-  }
-  if (!hasOwnProperty(visibleKeys, key)) {
-    name = '[' + key + ']';
-  }
-  if (!str) {
-    if (ctx.seen.indexOf(desc.value) < 0) {
-      if (isNull(recurseTimes)) {
-        str = formatValue(ctx, desc.value, null);
-      } else {
-        str = formatValue(ctx, desc.value, recurseTimes - 1);
-      }
-      if (str.indexOf('\n') > -1) {
-        if (array) {
-          str = str.split('\n').map(function(line) {
-            return '  ' + line;
-          }).join('\n').substr(2);
-        } else {
-          str = '\n' + str.split('\n').map(function(line) {
-            return '   ' + line;
-          }).join('\n');
-        }
-      }
-    } else {
-      str = ctx.stylize('[Circular]', 'special');
-    }
+    return s;
   }
-  if (isUndefined(name)) {
-    if (array && key.match(/^\d+$/)) {
-      return str;
-    }
-    name = JSON.stringify('' + key);
-    if (name.match(/^"([a-zA-Z_][a-zA-Z_0-9]*)"$/)) {
-      name = name.substr(1, name.length - 2);
-      name = ctx.stylize(name, 'name');
-    } else {
-      name = name.replace(/'/g, "\\'")
-                 .replace(/\\"/g, '"')
-                 .replace(/(^"|"$)/g, "'");
-      name = ctx.stylize(name, 'string');
-    }
+}
+function inspect(something) {
+  if (functionsHaveNames() || !isFunction(something)) {
+    return inspect$1(something);
   }
-
-  return name + ': ' + str;
+  var rawname = getName(something);
+  var name = rawname ? ': ' + rawname : '';
+  return '[Function' +  name + ']';
+}
+function getMessage(self) {
+  return truncate(inspect(self.actual), 128) + ' ' +
+         self.operator + ' ' +
+         truncate(inspect(self.expected), 128);
 }
 
+// At present only the three keys mentioned above are used and
+// understood by the spec. Implementations or sub modules can pass
+// other keys to the AssertionError's constructor - they will be
+// ignored.
 
-function reduceToSingleString(output, base, braces) {
-  var length = output.reduce(function(prev, cur) {
-    if (cur.indexOf('\n') >= 0) ;
-    return prev + cur.replace(/\u001b\[\d\d?m/g, '').length + 1;
-  }, 0);
-
-  if (length > 60) {
-    return braces[0] +
-           (base === '' ? '' : base + '\n ') +
-           ' ' +
-           output.join(',\n  ') +
-           ' ' +
-           braces[1];
-  }
+// 3. All of the following functions must throw an AssertionError
+// when a corresponding condition is not met, with a message that
+// may be undefined if not provided.  All assertion methods provide
+// both the actual and expected values to the assertion error for
+// display purposes.
 
-  return braces[0] + base + ' ' + output.join(', ') + ' ' + braces[1];
+function fail(actual, expected, message, operator, stackStartFunction) {
+  throw new AssertionError({
+    message: message,
+    actual: actual,
+    expected: expected,
+    operator: operator,
+    stackStartFunction: stackStartFunction
+  });
 }
 
+// EXTENSION! allows for well behaved errors defined elsewhere.
+assert.fail = fail;
 
-// NOTE: These type checking functions intentionally don't use `instanceof`
-// because it is fragile and can be easily faked with `Object.create()`.
-function isArray(ar) {
-  return Array.isArray(ar);
-}
+// 4. Pure assertion tests whether a value is truthy, as determined
+// by !!guard.
+// assert.ok(guard, message_opt);
+// This statement is equivalent to assert.equal(true, !!guard,
+// message_opt);. To test strictly for the value true, use
+// assert.strictEqual(true, guard, message_opt);.
 
-function isBoolean(arg) {
-  return typeof arg === 'boolean';
+function ok(value, message) {
+  if (!value) fail(value, true, message, '==', ok);
 }
+assert.ok = ok;
 
-function isNull(arg) {
-  return arg === null;
+// 5. The equality assertion tests shallow, coercive equality with
+// ==.
+// assert.equal(actual, expected, message_opt);
+assert.equal = equal;
+function equal(actual, expected, message) {
+  if (actual != expected) fail(actual, expected, message, '==', equal);
 }
 
-function isNumber(arg) {
-  return typeof arg === 'number';
+// 6. The non-equality assertion tests for whether two objects are not equal
+// with != assert.notEqual(actual, expected, message_opt);
+assert.notEqual = notEqual;
+function notEqual(actual, expected, message) {
+  if (actual == expected) {
+    fail(actual, expected, message, '!=', notEqual);
+  }
 }
 
-function isString(arg) {
-  return typeof arg === 'string';
+// 7. The equivalence assertion tests a deep equality relation.
+// assert.deepEqual(actual, expected, message_opt);
+assert.deepEqual = deepEqual;
+function deepEqual(actual, expected, message) {
+  if (!_deepEqual(actual, expected, false)) {
+    fail(actual, expected, message, 'deepEqual', deepEqual);
+  }
 }
-
-function isUndefined(arg) {
-  return arg === undefined;
+assert.deepStrictEqual = deepStrictEqual;
+function deepStrictEqual(actual, expected, message) {
+  if (!_deepEqual(actual, expected, true)) {
+    fail(actual, expected, message, 'deepStrictEqual', deepStrictEqual);
+  }
 }
 
-function isRegExp(re) {
-  return isObject(re) && objectToString(re) === '[object RegExp]';
-}
+function _deepEqual(actual, expected, strict, memos) {
+  // 7.1. All identical values are equivalent, as determined by ===.
+  if (actual === expected) {
+    return true;
+  } else if (isBuffer(actual) && isBuffer(expected)) {
+    return compare(actual, expected) === 0;
 
-function isObject(arg) {
-  return typeof arg === 'object' && arg !== null;
-}
+  // 7.2. If the expected value is a Date object, the actual value is
+  // equivalent if it is also a Date object that refers to the same time.
+  } else if (isDate(actual) && isDate(expected)) {
+    return actual.getTime() === expected.getTime();
 
-function isDate(d) {
-  return isObject(d) && objectToString(d) === '[object Date]';
-}
+  // 7.3 If the expected value is a RegExp object, the actual value is
+  // equivalent if it is also a RegExp object with the same source and
+  // properties (`global`, `multiline`, `lastIndex`, `ignoreCase`).
+  } else if (isRegExp(actual) && isRegExp(expected)) {
+    return actual.source === expected.source &&
+           actual.global === expected.global &&
+           actual.multiline === expected.multiline &&
+           actual.lastIndex === expected.lastIndex &&
+           actual.ignoreCase === expected.ignoreCase;
 
-function isError(e) {
-  return isObject(e) &&
-      (objectToString(e) === '[object Error]' || e instanceof Error);
-}
+  // 7.4. Other pairs that do not both pass typeof value == 'object',
+  // equivalence is determined by ==.
+  } else if ((actual === null || typeof actual !== 'object') &&
+             (expected === null || typeof expected !== 'object')) {
+    return strict ? actual === expected : actual == expected;
 
-function isFunction(arg) {
-  return typeof arg === 'function';
-}
+  // If both values are instances of typed arrays, wrap their underlying
+  // ArrayBuffers in a Buffer each to increase performance
+  // This optimization requires the arrays to have the same type as checked by
+  // Object.prototype.toString (aka pToString). Never perform binary
+  // comparisons for Float*Arrays, though, since e.g. +0 === -0 but their
+  // bit patterns are not identical.
+  } else if (isView(actual) && isView(expected) &&
+             pToString(actual) === pToString(expected) &&
+             !(actual instanceof Float32Array ||
+               actual instanceof Float64Array)) {
+    return compare(new Uint8Array(actual.buffer),
+                   new Uint8Array(expected.buffer)) === 0;
 
-function isPrimitive(arg) {
-  return arg === null ||
-         typeof arg === 'boolean' ||
-         typeof arg === 'number' ||
-         typeof arg === 'string' ||
-         typeof arg === 'symbol' ||  // ES6 symbol
-         typeof arg === 'undefined';
-}
+  // 7.5 For all other Object pairs, including Array objects, equivalence is
+  // determined by having the same number of owned properties (as verified
+  // with Object.prototype.hasOwnProperty.call), the same set of keys
+  // (although not necessarily the same order), equivalent values for every
+  // corresponding key, and an identical 'prototype' property. Note: this
+  // accounts for both named and indexed properties on Arrays.
+  } else if (isBuffer(actual) !== isBuffer(expected)) {
+    return false;
+  } else {
+    memos = memos || {actual: [], expected: []};
 
-function objectToString(o) {
-  return Object.prototype.toString.call(o);
-}
+    var actualIndex = memos.actual.indexOf(actual);
+    if (actualIndex !== -1) {
+      if (actualIndex === memos.expected.indexOf(expected)) {
+        return true;
+      }
+    }
 
-function _extend(origin, add) {
-  // Don't do anything if add isn't an object
-  if (!add || !isObject(add)) return origin;
+    memos.actual.push(actual);
+    memos.expected.push(expected);
 
-  var keys = Object.keys(add);
-  var i = keys.length;
-  while (i--) {
-    origin[keys[i]] = add[keys[i]];
+    return objEquiv(actual, expected, strict, memos);
   }
-  return origin;
 }
-function hasOwnProperty(obj, prop) {
-  return Object.prototype.hasOwnProperty.call(obj, prop);
+
+function isArguments(object) {
+  return Object.prototype.toString.call(object) == '[object Arguments]';
 }
 
-function compare(a, b) {
-  if (a === b) {
-    return 0;
+function objEquiv(a, b, strict, actualVisitedObjects) {
+  if (a === null || a === undefined || b === null || b === undefined)
+    return false;
+  // if one is a primitive, the other must be same
+  if (isPrimitive(a) || isPrimitive(b))
+    return a === b;
+  if (strict && Object.getPrototypeOf(a) !== Object.getPrototypeOf(b))
+    return false;
+  var aIsArgs = isArguments(a);
+  var bIsArgs = isArguments(b);
+  if ((aIsArgs && !bIsArgs) || (!aIsArgs && bIsArgs))
+    return false;
+  if (aIsArgs) {
+    a = pSlice.call(a);
+    b = pSlice.call(b);
+    return _deepEqual(a, b, strict);
   }
-
-  var x = a.length;
-  var y = b.length;
-
-  for (var i = 0, len = Math.min(x, y); i < len; ++i) {
-    if (a[i] !== b[i]) {
-      x = a[i];
-      y = b[i];
-      break;
-    }
+  var ka = objectKeys(a);
+  var kb = objectKeys(b);
+  var key, i;
+  // having the same number of owned properties (keys incorporates
+  // hasOwnProperty)
+  if (ka.length !== kb.length)
+    return false;
+  //the same set of keys (although not necessarily the same order),
+  ka.sort();
+  kb.sort();
+  //~~~cheap key test
+  for (i = ka.length - 1; i >= 0; i--) {
+    if (ka[i] !== kb[i])
+      return false;
   }
-
-  if (x < y) {
-    return -1;
+  //equivalent values for every corresponding key, and
+  //~~~possibly expensive deep test
+  for (i = ka.length - 1; i >= 0; i--) {
+    key = ka[i];
+    if (!_deepEqual(a[key], b[key], strict, actualVisitedObjects))
+      return false;
   }
-  if (y < x) {
-    return 1;
+  return true;
+}
+
+// 8. The non-equivalence assertion tests for any deep inequality.
+// assert.notDeepEqual(actual, expected, message_opt);
+assert.notDeepEqual = notDeepEqual;
+function notDeepEqual(actual, expected, message) {
+  if (_deepEqual(actual, expected, false)) {
+    fail(actual, expected, message, 'notDeepEqual', notDeepEqual);
   }
-  return 0;
 }
-var hasOwn = Object.prototype.hasOwnProperty;
 
-var objectKeys = Object.keys || function (obj) {
-  var keys = [];
-  for (var key in obj) {
-    if (hasOwn.call(obj, key)) keys.push(key);
+assert.notDeepStrictEqual = notDeepStrictEqual;
+function notDeepStrictEqual(actual, expected, message) {
+  if (_deepEqual(actual, expected, true)) {
+    fail(actual, expected, message, 'notDeepStrictEqual', notDeepStrictEqual);
   }
-  return keys;
-};
-var pSlice = Array.prototype.slice;
-var _functionsHaveNames;
-function functionsHaveNames() {
-  if (typeof _functionsHaveNames !== 'undefined') {
-    return _functionsHaveNames;
+}
+
+
+// 9. The strict equality assertion tests strict equality, as determined by ===.
+// assert.strictEqual(actual, expected, message_opt);
+assert.strictEqual = strictEqual;
+function strictEqual(actual, expected, message) {
+  if (actual !== expected) {
+    fail(actual, expected, message, '===', strictEqual);
   }
-  return _functionsHaveNames = (function () {
-    return function foo() {}.name === 'foo';
-  }());
 }
-function pToString (obj) {
-  return Object.prototype.toString.call(obj);
+
+// 10. The strict non-equality assertion tests for strict inequality, as
+// determined by !==.  assert.notStrictEqual(actual, expected, message_opt);
+assert.notStrictEqual = notStrictEqual;
+function notStrictEqual(actual, expected, message) {
+  if (actual === expected) {
+    fail(actual, expected, message, '!==', notStrictEqual);
+  }
 }
-function isView(arrbuf) {
-  if (isBuffer(arrbuf)) {
+
+function expectedException(actual, expected) {
+  if (!actual || !expected) {
     return false;
   }
-  if (typeof global$1.ArrayBuffer !== 'function') {
-    return false;
+
+  if (Object.prototype.toString.call(expected) == '[object RegExp]') {
+    return expected.test(actual);
   }
-  if (typeof ArrayBuffer.isView === 'function') {
-    return ArrayBuffer.isView(arrbuf);
+
+  try {
+    if (actual instanceof expected) {
+      return true;
+    }
+  } catch (e) {
+    // Ignore.  The instanceof check doesn't work for arrow functions.
   }
-  if (!arrbuf) {
+
+  if (Error.isPrototypeOf(expected)) {
     return false;
   }
-  if (arrbuf instanceof DataView) {
-    return true;
-  }
-  if (arrbuf.buffer && arrbuf.buffer instanceof ArrayBuffer) {
-    return true;
-  }
-  return false;
+
+  return expected.call({}, actual) === true;
 }
-// 1. The assert module provides functions that throw
-// AssertionError's when particular conditions are not met. The
-// assert module must conform to the following interface.
 
-function assert(value, message) {
-  if (!value) fail(value, true, message, '==', ok);
+function _tryBlock(block) {
+  var error;
+  try {
+    block();
+  } catch (e) {
+    error = e;
+  }
+  return error;
 }
 
-// 2. The AssertionError is defined in assert.
-// new assert.AssertionError({ message: message,
-//                             actual: actual,
-//                             expected: expected })
+function _throws(shouldThrow, block, expected, message) {
+  var actual;
 
-var regex = /\s*function\s+([^\(\s]*)\s*/;
-// based on https://github.com/ljharb/function.prototype.name/blob/adeeeec8bfcc6068b187d7d9fb3d5bb1d3a30899/implementation.js
-function getName(func) {
-  if (!isFunction(func)) {
-    return;
+  if (typeof block !== 'function') {
+    throw new TypeError('"block" argument must be a function');
   }
-  if (functionsHaveNames()) {
-    return func.name;
+
+  if (typeof expected === 'string') {
+    message = expected;
+    expected = null;
   }
-  var str = func.toString();
-  var match = str.match(regex);
-  return match && match[1];
-}
-assert.AssertionError = AssertionError;
-function AssertionError(options) {
-  this.name = 'AssertionError';
-  this.actual = options.actual;
-  this.expected = options.expected;
-  this.operator = options.operator;
-  if (options.message) {
-    this.message = options.message;
-    this.generatedMessage = false;
-  } else {
-    this.message = getMessage(this);
-    this.generatedMessage = true;
-  }
-  var stackStartFunction = options.stackStartFunction || fail;
-  if (Error.captureStackTrace) {
-    Error.captureStackTrace(this, stackStartFunction);
-  } else {
-    // non v8 browsers so we can have a stacktrace
-    var err = new Error();
-    if (err.stack) {
-      var out = err.stack;
-
-      // try to strip useless frames
-      var fn_name = getName(stackStartFunction);
-      var idx = out.indexOf('\n' + fn_name);
-      if (idx >= 0) {
-        // once we have located the function frame
-        // we need to strip out everything before it (and its line)
-        var next_line = out.indexOf('\n', idx + 1);
-        out = out.substring(next_line + 1);
-      }
 
-      this.stack = out;
-    }
-  }
-}
+  actual = _tryBlock(block);
 
-// assert.AssertionError instanceof Error
-inherits(AssertionError, Error);
+  message = (expected && expected.name ? ' (' + expected.name + ').' : '.') +
+            (message ? ' ' + message : '.');
 
-function truncate(s, n) {
-  if (typeof s === 'string') {
-    return s.length < n ? s : s.slice(0, n);
-  } else {
-    return s;
-  }
-}
-function inspect(something) {
-  if (functionsHaveNames() || !isFunction(something)) {
-    return inspect$1(something);
+  if (shouldThrow && !actual) {
+    fail(actual, expected, 'Missing expected exception' + message);
   }
-  var rawname = getName(something);
-  var name = rawname ? ': ' + rawname : '';
-  return '[Function' +  name + ']';
-}
-function getMessage(self) {
-  return truncate(inspect(self.actual), 128) + ' ' +
-         self.operator + ' ' +
-         truncate(inspect(self.expected), 128);
-}
-
-// At present only the three keys mentioned above are used and
-// understood by the spec. Implementations or sub modules can pass
-// other keys to the AssertionError's constructor - they will be
-// ignored.
-
-// 3. All of the following functions must throw an AssertionError
-// when a corresponding condition is not met, with a message that
-// may be undefined if not provided.  All assertion methods provide
-// both the actual and expected values to the assertion error for
-// display purposes.
-
-function fail(actual, expected, message, operator, stackStartFunction) {
-  throw new AssertionError({
-    message: message,
-    actual: actual,
-    expected: expected,
-    operator: operator,
-    stackStartFunction: stackStartFunction
-  });
-}
-
-// EXTENSION! allows for well behaved errors defined elsewhere.
-assert.fail = fail;
-
-// 4. Pure assertion tests whether a value is truthy, as determined
-// by !!guard.
-// assert.ok(guard, message_opt);
-// This statement is equivalent to assert.equal(true, !!guard,
-// message_opt);. To test strictly for the value true, use
-// assert.strictEqual(true, guard, message_opt);.
-
-function ok(value, message) {
-  if (!value) fail(value, true, message, '==', ok);
-}
-assert.ok = ok;
 
-// 5. The equality assertion tests shallow, coercive equality with
-// ==.
-// assert.equal(actual, expected, message_opt);
-assert.equal = equal;
-function equal(actual, expected, message) {
-  if (actual != expected) fail(actual, expected, message, '==', equal);
-}
+  var userProvidedMessage = typeof message === 'string';
+  var isUnwantedException = !shouldThrow && isError(actual);
+  var isUnexpectedException = !shouldThrow && actual && !expected;
 
-// 6. The non-equality assertion tests for whether two objects are not equal
-// with != assert.notEqual(actual, expected, message_opt);
-assert.notEqual = notEqual;
-function notEqual(actual, expected, message) {
-  if (actual == expected) {
-    fail(actual, expected, message, '!=', notEqual);
+  if ((isUnwantedException &&
+      userProvidedMessage &&
+      expectedException(actual, expected)) ||
+      isUnexpectedException) {
+    fail(actual, expected, 'Got unwanted exception' + message);
   }
-}
 
-// 7. The equivalence assertion tests a deep equality relation.
-// assert.deepEqual(actual, expected, message_opt);
-assert.deepEqual = deepEqual;
-function deepEqual(actual, expected, message) {
-  if (!_deepEqual(actual, expected, false)) {
-    fail(actual, expected, message, 'deepEqual', deepEqual);
-  }
-}
-assert.deepStrictEqual = deepStrictEqual;
-function deepStrictEqual(actual, expected, message) {
-  if (!_deepEqual(actual, expected, true)) {
-    fail(actual, expected, message, 'deepStrictEqual', deepStrictEqual);
+  if ((shouldThrow && actual && expected &&
+      !expectedException(actual, expected)) || (!shouldThrow && actual)) {
+    throw actual;
   }
 }
 
-function _deepEqual(actual, expected, strict, memos) {
-  // 7.1. All identical values are equivalent, as determined by ===.
-  if (actual === expected) {
-    return true;
-  } else if (isBuffer(actual) && isBuffer(expected)) {
-    return compare(actual, expected) === 0;
-
-  // 7.2. If the expected value is a Date object, the actual value is
-  // equivalent if it is also a Date object that refers to the same time.
-  } else if (isDate(actual) && isDate(expected)) {
-    return actual.getTime() === expected.getTime();
-
-  // 7.3 If the expected value is a RegExp object, the actual value is
-  // equivalent if it is also a RegExp object with the same source and
-  // properties (`global`, `multiline`, `lastIndex`, `ignoreCase`).
-  } else if (isRegExp(actual) && isRegExp(expected)) {
-    return actual.source === expected.source &&
-           actual.global === expected.global &&
-           actual.multiline === expected.multiline &&
-           actual.lastIndex === expected.lastIndex &&
-           actual.ignoreCase === expected.ignoreCase;
-
-  // 7.4. Other pairs that do not both pass typeof value == 'object',
-  // equivalence is determined by ==.
-  } else if ((actual === null || typeof actual !== 'object') &&
-             (expected === null || typeof expected !== 'object')) {
-    return strict ? actual === expected : actual == expected;
-
-  // If both values are instances of typed arrays, wrap their underlying
-  // ArrayBuffers in a Buffer each to increase performance
-  // This optimization requires the arrays to have the same type as checked by
-  // Object.prototype.toString (aka pToString). Never perform binary
-  // comparisons for Float*Arrays, though, since e.g. +0 === -0 but their
-  // bit patterns are not identical.
-  } else if (isView(actual) && isView(expected) &&
-             pToString(actual) === pToString(expected) &&
-             !(actual instanceof Float32Array ||
-               actual instanceof Float64Array)) {
-    return compare(new Uint8Array(actual.buffer),
-                   new Uint8Array(expected.buffer)) === 0;
-
-  // 7.5 For all other Object pairs, including Array objects, equivalence is
-  // determined by having the same number of owned properties (as verified
-  // with Object.prototype.hasOwnProperty.call), the same set of keys
-  // (although not necessarily the same order), equivalent values for every
-  // corresponding key, and an identical 'prototype' property. Note: this
-  // accounts for both named and indexed properties on Arrays.
-  } else if (isBuffer(actual) !== isBuffer(expected)) {
-    return false;
-  } else {
-    memos = memos || {actual: [], expected: []};
-
-    var actualIndex = memos.actual.indexOf(actual);
-    if (actualIndex !== -1) {
-      if (actualIndex === memos.expected.indexOf(expected)) {
-        return true;
-      }
-    }
-
-    memos.actual.push(actual);
-    memos.expected.push(expected);
-
-    return objEquiv(actual, expected, strict, memos);
-  }
+// 11. Expected to throw an error:
+// assert.throws(block, Error_opt, message_opt);
+assert.throws = throws;
+function throws(block, /*optional*/error, /*optional*/message) {
+  _throws(true, block, error, message);
 }
 
-function isArguments(object) {
-  return Object.prototype.toString.call(object) == '[object Arguments]';
+// EXTENSION! This is annoying to write outside this module.
+assert.doesNotThrow = doesNotThrow;
+function doesNotThrow(block, /*optional*/error, /*optional*/message) {
+  _throws(false, block, error, message);
 }
 
-function objEquiv(a, b, strict, actualVisitedObjects) {
-  if (a === null || a === undefined || b === null || b === undefined)
-    return false;
-  // if one is a primitive, the other must be same
-  if (isPrimitive(a) || isPrimitive(b))
-    return a === b;
-  if (strict && Object.getPrototypeOf(a) !== Object.getPrototypeOf(b))
-    return false;
-  var aIsArgs = isArguments(a);
-  var bIsArgs = isArguments(b);
-  if ((aIsArgs && !bIsArgs) || (!aIsArgs && bIsArgs))
-    return false;
-  if (aIsArgs) {
-    a = pSlice.call(a);
-    b = pSlice.call(b);
-    return _deepEqual(a, b, strict);
-  }
-  var ka = objectKeys(a);
-  var kb = objectKeys(b);
-  var key, i;
-  // having the same number of owned properties (keys incorporates
-  // hasOwnProperty)
-  if (ka.length !== kb.length)
-    return false;
-  //the same set of keys (although not necessarily the same order),
-  ka.sort();
-  kb.sort();
-  //~~~cheap key test
-  for (i = ka.length - 1; i >= 0; i--) {
-    if (ka[i] !== kb[i])
-      return false;
-  }
-  //equivalent values for every corresponding key, and
-  //~~~possibly expensive deep test
-  for (i = ka.length - 1; i >= 0; i--) {
-    key = ka[i];
-    if (!_deepEqual(a[key], b[key], strict, actualVisitedObjects))
-      return false;
-  }
-  return true;
+assert.ifError = ifError;
+function ifError(err) {
+  if (err) throw err;
 }
 
-// 8. The non-equivalence assertion tests for any deep inequality.
-// assert.notDeepEqual(actual, expected, message_opt);
-assert.notDeepEqual = notDeepEqual;
-function notDeepEqual(actual, expected, message) {
-  if (_deepEqual(actual, expected, false)) {
-    fail(actual, expected, message, 'notDeepEqual', notDeepEqual);
-  }
-}
-
-assert.notDeepStrictEqual = notDeepStrictEqual;
-function notDeepStrictEqual(actual, expected, message) {
-  if (_deepEqual(actual, expected, true)) {
-    fail(actual, expected, message, 'notDeepStrictEqual', notDeepStrictEqual);
-  }
-}
-
-
-// 9. The strict equality assertion tests strict equality, as determined by ===.
-// assert.strictEqual(actual, expected, message_opt);
-assert.strictEqual = strictEqual;
-function strictEqual(actual, expected, message) {
-  if (actual !== expected) {
-    fail(actual, expected, message, '===', strictEqual);
-  }
+const VERSION$6 = '0.0.1';
+// const T = 'plugins.audio_selector';
+const AUTO = 0;
+/**
+ * Adds an audio track selector to the media control UI.
+ * @beta
+ */
+class AudioSelector extends UICorePlugin {
+    // TODO
+    selectedTrackId;
+    currentTrack = null;
+    tracks = [];
+    /**
+     * @internal
+     */
+    get name() {
+        return 'audio_selector';
+    }
+    /**
+     * @internal
+     */
+    get supportedVersion() {
+        return { min: CLAPPR_VERSION };
+    }
+    /**
+     * @internal
+     */
+    static get version() {
+        return VERSION$6;
+    }
+    static template = tmpl(pluginHtml$8);
+    /**
+     * @internal
+     */
+    get attributes() {
+        return {
+            class: this.name,
+            'data-track-selector': '',
+        };
+    }
+    /**
+     * @internal
+     */
+    get events() {
+        return {
+            'click [data-track-selector-select]': 'onTrackSelect',
+            'click [data-track-selector-button]': 'onShowLevelSelectMenu',
+        };
+    }
+    /**
+     * @internal
+     */
+    bindEvents() {
+        this.listenTo(this.core, Events$1.CORE_READY, this.bindPlaybackEvents);
+        // TODO CORE_ACTIVE_CONTAINER_CHANGED
+        this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED, this.reload);
+        this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED, this.render);
+        this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_HIDE, this.hideSelectTrackMenu);
+    }
+    unBindEvents() {
+        // @ts-ignore
+        this.stopListening(this.core, Events$1.CORE_READY);
+        // @ts-ignore
+        this.stopListening(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED);
+        // @ts-ignore
+        this.stopListening(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED);
+        // @ts-ignore
+        this.stopListening(this.core.mediaControl, Events$1.MEDIACONTROL_HIDE);
+    }
+    bindPlaybackEvents() {
+        // this.currentTrack = {};
+        // this.removeAuto = false;
+        this.selectedTrackId = undefined;
+        const currentPlayback = this.core.activePlayback;
+        this.listenTo(currentPlayback, Events$1.PLAYBACK_STOP, this.onStop);
+        this.setupAudioTrackListeners();
+    }
+    setupAudioTrackListeners() {
+        const currentPlayback = this.core.activePlayback;
+        // TODO no-crutch:currentPlayback._hls
+        if (currentPlayback._hls) {
+            // TODO AUDIO_TRACKS_UPDATED
+            // currentPlayback._hls.on('hlsAudioTracksUpdated', (e, data) => {
+            currentPlayback._hls.on(Events.AUDIO_TRACKS_UPDATED, (e, data) => {
+                // let id = -1;
+                // for (const audioTrack of data.audioTracks) {
+                //   if (audioTrack.default) {
+                //     id = audioTrack.id;
+                //     this.currentTrack = audioTrack;
+                //   }
+                // }
+                const defaultTrack = data.audioTracks.find((track) => track.default);
+                if (defaultTrack) {
+                    this.currentTrack = {
+                        id: defaultTrack.id,
+                        label: defaultTrack.name,
+                    };
+                }
+                this.fillTracks(data.audioTracks.map((p) => ({
+                    id: p.id,
+                    label: p.name,
+                })), defaultTrack?.id);
+            });
+            currentPlayback._hls.on(Events.AUDIO_TRACK_SWITCHING, this.startTrackSwitch.bind(this));
+            currentPlayback._hls.on(Events.AUDIO_TRACK_SWITCHED, this.updateCurrentTrack.bind(this));
+            currentPlayback._hls.on(Events.AUDIO_TRACK_LOADED, this.updateCurrentTrack.bind(this));
+        }
+        else {
+            this.listenToOnce(currentPlayback, Events$1.PLAYBACK_PLAY, () => {
+                const mediaElement = currentPlayback.$el.get(0);
+                // const { audioTracks } = currentPlayback.$el.get(0);
+                const audioTracks = mediaElement.audioTracks;
+                if (audioTracks && audioTracks.length) {
+                    let index = 0;
+                    const trackItems = [];
+                    for (const audioTrack of audioTracks) {
+                        if (audioTrack.enabled) {
+                            const t = {
+                                id: index,
+                                label: audioTrack.label,
+                            };
+                            this.currentTrack = t;
+                            trackItems.push(t);
+                            index++;
+                        }
+                    }
+                    audioTracks.addEventListener('change', () => this.updateCurrentTrackW3C());
+                    this.fillTracks(trackItems, trackItems[0].id);
+                }
+            });
+        }
+    }
+    onStop() { }
+    reload() {
+        this.unBindEvents();
+        this.bindEvents();
+        this.bindPlaybackEvents();
+    }
+    shouldRender() {
+        if (!this.core.activeContainer) {
+            return false;
+        }
+        const currentPlayback = this.core.activePlayback;
+        if (!currentPlayback) {
+            return false;
+        }
+        const { audioTracks } = currentPlayback.activePlayback._hls || currentPlayback.$el.get(0);
+        this.tracks = audioTracks;
+        // Only care if we have at least 2 to choose from
+        return this.tracks && this.tracks.length > 1;
+    }
+    /**
+     * @internal
+     */
+    render() {
+        if (!this.shouldRender()) {
+            return this;
+        }
+        const mediaControl = this.core.getPlugin('media_control');
+        assert(mediaControl, 'media_control plugin is required');
+        this.$el.html(AudioSelector.template({ tracks: this.tracks, title: this.getTitle() }));
+        const ats = mediaControl.getElement('audioTracksSelector');
+        if (!(ats && ats.length > 0)) {
+            return this;
+        }
+        ats.append(this.el);
+        this.highlightCurrentTrack();
+        const aa = ats.find('audioArrow');
+        if (aa.length > 0) {
+            aa.append(audioArrow);
+        }
+        return this;
+    }
+    fillTracks(tracks, selected = AUTO) {
+        if (this.selectedTrackId === undefined) {
+            this.selectedTrackId = selected;
+        }
+        // this.tracks = levels.audioTracks;
+        // for (let i = 0; i < this.tracks.length; i++) {
+        //   if (this.tracks[i].name && !this.tracks[i].label) {
+        //     this.tracks[i].label = this.tracks[i].name;
+        //   }
+        // }
+        this.tracks = tracks;
+        // Player.player.trigger('tracks', this.tracks);
+        // this.core.trigger('tracks', this.tracks);
+        this.render();
+    }
+    findTrackBy(id) {
+        return this.tracks.find((track) => track.id === id);
+    }
+    onTrackSelect(event) {
+        // this.selectedTrackId = parseInt(event.target.dataset.levelSelectorSelect, 10)
+        const id = event.target?.dataset?.trackSelectorSelect;
+        if (id) {
+            this.setIndexTrack(Number(id));
+        }
+        this.toggleContextMenu();
+        event.stopPropagation();
+        return false;
+    }
+    setIndexTrack(index) {
+        this.selectedTrackId = index;
+        if (this.core.activePlayback._hls) {
+            if (this.core.activePlayback._hls.audioTrack.id === this.selectedTrackId) {
+                return;
+            }
+            this.core.activePlayback._hls.audioTrack = this.selectedTrackId;
+        }
+        else {
+            const { audioTracks } = this.core.activePlayback.$el.get(0);
+            for (const track of audioTracks) {
+                track.enabled = track.id === this.selectedTrackId;
+            }
+        }
+        this.updateText(this.selectedTrackId);
+    }
+    onShowLevelSelectMenu() {
+        this.toggleContextMenu();
+    }
+    hideSelectTrackMenu() {
+        this.$('.audio_selector ul').hide();
+    }
+    toggleContextMenu() {
+        this.$('.audio_selector ul').toggle();
+    }
+    buttonElement() {
+        return this.$('.audio_selector button');
+    }
+    buttonElementText() {
+        return this.$('.audio_selector button .audio-text');
+    }
+    trackElement(id) {
+        return this.$('.audio_selector ul a' +
+            (id !== undefined ? '[data-track-selector-select="' + id + '"]' : '')).parent();
+    }
+    getTitle() {
+        if (!this.tracks) {
+            return '';
+        }
+        const selectedTrackId = this.selectedTrackId || 0;
+        const selectedTrack = this.tracks[selectedTrackId];
+        return selectedTrack?.label || '';
+    }
+    startTrackSwitch() {
+        this.buttonElement().addClass('changing');
+    }
+    updateText(trackId) {
+        if (trackId === undefined) {
+            return;
+        }
+        const track = this.findTrackBy(trackId);
+        if (track) {
+            this.buttonElementText().text(track.label);
+        }
+    }
+    updateCurrentTrack(e, info) {
+        // if (!info) {
+        //   const { audioTracks } = this.core.activePlayback.$el.get(0);
+        //   for (const track of audioTracks) {
+        //     if (track.enabled) {
+        //       info = track;
+        //     }
+        //   }
+        // }
+        // if (!info) {
+        //   return;
+        // }
+        // const track = this.findTrackBy(info.id);
+        // this.currentTrack = track ? track : null;
+        // this.selectedTrackId = track?.id;
+        // this.highlightCurrentTrack();
+        // this.buttonElement().removeClass('changing');
+        this.setCurrentTrack(info.id);
+    }
+    updateCurrentTrackW3C() {
+        const { audioTracks } = this.core.activePlayback.$el.get(0);
+        const index = audioTracks.findIndex((track) => track.enabled);
+        if (index >= 0) {
+            this.setCurrentTrack(index);
+        }
+    }
+    setCurrentTrack(index) {
+        const track = this.findTrackBy(index);
+        this.currentTrack = track ?? null;
+        this.selectedTrackId = index;
+        this.highlightCurrentTrack();
+        this.buttonElement().removeClass('changing');
+    }
+    highlightCurrentTrack() {
+        this.trackElement().removeClass('current');
+        this.trackElement().find('a').removeClass('gcore-skin-active');
+        if (this.currentTrack) {
+            const currentTrackElement = this.trackElement(this.currentTrack.id);
+            currentTrackElement.addClass('current');
+            currentTrackElement.find('a').addClass('gcore-skin-active');
+        }
+        this.updateText(this.selectedTrackId);
+    }
 }
 
-// 10. The strict non-equality assertion tests for strict inequality, as
-// determined by !==.  assert.notStrictEqual(actual, expected, message_opt);
-assert.notStrictEqual = notStrictEqual;
-function notStrictEqual(actual, expected, message) {
-  if (actual === expected) {
-    fail(actual, expected, message, '!==', notStrictEqual);
-  }
+/**
+ * @public
+ * @param msg
+ * @param data
+ */
+function trace(msg, data = {}) {
 }
 
-function expectedException(actual, expected) {
-  if (!actual || !expected) {
-    return false;
-  }
+const volumeOffIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n  <path\n    d=\"M5.50025 8.00025C4.67125 8.00025 4.00025 8.67225 4.00025 9.50025V14.5003C4.00025 15.3283 4.67125 16.0003 5.50025 16.0003H7.24824C7.65024 16.0003 8.03627 16.1613 8.31727 16.4483L12.5443 20.7413C12.7083 20.9073 12.9262 20.9963 13.1492 20.9963C13.2572 20.9963 13.3672 20.9763 13.4722 20.9333C13.7932 20.8013 14.0003 20.4923 14.0003 20.1462V16.3283C14.0003 16.1963 13.9473 16.0683 13.8543 15.9753L6.02528 8.14625C5.93228 8.05325 5.80425 8.00025 5.67225 8.00025H5.50025ZM14.0003 3.85426C14.0003 3.50826 13.7932 3.19927 13.4722 3.06727C13.1502 2.93627 12.7873 3.01226 12.5443 3.25926L9.33827 6.51527C9.14627 6.71127 9.14626 7.02625 9.34126 7.22025L13.5733 11.4522C13.7313 11.6102 14.0003 11.4982 14.0003 11.2752V3.85426ZM20.8543 20.8543C20.7563 20.9513 20.6283 21.0003 20.5003 21.0003C20.3723 21.0003 20.2442 20.9513 20.1462 20.8543L3.14625 3.85426C2.95125 3.65826 2.95125 3.34225 3.14625 3.14625C3.34225 2.95125 3.65826 2.95125 3.85426 3.14625L20.8543 20.1462C21.0493 20.3422 21.0493 20.6583 20.8543 20.8543Z\"\n    fill=\"#C9C9C9\"/>\n</svg>\n";
 
-  if (Object.prototype.toString.call(expected) == '[object RegExp]') {
-    return expected.test(actual);
-  }
+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";
 
-  try {
-    if (actual instanceof expected) {
-      return true;
+const T$9 = 'plugins.big_mute_button';
+// TODO rewrite as a container plugin
+/**
+ * Displays a big mute button over the video when it's muted.
+ * Once pressed, it unmutes the video.
+ * @beta
+ */
+class BigMuteButton extends UICorePlugin {
+    isBigMuteButtonHidden = false;
+    _adIsPlaying = false;
+    $bigMuteBtnContainer = null;
+    $bigMuteButton = null;
+    /**
+     * @internal
+     */
+    get name() {
+        return 'big_mute_button';
+    }
+    /**
+     * @internal
+     */
+    get supportedVersion() {
+        return { min: CLAPPR_VERSION };
+    }
+    static template = tmpl(pluginHtml$7);
+    /**
+     * @internal
+     */
+    get events() {
+        return {
+            'click .big-mute-icon': 'handleBigMuteBtnClick',
+            'click .big-mute-icon-wrapper': 'destroyBigMuteBtn',
+        };
+    }
+    /**
+     * @internal
+     */
+    bindEvents() {
+        super.bindEvents();
+        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$9} bindEvents`, {
+            mediacontrol: !!this.core.mediaControl,
+        });
+        this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED, this.mediaControlRendered);
+    }
+    onCoreReady() {
+        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_VOLUME, this.onContainerVolume);
+        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_READY, this.onContainerStart);
+        this.listenTo(this.core.activePlayback, Events$1.PLAYBACK_ENDED, this.onPlaybackEnded);
+    }
+    onContainerVolume(value) {
+        if (value !== 0) {
+            this.destroyBigMuteBtn();
+        }
+    }
+    onContainerStart() {
+        if (this.isBigMuteButtonHidden) {
+            this.showBigMuteBtn();
+        }
+    }
+    onPlaybackEnded() {
+        this.hideBigMuteBtn();
+    }
+    mediaControlRendered() {
+        const container = this.core.activeContainer;
+        if (container) {
+            this.listenTo(container.playback, Events$1.PLAYBACK_PLAY, () => {
+                this.render();
+            });
+        }
+    }
+    onStartAd() {
+        this._adIsPlaying = true;
+        if (this.$bigMuteBtnContainer) {
+            this.$bigMuteBtnContainer.addClass('hide');
+        }
+    }
+    onFinishAd() {
+        this._adIsPlaying = false;
+        if (this.$bigMuteBtnContainer) {
+            this.$bigMuteBtnContainer.removeClass('hide');
+        }
+    }
+    shouldRender() {
+        const container = this.core.activeContainer;
+        if (!container) {
+            return false;
+        }
+        const { autoPlay, wasMuted } = this.options;
+        const volume = container.volume;
+        return autoPlay && !wasMuted && volume === 0;
+    }
+    /**
+     * @internal
+     */
+    render() {
+        if (this.shouldRender()) {
+            trace(`${T$9} render`, {
+                el: !!this.$el,
+            });
+            this.$el.html(BigMuteButton.template());
+            this.$bigMuteBtnContainer = this.$el.find('.big-mute-icon-wrapper[data-big-mute]');
+            this._adIsPlaying && this.$bigMuteBtnContainer.addClass('hide');
+            this.$bigMuteButton = this.$bigMuteBtnContainer.find('.big-mute-icon');
+            this.$bigMuteButton.append(volumeOffIcon);
+            const container = this.core.activeContainer;
+            container.$el.append(this.$el.get(0));
+        }
+        return this;
+    }
+    hideBigMuteBtn() {
+        this.isBigMuteButtonHidden = true;
+        this.$bigMuteBtnContainer?.addClass('hide');
+    }
+    showBigMuteBtn() {
+        this.isBigMuteButtonHidden = false;
+        if (this.$bigMuteBtnContainer) {
+            this.$bigMuteBtnContainer.removeClass('hide');
+        }
+    }
+    destroyBigMuteBtn(e) {
+        this.hideBigMuteBtn();
+        if (e && e.stopPropagation) {
+            e.stopPropagation();
+        }
+        this.destroy();
+    }
+    handleBigMuteBtnClick(e) {
+        const localVolume = Utils.Config.restore('volume');
+        const volume = !isNaN(localVolume) ? localVolume : 100;
+        // TODO use container.setVolume() instead
+        this.core.mediaControl.setVolume(volume === 0 ? 100 : volume);
+        this.destroyBigMuteBtn(e);
     }
-  } catch (e) {
-    // Ignore.  The instanceof check doesn't work for arrow functions.
-  }
-
-  if (Error.isPrototypeOf(expected)) {
-    return false;
-  }
-
-  return expected.call({}, actual) === true;
-}
-
-function _tryBlock(block) {
-  var error;
-  try {
-    block();
-  } catch (e) {
-    error = e;
-  }
-  return error;
-}
-
-function _throws(shouldThrow, block, expected, message) {
-  var actual;
-
-  if (typeof block !== 'function') {
-    throw new TypeError('"block" argument must be a function');
-  }
-
-  if (typeof expected === 'string') {
-    message = expected;
-    expected = null;
-  }
-
-  actual = _tryBlock(block);
-
-  message = (expected && expected.name ? ' (' + expected.name + ').' : '.') +
-            (message ? ' ' + message : '.');
-
-  if (shouldThrow && !actual) {
-    fail(actual, expected, 'Missing expected exception' + message);
-  }
-
-  var userProvidedMessage = typeof message === 'string';
-  var isUnwantedException = !shouldThrow && isError(actual);
-  var isUnexpectedException = !shouldThrow && actual && !expected;
-
-  if ((isUnwantedException &&
-      userProvidedMessage &&
-      expectedException(actual, expected)) ||
-      isUnexpectedException) {
-    fail(actual, expected, 'Got unwanted exception' + message);
-  }
-
-  if ((shouldThrow && actual && expected &&
-      !expectedException(actual, expected)) || (!shouldThrow && actual)) {
-    throw actual;
-  }
-}
-
-// 11. Expected to throw an error:
-// assert.throws(block, Error_opt, message_opt);
-assert.throws = throws;
-function throws(block, /*optional*/error, /*optional*/message) {
-  _throws(true, block, error, message);
-}
-
-// EXTENSION! This is annoying to write outside this module.
-assert.doesNotThrow = doesNotThrow;
-function doesNotThrow(block, /*optional*/error, /*optional*/message) {
-  _throws(false, block, error, message);
-}
-
-assert.ifError = ifError;
-function ifError(err) {
-  if (err) throw err;
 }
 
 const pluginHtml$6 = "<div class=\"media-control-gear\" data-<%= name %>>\n    <button type=\"button\" class=\"button-gear gplayer-lite-btn gcore-skin-button-color\" data-gear-button=\"-1\">\n        <span class=\"gear-icon\"><%= icon %></span>\n    </button>\n    <div class=\"gear-wrapper gcore-skin-bg-color\">\n        <ul class=\"gear-options-list\">\n            <% items.forEach(function (gear) { %>\n                <li data-<%= gear %>></li>\n            <% }); %>\n        </ul>\n    </div>\n</div>\n";
@@ -32764,6 +32796,7 @@ const gearHdIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\
 const VERSION$5 = '2.19.12';
 /**
  * Custom events emitted by the plugin
+ * @beta
  */
 var GearEvents;
 (function (GearEvents) {
@@ -33963,6 +33996,9 @@ function requireMousetrap () {
 var mousetrapExports = requireMousetrap();
 const Mousetrap = /*@__PURE__*/getDefaultExportFromCjs(mousetrapExports);
 
+/**
+ * @beta
+ */
 var ClapprStatsEvents;
 (function (ClapprStatsEvents) {
     ClapprStatsEvents["REPORT_EVENT"] = "clappr:stats:report";
@@ -34962,7 +34998,7 @@ const qualityClasses = [
     'speedtest-quality-value-2',
     'speedtest-quality-value-3',
     'speedtest-quality-value-4',
-    'speedtest-quality-value-5'
+    'speedtest-quality-value-5',
 ];
 const getDownloadQuality = (speedValue) => {
     if (speedValue < 3) {
@@ -35026,7 +35062,22 @@ const drawSummary = (customMetrics, vodContainer, liveContainer) => {
 };
 // const T = 'plugins.clappr_nerd_stats';
 /**
+ * Displays useful network-related statistics.
  * @beta
+ *
+ * @remarks
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ *
+ * - {@link BottomGear}
+ *
+ * - {@link ClapprStats}
+ *
+ * The plugin is rendered as an item in the gear menu.
+ *
+ * When clicked, it shows an overlay window with the information about the network speed, latency, etc,
+ * and recommended quality level.
  */
 class ClapprNerdStats extends UICorePlugin {
     container = null;
@@ -35039,21 +35090,31 @@ class ClapprNerdStats extends UICorePlugin {
     showing = false;
     shortcut;
     iconPosition;
+    /**
+     * @internal
+     */
     get name() {
         return 'nerd_stats';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
-    get template() {
-        return tmpl(pluginHtml$5);
-    }
+    static template = tmpl(pluginHtml$5);
+    /**
+     * @internal
+     */
     get attributes() {
         return {
             'data-clappr-nerd-stats': '',
-            'class': 'clappr-nerd-stats'
+            class: 'clappr-nerd-stats',
         };
     }
+    /**
+     * @internal
+     */
     get events() {
         return {
             'click [data-show-stats-button]': 'showOrHide',
@@ -35075,8 +35136,12 @@ class ClapprNerdStats extends UICorePlugin {
     }
     constructor(core) {
         super(core);
-        this.shortcut = core.options.clapprNerdStats?.shortcut ?? ['command+shift+s', 'ctrl+shift+s'];
-        this.iconPosition = core.options.clapprNerdStats?.iconPosition ?? 'bottom-right';
+        this.shortcut = core.options.clapprNerdStats?.shortcut ?? [
+            'command+shift+s',
+            'ctrl+shift+s',
+        ];
+        this.iconPosition =
+            core.options.clapprNerdStats?.iconPosition ?? 'bottom-right';
         this.customMetrics = {
             connectionSpeed: 0,
             ping: 0,
@@ -35084,6 +35149,9 @@ class ClapprNerdStats extends UICorePlugin {
         };
         configureSpeedTest(core.options.clapprNerdStats?.speedTestServers ?? []);
     }
+    /**
+     * @internal
+     */
     bindEvents() {
         const mediaControl = this.core.getPlugin('media_control');
         assert(mediaControl, 'media_control plugin is required');
@@ -35120,9 +35188,11 @@ class ClapprNerdStats extends UICorePlugin {
         this.core.$el.find(this.statsBoxElem).show();
         this.showing = true;
         this.refreshSpeedTest();
-        initSpeedTest(this.customMetrics).then(() => {
+        initSpeedTest(this.customMetrics)
+            .then(() => {
             startSpeedtest();
-        }).catch(e => {
+        })
+            .catch((e) => {
             this.disable();
         });
     }
@@ -35136,13 +35206,19 @@ class ClapprNerdStats extends UICorePlugin {
     }
     addGeneralMetrics() {
         this.metrics.general = {
-            displayResolution: (this.playerWidth + 'x' + this.playerHeight),
-            volume: this.container?.volume
+            displayResolution: this.playerWidth + 'x' + this.playerHeight,
+            volume: this.container?.volume,
         };
     }
     addCustomMetrics() {
         this.metrics.custom = this.customMetrics;
-        const videoQualityNames = ['SD (480p)', 'HD (720p)', 'Full HD (1080p)', '2K (1440p)', '4K (2160p)'];
+        const videoQualityNames = [
+            'SD (480p)',
+            'HD (720p)',
+            'Full HD (1080p)',
+            '2K (1440p)',
+            '4K (2160p)',
+        ];
         const { connectionSpeed, ping } = this.customMetrics;
         if (!connectionSpeed || !ping) {
             const calculatingText = 'Calculating... Please wait.';
@@ -35154,17 +35230,19 @@ class ClapprNerdStats extends UICorePlugin {
         const pingQuality = getPingQuality(ping);
         const liveQuality = Math.min(downloadQuality, pingQuality);
         const prefix = 'Optimal for ';
-        this.metrics.custom.vodQuality = prefix + videoQualityNames[downloadQuality - 1];
-        this.metrics.custom.liveQuality = prefix + videoQualityNames[liveQuality - 1];
+        this.metrics.custom.vodQuality =
+            prefix + videoQualityNames[downloadQuality - 1];
+        this.metrics.custom.liveQuality =
+            prefix + videoQualityNames[liveQuality - 1];
     }
     updateMetrics(metrics) {
         Object.assign(this.metrics, metrics);
         this.addGeneralMetrics();
         this.addCustomMetrics();
         const scrollTop = this.core.$el.find(this.statsBoxElem).scrollTop();
-        this.$el.html(this.template({
+        this.$el.html(ClapprNerdStats.template({
             metrics: Formatter.format(this.metrics),
-            iconPosition: this.iconPosition
+            iconPosition: this.iconPosition,
         }));
         this.setStatsBoxSize();
         drawSpeedTestResults();
@@ -35184,7 +35262,11 @@ class ClapprNerdStats extends UICorePlugin {
             this.$el.find(this.statsBoxElem).addClass('narrow');
         }
     }
+    /**
+     * @internal
+     */
     render() {
+        // TODO append to the container
         this.core.$el.append(this.$el[0]);
         this.hide();
         return this;
@@ -35236,7 +35318,10 @@ function newMetrics() {
 // TODO: fix
 const updateMetrics = () => { };
 /**
+ * Collects useful statistics about playback performance.
  * @beta
+ * @remarks
+ * This plugin does not render anything and is supposed to be extended or used together with other plugins that actually render something.
  */
 class ClapprStats extends ContainerPlugin {
     bwMeasureCount = 0;
@@ -35258,9 +35343,15 @@ class ClapprStats extends ContainerPlugin {
     updateFn = updateMetrics;
     urisToMeasureBandwidth;
     uriToMeasureLatency;
+    /**
+     * @internal
+     */
     get name() {
         return 'clappr_stats';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
@@ -35288,6 +35379,10 @@ class ClapprStats extends ContainerPlugin {
         // this._metrics.timers[timer] += this._now() - this[`_start${timer}`];
         this.metrics.timers[timer] += this._now() - this.timers[timer];
     }
+    /**
+     * Registers a callback to receive the metrics.
+     * @param updateMetricsFn
+     */
     setUpdateMetrics(updateMetricsFn) {
         this.updateFn = updateMetricsFn;
     }
@@ -35306,6 +35401,9 @@ class ClapprStats extends ContainerPlugin {
             calls: []
         };
     }
+    /**
+     * @internal
+     */
     bindEvents() {
         this.listenTo(this.container, Events$1.CONTAINER_BITRATE, this.onBitrate);
         this.listenTo(this.container, Events$1.CONTAINER_STOP, this.stopReporting);
@@ -35324,10 +35422,17 @@ class ClapprStats extends ContainerPlugin {
         this.listenTo(this.container.playback, Events$1.PLAYBACK_PROGRESS, this.onProgress);
         this.listenTo(this.container.playback, Events$1.PLAYBACK_TIMEUPDATE, this.onTimeUpdate);
     }
+    /**
+     * @internal
+     */
     destroy() {
         this.stopReporting();
         super.destroy();
     }
+    /**
+     * Returns the collected metrics.
+     * @returns The collected metrics
+     */
     exportMetrics() {
         return structuredClone(this.metrics);
     }
@@ -35349,6 +35454,7 @@ class ClapprStats extends ContainerPlugin {
             this.intervalId = null;
         }
         this._newMetrics();
+        // TODO
         // @ts-ignore
         this.stopListening();
         this.bindEvents();
@@ -35566,19 +35672,29 @@ 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 in the LICENSE file.
+// license that can be found at https://github.com/clappr/clappr-plugins/blob/master/LICENSE.
+/**
+ * Adds a behavior of toggling the playback state on click over the container
+ * @beta
+ */
 class ClickToPause extends ContainerPlugin {
     pointerEnabled = false;
     timer = null;
+    /**
+     * @internal
+     */
     get name() {
         return 'click_to_pause_custom';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
-    get config() {
-        return this.container.options.clickToPauseConfig || {};
-    }
+    /**
+     * @internal
+     */
     bindEvents() {
         this.listenTo(this.container, Events$1.CONTAINER_CLICK, this.click);
         this.listenTo(this.container, Events$1.CONTAINER_SETTINGSUPDATE, this.settingsUpdate);
@@ -35685,23 +35801,45 @@ function getPageX(event) {
     return 0;
 }
 
+/**
+ * Adds a behavior of showing a text over the seekbar to indicate the current clip.
+ * @beta
+ * @remarks
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ *
+ * Configuration options - {@link ClipsPluginSettings}
+ */
 class ClipsPlugin extends UICorePlugin {
     clips = new Map();
     duration = 0;
     durationGetting = false;
     _oldContainer;
     svgMask = null;
+    /**
+     * @internal
+     */
     get name() {
-        return 'media_control_clips';
+        return 'clips';
     }
+    /**
+     * @internal
+     */
     get attributes() {
         return {
-            'class': this.name
+            class: this.name,
         };
     }
+    /**
+     * @internal
+     */
     bindEvents() {
+        const mediaControl = this.core.getPlugin('media_control');
+        assert(mediaControl, 'media_control plugin is required');
         this.listenToOnce(this.core, Events$1.CORE_READY, this._onCoreReady);
-        this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED, this._onMediaControlContainerChanged);
+        // TODO listen to CORE_ACTIVE_CONTAINER_CHANGED
+        this.listenTo(mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED, this._onMediaControlContainerChanged);
         this.listenTo(this.core, Events$1.CORE_RESIZE, this.playerResize);
     }
     _onCoreReady() {
@@ -35711,12 +35849,6 @@ class ClipsPlugin extends UICorePlugin {
         }
         this.parseClips();
     }
-    unbindEvents() {
-        // @ts-ignore
-        this.stopListening(this.core, Events$1.CORE_READY);
-        // @ts-ignore
-        this.stopListening(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED);
-    }
     _onMediaControlContainerChanged() {
         this._bindContainerEvents();
     }
@@ -35730,9 +35862,10 @@ class ClipsPlugin extends UICorePlugin {
         if (this._oldContainer) {
             this.stopListening(this._oldContainer, Events$1.CONTAINER_TIMEUPDATE, this.onTimeUpdate);
         }
-        this._oldContainer = this.core.mediaControl.container;
+        const mediaControl = this.core.getPlugin('media_control');
+        this._oldContainer = mediaControl.container;
         this.durationGetting = false;
-        this.listenTo(this.core.mediaControl.container, Events$1.CONTAINER_TIMEUPDATE, this.onTimeUpdate);
+        this.listenTo(mediaControl.container, Events$1.CONTAINER_TIMEUPDATE, this.onTimeUpdate);
     }
     onTimeUpdate(event) {
         if (!this.durationGetting) {
@@ -35749,13 +35882,17 @@ class ClipsPlugin extends UICorePlugin {
     }
     parseClips() {
         const textArr = this.options.clips.text.split('\n');
-        const clipsArr = textArr.map((val) => {
+        const clipsArr = textArr
+            .map((val) => {
             const matchRes = val.match(/(\d+:\d+|:\d+) (.+)/i);
-            return matchRes ? {
-                start: strtimeToMiliseconds(matchRes[1]),
-                text: matchRes[2],
-            } : null;
-        }).filter((clip) => clip !== null);
+            return matchRes
+                ? {
+                    start: strtimeToMiliseconds(matchRes[1]),
+                    text: matchRes[2],
+                }
+                : null;
+        })
+            .filter((clip) => clip !== null);
         clipsArr.sort((a, b) => a.start - b.start);
         clipsArr.forEach((clip, index) => {
             this.clips.set(clip.start, {
@@ -35766,6 +35903,11 @@ class ClipsPlugin extends UICorePlugin {
             });
         });
     }
+    /**
+     * Returns the text of the current clip.
+     * @param time - The current time of the player.
+     * @returns The text of the current clip.
+     */
     getText(time) {
         for (const [key, value] of this.clips.entries()) {
             if (time >= value.start && time < value.end) {
@@ -35776,14 +35918,14 @@ class ClipsPlugin extends UICorePlugin {
     }
     makeSvg(duration) {
         let svg = '<svg width="0" height="0">\n' + '<defs>\n' + '<clipPath id="myClip">\n';
-        const widthOfSeek = this.core.mediaControl.container.$el.width();
+        const widthOfSeek = this.core.activeContainer.$el.width();
         let finishValue = 0;
-        this.clips.forEach(val => {
+        this.clips.forEach((val) => {
             let end = val.end;
             if (!end) {
                 end = val.end = duration;
             }
-            const widthChunk = (end - val.start) * widthOfSeek / duration;
+            const widthChunk = ((end - val.start) * widthOfSeek) / duration;
             svg += `<rect x="${finishValue}" y="0" width="${widthChunk - 2}" height="30"/>\n`;
             finishValue += widthChunk;
         });
@@ -35796,7 +35938,8 @@ class ClipsPlugin extends UICorePlugin {
         if (this.svgMask) {
             this.svgMask.remove();
         }
-        const $seekBarContainer = this.core.mediaControl.getElement('seekBarContainer');
+        const mediaControl = this.core.getPlugin('media_control');
+        const $seekBarContainer = mediaControl.getElement('seekBarContainer');
         if ($seekBarContainer?.get(0)) {
             $seekBarContainer.addClass('clips');
         }
@@ -35804,7 +35947,8 @@ class ClipsPlugin extends UICorePlugin {
         $seekBarContainer?.append(this.svgMask);
     }
     setClipText(text) {
-        const $clipText = this.core.mediaControl.getElement('clipText');
+        const mediaControl = this.core.getPlugin('media_control');
+        const $clipText = mediaControl.getElement('clipText');
         if ($clipText && text) {
             $clipText.show();
             $clipText.text(`${text}`);
@@ -35814,28 +35958,61 @@ class ClipsPlugin extends UICorePlugin {
 
 const templateHtml$1 = "<ul class=\"context-menu-list\">\n    <% if(options) { %>\n        <% for (var i = 0; i < options.length; i++) { %>\n        <li class=\"context-menu-list-item <%= options[i].class %>\"\n            data-<%= options[i].name %>><%= options[i].label %></li>\n        <% } %>\n    <% } %>\n</ul>\n";
 
-class ContextMenu extends UICorePlugin {
+var version$1 = "2.20.3";
+
+var packages = {
+	"node_modules/@clappr/core": {
+		version: "0.11.4"},
+	"node_modules/dashjs": {
+		version: "4.7.4"},
+	"node_modules/hls.js": {
+		version: "1.5.20"}};
+
+/**
+ * Version information about the gplayer and its main dependencies
+ * @returns Version information about the gplayer and its main dependencies
+ * @beta
+ */
+function version() {
+    return {
+        gplayer: version$1,
+        clappr: packages['node_modules/@clappr/core'].version,
+        dashjs: packages['node_modules/dashjs'].version,
+        hlsjs: packages['node_modules/hls.js'].version,
+    };
+}
+
+/**
+ * Displays a small context menu when clicked on the player container.
+ * @beta
+ * @remarks
+ * Configuration options - {@link ContextMenuPluginSettings}
+ */
+class ContextMenu extends UIContainerPlugin {
     _label = '';
     _url = '';
-    container = null;
     menuOptions = [];
+    /**
+     * @internal
+     */
     get name() {
         return 'context_menu';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
+    /**
+     * @internal
+     */
     get attributes() {
-        return { 'class': 'context-menu' };
-    }
-    get mediaControl() {
-        return this.core.mediaControl;
-    }
-    get template() {
-        return tmpl(templateHtml$1);
+        return { class: 'context-menu' };
     }
+    static template = tmpl(templateHtml$1);
     get label() {
-        return this._label || 'Gcore player ver. ' + process.env.VERSION;
+        return this._label || 'Gcore player ver. ' + version().gplayer;
     }
     get url() {
         return this._url || 'https://gcore.com/';
@@ -35843,16 +36020,19 @@ class ContextMenu extends UICorePlugin {
     get exposeVersion() {
         return {
             label: this.label,
-            name: 'version'
+            name: 'version',
         };
     }
+    /**
+     * @internal
+     */
     get events() {
         return {
-            'click [data-version]': 'onOpenMainPage'
+            'click [data-version]': 'onOpenMainPage',
         };
     }
-    constructor(core) {
-        super(core);
+    constructor(container) {
+        super(container);
         if (this.options.contextMenu && this.options.contextMenu.label) {
             this._label = this.options.contextMenu.label;
         }
@@ -35862,28 +36042,21 @@ class ContextMenu extends UICorePlugin {
         this.render();
         this.bindEvents();
     }
+    /**
+     * @internal
+     */
     bindEvents() {
-        if (this.mediaControl) {
-            this.listenTo(this.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED, this.containerChanged);
-            if (this.container) {
-                this.listenTo(this.container, Events$1.CONTAINER_CONTEXTMENU, this.toggleContextMenu);
-                this.listenTo(this.container, Events$1.CONTAINER_CLICK, this.hide);
-            }
-        }
-        $('body').on('click', this.hide.bind(this));
+        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
+     */
     destroy() {
-        $('body').off('click', this.hide.bind(this));
-        // @ts-ignore
-        this.stopListening();
+        $('body').off('click', this.hideOnBodyClick);
         return super.destroy();
     }
-    containerChanged() {
-        this.container = this.core.activeContainer;
-        // @ts-ignore
-        this.stopListening();
-        this.bindEvents();
-    }
     toggleContextMenu(event) {
         event.preventDefault();
         const offset = this.container?.$el.offset();
@@ -35891,7 +36064,8 @@ class ContextMenu extends UICorePlugin {
     }
     show(top, left) {
         this.hide();
-        if (this.options.contextMenu && this.options.contextMenu.preventShowContextMenu) {
+        if (this.options.contextMenu &&
+            this.options.contextMenu.preventShowContextMenu) {
             return;
         }
         this.$el.css({ top, left });
@@ -35903,80 +36077,19 @@ class ContextMenu extends UICorePlugin {
     onOpenMainPage() {
         window.open(this.url, '_blank');
     }
+    /**
+     * @internal
+     */
     render() {
         this.menuOptions = [this.exposeVersion];
-        this.$el.html(this.template({ options: this.menuOptions }));
-        this.core.$el.append(this.$el);
+        this.$el.html(ContextMenu.template({ options: this.menuOptions }));
+        this.container.$el.append(this.$el); // TODO append to the container, turn into a container plugin
         this.hide();
-        this.disable();
         return this;
     }
-}
-
-class DisableControls extends UICorePlugin {
-    get name() {
-        return 'disable_controls';
-    }
-    get container() {
-        return this.core && this.core.activeContainer;
-    }
-    get supportedVersion() {
-        return { min: CLAPPR_VERSION };
-    }
-    bindEvents() {
-        if (this.container) {
-            this.listenTo(this.container, Events$1.CONTAINER_MEDIACONTROL_ENABLE, this.enableControls);
-            this.listenTo(this.container, Events$1.CONTAINER_PLAY, this.enableControls);
-            this.listenTo(this.container, Events$1.CONTAINER_PAUSE, this.enableControls);
-            this.listenTo(this.container, Events$1.CONTAINER_STOP, this.enableControls);
-            this.listenTo(this.container, Events$1.CONTAINER_ENDED, this.enableControls);
-            this.listenTo(this.container, 'container:advertisement:start', this.enableControls);
-        }
-        this.listenTo(this.core, Events$1.CORE_READY, this.onCoreReady);
-        this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_SHOW, this.enableControls);
-        this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED, this.enableControls);
-    }
-    unbindEvents() {
-        // @ts-ignore
-        this.stopListening(this.core, Events$1.CORE_READY);
-        // @ts-ignore
-        this.stopListening(this.core.mediaControl, Events$1.MEDIACONTROL_SHOW);
-        // @ts-ignore
-        this.stopListening(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED);
-        // @ts-ignore
-        this.stopListening(this.container, Events$1.CONTAINER_MEDIACONTROL_ENABLE);
-        // @ts-ignore
-        this.stopListening(this.container, Events$1.CONTAINER_PLAY);
-        // @ts-ignore
-        this.stopListening(this.container, Events$1.CONTAINER_PAUSE);
-        // @ts-ignore
-        this.stopListening(this.container, Events$1.CONTAINER_STOP);
-        // @ts-ignore
-        this.stopListening(this.container, Events$1.CONTAINER_ENDED);
-        // @ts-ignore
-        this.stopListening(this.container, 'container:advertisement:start');
-    }
-    setDisableStyles() {
-        const css = document.createElement('style');
-        const styles = '.control-need-disable { display: none!important; }';
-        css.appendChild(document.createTextNode(styles));
-        this.core.$el.get(0).appendChild(css);
-    }
-    onCoreReady() {
-        this.setDisableStyles();
-        this.bindEvents();
-        this.enableControls();
-    }
-    enableControls() {
-        this.disableAllControls();
-    }
-    disableAllControls() {
-        setTimeout(() => {
-            const spinnerPlugin = this.container.getPlugin('spinner');
-            spinnerPlugin?.destroy();
-            this.container.disableMediaControl();
-        }, 0);
-    }
+    hideOnBodyClick = () => {
+        this.hide();
+    };
 }
 
 const dvrHTML = "<div class=\"live-info\"><%= live %></div>\n<button type=\"button\" class=\"live-button\" aria-label=\"<%= backToLive %>\"><%= backToLive %></button>\n";
@@ -35986,8 +36099,11 @@ const dvrHTML = "<div class=\"live-info\"><%= live %></div>\n<button type=\"butt
  * @beta
  *
  * @remarks
- * The plugin is rendered in the {@link MediaControl | media control} UI.
- * It renders the live stream indicator and the DVR seek bar if DVR is enabled.
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ *
+ * The plugin renders the live stream indicator and the DVR seek bar, if DVR is enabled, in the media control UI.
  */
 class DvrControls extends UICorePlugin {
     static template = tmpl(dvrHTML);
@@ -35995,7 +36111,7 @@ class DvrControls extends UICorePlugin {
      * @internal
      */
     get name() {
-        return 'media_control_dvr';
+        return 'dvr_controls';
     }
     /**
      * @internal
@@ -36028,32 +36144,15 @@ class DvrControls extends UICorePlugin {
      * @internal
      */
     bindEvents() {
-        this.bindCoreEvents();
-        this.bindContainerEvents();
-        if (this.core.activeContainer) {
-            this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAYBACKDVRSTATECHANGED, this.dvrChanged);
-        }
-    }
-    bindCoreEvents() {
-        if (this.core.mediaControl.settings) {
-            this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED, this.containerChanged);
-            this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED, this.settingsUpdate);
-            this.listenTo(this.core, Events$1.CORE_OPTIONS_CHANGE, this.render);
-        }
-        else {
-            setTimeout(() => this.bindCoreEvents(), 100);
-        }
+        const mediaControl = this.core.getPlugin('media_control');
+        assert(mediaControl, 'media_control plugin is required');
+        this.listenTo(mediaControl, Events$1.MEDIACONTROL_RENDERED, this.settingsUpdate);
+        this.listenTo(this.core, Events$1.CORE_OPTIONS_CHANGE, this.render);
+        this.listenTo(this.core, Events$1.CORE_ACTIVE_CONTAINER_CHANGED, this.bindContainerEvents);
     }
     bindContainerEvents() {
-        if (this.core.activeContainer) {
-            this.listenToOnce(this.core.activeContainer, Events$1.CONTAINER_TIMEUPDATE, this.render);
-            this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAYBACKDVRSTATECHANGED, this.dvrChanged);
-        }
-    }
-    containerChanged() {
-        // @ts-ignore
-        this.stopListening();
-        this.bindEvents();
+        this.listenToOnce(this.core.activeContainer, Events$1.CONTAINER_TIMEUPDATE, this.render);
+        this.listenTo(this.core.activeContainer, Events$1.CONTAINER_PLAYBACKDVRSTATECHANGED, this.dvrChanged);
     }
     dvrChanged(dvrEnabled) {
         if (this.core.getPlaybackType() !== Playback.LIVE) {
@@ -36086,7 +36185,7 @@ class DvrControls extends UICorePlugin {
     settingsUpdate() {
         // @ts-ignore
         this.stopListening(); // TODO sort out
-        this.core.mediaControl.$el.removeClass('live');
+        this.core.getPlugin('media_control').$el.removeClass('live'); // TODO don't access directly
         if (this.shouldRender()) {
             this.render();
             this.$el.click(() => this.click());
@@ -36106,7 +36205,7 @@ class DvrControls extends UICorePlugin {
             backToLive: this.core.i18n.t('back_to_live')
         }));
         if (this.shouldRender()) {
-            const mediaControl = this.core.mediaControl;
+            const mediaControl = this.core.getPlugin('media_control');
             assert(mediaControl, 'media_control plugin is required');
             // TODO don't tap into the $el directly
             mediaControl.$el.addClass('live');
@@ -36122,6 +36221,10 @@ const templateHtml = "<div class=\"player-error-screen__content\" data-error-scr
 
 const TIME_FOR_UPDATE = 10000;
 const MAX_RETRY = 10;
+/**
+ * Displays a descriptive error in the overlay on top of the player.
+ * @beta
+ */
 class ErrorScreen extends UICorePlugin {
     _retry = 0;
     err = null;
@@ -36299,6 +36402,10 @@ const stopIcon = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\
 const FAVICON_COLOR = '#567';
 const FAVICON_SELECTOR = 'link[rel="shortcut icon"]';
 // const oldIcon = $(FAVICON_SELECTOR);
+/**
+ * The plugin adds custom favicon to the player's tab.
+ * @beta
+ */
 class Favicon extends CorePlugin {
     _container = null;
     oldIcon;
@@ -36400,7 +36507,11 @@ class Favicon extends CorePlugin {
 
 // 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.
+// license that can be found at https://github.com/clappr/clappr-plugins/blob/master/LICENSE
+/**
+ * An example Google Analytics integration plugin
+ * @beta
+ */
 class GoogleAnalytics extends ContainerPlugin {
     account = '';
     trackerName = '';
@@ -36711,7 +36822,7 @@ function keyName(keyCode) {
 
 const buttonHtml$2 = "<button class='gplayer-lite-btn gcore-skin-text-color gear-option'>\n    <% if (isHd) { %>\n        <span class=\"gear-option_hd-icon\"><%= hdIcon %></span>\n    <% } %>\n    <span>Quality</span>\n    <span class=\"gear-option_arrow-right-icon\"><%= arrowRightIcon %></span>\n    <span class='gear-option_value'><%= currentText %></span>\n</button>\n";
 
-const listHtml$1 = "<button class=\"gplayer-lite-btn go-back gcore-skin-text-color\">\n    <span class=\"arrow-left-icon\"><%= arrowLeftIcon %></span>\n    Quality\n</button>\n<ul class=\"gear-sub-menu\">\n    <% if (!removeAuto) { %>\n        <li>\n            <a href=\"#\" class='gear-sub-menu_btn gcore-skin-text-color' data-id=\"-1\" id=\"level_selector_auto\">\n                <span class=\"check-icon\"><%= checkIcon %></span>\n            Auto\n        </a>\n    </li>\n    <% } %>\n    <% for (const level of levels.slice().reverse()) { %>\n        <li <% if (maxLevel >= 0 && level.level > maxLevel) { %>class=\"level-disabled\"<% } %>>\n            <a href=\"#\" class='gear-sub-menu_btn gcore-skin-text-color' data-id=\"<%= level.level %>\" id=\"level_selector_<%= level.level %>\">\n                <span class=\"check-icon\"><%= checkIcon %></span>\n                <%= labels[level.level] %>\n            </a>\n        </li>\n    <% } %>\n</ul>\n";
+const listHtml$1 = "<button class=\"gplayer-lite-btn go-back gcore-skin-text-color\">\n    <span class=\"arrow-left-icon\"><%= arrowLeftIcon %></span>\n    Quality\n</button>\n<ul class=\"gear-sub-menu\">\n    <% if (!removeAuto) { %>\n        <li>\n            <a href=\"#\" class='gear-sub-menu_btn gcore-skin-text-color' data-id=\"-1\" id=\"level_selector_auto\">\n                <span class=\"check-icon\"><%= checkIcon %></span>\n            Auto\n        </a>\n    </li>\n    <% } %>\n    <% for (const level of levels.slice().reverse()) { %>\n        <li <% if (maxLevel >= 0 && level.level > maxLevel) { %>class=\"level-disabled\"<% } %>>\n            <a href=\"#\" class='gear-sub-menu_btn gcore-skin-text-color' data-id=\"<%= level.level %>\" id=\"level_selector_<%= level.height %>\">\n                <span class=\"check-icon\"><%= checkIcon %></span>\n                <%= labels[level.level] %>\n            </a>\n        </li>\n    <% } %>\n</ul>\n";
 
 const hdIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n  <path\n    d=\"M14.9562 8.22232H13.9961V15.1873H14.9562C15.8914 15.1873 16.766 14.8253 17.4195 14.1676C18.0786 13.5037 18.4415 12.6281 18.4415 11.7026C18.4415 9.7837 16.8781 8.22253 14.9561 8.22253L14.9562 8.22232Z\"\n    fill=\"#C9C9C9\"/>\n  <path\n    d=\"M22.0801 4H1.91994C0.859222 4 0 4.86406 0 5.91994V17.4878C0 18.5437 0.859222 19.4078 1.91994 19.4078H22.0801C23.1408 19.4078 24 18.5437 24 17.4878V5.91994C24 4.86406 23.1408 4 22.0801 4ZM10.3975 15.3473C10.3975 15.6124 10.1827 15.8272 9.91754 15.8272C9.65216 15.8272 9.43761 15.6122 9.43761 15.3473V12.0239H5.55956V15.3473C5.55956 15.6124 5.34481 15.8272 5.07963 15.8272C4.81425 15.8272 4.5997 15.6122 4.5997 15.3473L4.59949 7.74042C4.59949 7.47524 4.81425 7.26049 5.07943 7.26049C5.34481 7.26049 5.55936 7.47544 5.55936 7.74042V11.0636H9.43741V7.74042C9.43741 7.47524 9.65216 7.26049 9.91734 7.26049C10.1827 7.26049 10.3973 7.47544 10.3973 7.74042L10.3975 15.3473ZM18.1005 14.8438C17.2652 15.6844 16.1486 16.1472 14.9561 16.1472H13.5161C13.2507 16.1472 13.0361 15.9323 13.0361 15.6673V7.74263C13.0361 7.47745 13.2509 7.26269 13.5161 7.26269H14.9561C17.4072 7.26269 19.4013 9.25438 19.4013 11.7027C19.4013 12.8835 18.9392 13.9991 18.1005 14.844V14.8438Z\"\n    fill=\"#C9C9C9\"/>\n</svg>\n";
 
@@ -36721,7 +36832,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$7 = 'plugins.level_selector';
+const T$8 = '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.
@@ -36825,7 +36936,7 @@ class LevelSelector extends UICorePlugin {
     onStop() {
         const currentPlayback = this.core.activePlayback;
         this.listenToOnce(currentPlayback, Events$1.PLAYBACK_PLAY, () => {
-            trace(`${T$7} on PLAYBACK_PLAY after stop`, { selectedLevelId: this.selectedLevelId });
+            trace(`${T$8} on PLAYBACK_PLAY after stop`, { selectedLevelId: this.selectedLevelId });
             if (currentPlayback.getPlaybackType() === 'live') {
                 if (this.selectedLevelId !== -1) {
                     currentPlayback.currentLevel = this.selectedLevelId;
@@ -36980,7 +37091,7 @@ class LevelSelector extends UICorePlugin {
         this.highlightCurrentLevel();
     }
     highlightCurrentLevel() {
-        trace(`${T$7} highlightCurrentLevel`, {
+        trace(`${T$8} highlightCurrentLevel`, {
             selectedLevelId: this.selectedLevelId,
         });
         this.allLevelElements().removeClass('current');
@@ -37044,6 +37155,10 @@ function calculateSize(original) {
 
 const logoHTML = "<div class=\"clappr-logo control-need-disable\">\n    <img class=\"clappr-logo-img\"/>\n</div>\n";
 
+/**
+ * The plugin adds custom logo to the player.
+ * @beta
+ */
 class Logo extends UIContainerPlugin {
     hasStartedPlaying = false;
     $logoContainer = null;
@@ -37321,7 +37436,7 @@ class MediaControl extends UICorePlugin {
         return { min: CLAPPR_VERSION };
     }
     get disabled() {
-        const playbackIsNOOP = this.container && this.container.getPlaybackType() === Playback.NO_OP;
+        const playbackIsNOOP = this.core.activeContainer && this.core.activeContainer.getPlaybackType() === Playback.NO_OP;
         return this.userDisabled || playbackIsNOOP;
     }
     /**
@@ -38001,6 +38116,8 @@ class MediaControl extends UICorePlugin {
      */
     getElement(name) {
         switch (name) {
+            case 'audioTracksSelector':
+                return this.$audioTracksSelector;
             case 'clipText':
                 return this.$clipText;
             case 'bottomGear':
@@ -38305,7 +38422,10 @@ const streamsMomentoIcon = "<svg id=\"Слой_1\" data-name=\"Слой 1\" xmln
 const streamsWhiteNightsIcon = "<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"50\" height=\"50\" viewBox=\"0 0 50 50\">\n  <defs>\n    <clipPath id=\"clip-Icon\">\n      <rect width=\"50\" height=\"50\"/>\n    </clipPath>\n  </defs>\n  <g id=\"Icon\" clip-path=\"url(#clip-Icon)\">\n    <g id=\"icon2\" transform=\"translate(-0.041 0)\">\n      <path id=\"Контур_77\" data-name=\"Контур 77\" d=\"M6.493,13v8.266h6.275V19.74H8.31V17.714h4.006V16.3H8.31V14.53h4.365V13Zm7.5,0v8.266h1.7V15.732h.023l3.438,5.534h1.818V13h-1.7v5.545h-.023L15.8,13Z\" fill=\"#fff\"/>\n      <path id=\"Контур_76\" data-name=\"Контур 76\" d=\"M29.949,29.1V26.774H31.94a1.4,1.4,0,0,1,.938.272,1.1,1.1,0,0,1,.313.874,1.155,1.155,0,0,1-.313.9,1.375,1.375,0,0,1-.938.278ZM28.132,25.36v8.266h1.817V30.4h1.818a1.353,1.353,0,0,1,.984.3,1.637,1.637,0,0,1,.394.949c.046.333.079.681.1,1.042a3.2,3.2,0,0,0,.185.938h1.819a1.218,1.218,0,0,1-.191-.423,3.611,3.611,0,0,1-.093-.527c-.019-.185-.033-.367-.041-.544s-.016-.332-.023-.463a5.052,5.052,0,0,0-.087-.625,2.109,2.109,0,0,0-.2-.573,1.586,1.586,0,0,0-.359-.451,1.414,1.414,0,0,0-.556-.284v-.023a1.926,1.926,0,0,0,1-.81,2.494,2.494,0,0,0,.307-1.262,2.308,2.308,0,0,0-.165-.88,2.128,2.128,0,0,0-.486-.724,2.3,2.3,0,0,0-.764-.492,2.67,2.67,0,0,0-1-.179ZM43.506,30.5V25.36H41.689V30.5a2.065,2.065,0,0,1-.37,1.36,1.7,1.7,0,0,1-1.343.434,2.086,2.086,0,0,1-.886-.156,1.283,1.283,0,0,1-.758-.978,3.748,3.748,0,0,1-.058-.66V25.36H36.456V30.5a3.16,3.16,0,0,0,.92,2.5,3.807,3.807,0,0,0,2.6.81,3.82,3.82,0,0,0,2.593-.816,3.132,3.132,0,0,0,.937-2.492Z\" fill=\"#fff\"/>\n      <path id=\"Контур_80\" data-name=\"Контур 80\" d=\"M22.646,31.2H4.689a4.505,4.505,0,0,1-4.5-4.5V8.5A4.505,4.505,0,0,1,4.689,4h18.2a4.505,4.505,0,0,1,4.5,4.5v8.445l-.893.1a3.184,3.184,0,0,0-2.846,3.177V30.5l-.465.7ZM4.689,6a2.5,2.5,0,0,0-2.5,2.5V26.7a2.5,2.5,0,0,0,2.5,2.5H21.65V20.22a5.18,5.18,0,0,1,3.739-4.992V8.5a2.5,2.5,0,0,0-2.5-2.5Z\" fill=\"#fff\"/>\n      <path id=\"Контур_81\" data-name=\"Контур 81\" d=\"M30.127,47.884a1,1,0,0,1-1-1V43.267H26.846a5.206,5.206,0,0,1-5.2-5.2V20.222a5.206,5.206,0,0,1,5.2-5.2H44.692a5.206,5.206,0,0,1,5.2,5.2V38.068a5.206,5.206,0,0,1-5.2,5.2H35.058l-4.216,4.316A1,1,0,0,1,30.127,47.884ZM26.846,17.022a3.2,3.2,0,0,0-3.2,3.2V38.067a3.2,3.2,0,0,0,3.2,3.2h3.281a1,1,0,0,1,1,1v2.162l2.8-2.86a1,1,0,0,1,.715-.3H44.692a3.2,3.2,0,0,0,3.2-3.2V20.222a3.2,3.2,0,0,0-3.2-3.2Z\" fill=\"#fff\"/>\n    </g>\n  </g>\n</svg>\n";
 
 const VERSION$3 = '0.0.1';
-const T$6 = 'plugins.media_control_multicamera';
+const T$7 = 'plugins.media_control_multicamera';
+/**
+ * The plugin adds support for loading multiple streams and switching between them using the media control UI.
+ */
 class MultiCamera extends UICorePlugin {
     currentCamera = null;
     currentTime = 0;
@@ -38574,7 +38694,7 @@ class MultiCamera extends UICorePlugin {
             // TODO figure out what this does
             playbackOptions.recycleVideo = Browser.isMobile;
             this.currentCamera = this.findElementById(id) ?? null;
-            trace(`${T$6} changeById`, { currentCamera: this.currentCamera, multicamera: this.multicamera });
+            trace(`${T$7} changeById`, { currentCamera: this.currentCamera, multicamera: this.multicamera });
             if (!this.currentCamera) {
                 return;
             }
@@ -38590,7 +38710,7 @@ class MultiCamera extends UICorePlugin {
             // TODO remove?
             // for html5 playback:
             this.options.dvrEnabled = this.currentCamera.dvr;
-            trace(`${T$6} changeById`, { currentCamera: this.currentCamera });
+            trace(`${T$7} changeById`, { currentCamera: this.currentCamera });
             // TODO
             this.core.configure({
                 playback: playbackOptions,
@@ -38648,17 +38768,39 @@ const pipIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"no
 const buttonHtml$1 = "<button class=\"gplayer-lite-btn gcore-skin-button-color\">\n    <span><%= pipIcon %></span>\n</button>\n";
 
 const VERSION$2 = '0.0.1';
-const T$5 = `plugins.media_control_pip`;
+const T$6 = `plugins.pip`;
+/**
+ * Enables picture in picture mode.
+ * @beta
+ * @remarks
+ * Depends on:
+ *
+ * - {@link MediaControl}
+ *
+ * It renders a button to toggle picture in picture mode in the media control UI.
+ */
 class PictureInPicture extends UICorePlugin {
+    /**
+     * @internal
+     */
     get name() {
-        return 'media_control_pip';
+        return 'pip';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
+    /**
+     * @internal
+     */
     static get version() {
         return VERSION$2;
     }
+    /**
+     * @internal
+     */
     get events() {
         return {
             'click button': 'togglePictureInPicture',
@@ -38667,12 +38809,18 @@ class PictureInPicture extends UICorePlugin {
     get videoElement() {
         return this.core.activePlayback.el;
     }
+    /**
+     * @internal
+     */
     bindEvents() {
         this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_RENDERED, this.render);
     }
     isPiPSupported() {
         return document.pictureInPictureEnabled && !!HTMLVideoElement.prototype.requestPictureInPicture;
     }
+    /**
+     * @internal
+     */
     render() {
         if (!this.isPiPSupported()) {
             return this;
@@ -38694,7 +38842,7 @@ class PictureInPicture extends UICorePlugin {
         }
     }
     requestPictureInPicture() {
-        trace(`${T$5} requestPictureInPicture`, {
+        trace(`${T$6} requestPictureInPicture`, {
             videoElement: !!this.videoElement,
         });
         this.videoElement.requestPictureInPicture();
@@ -38724,26 +38872,51 @@ const DEFAULT_PLAYBACK_RATES = [
 const DEFAULT_PLAYBACK_RATE = '1.0';
 // TODO
 const MEDIACONTROL_PLAYBACKRATE = 'playbackRate';
+/**
+ * Allows changing the playback speed of the video.
+ * @beta
+ *
+ * @remarks
+ * Depends on:
+ *
+ * - {@link MediaControl | media_control}
+ *
+ * - {@link BottomGear | bottom_gear}
+ *
+ * It renders a button in the gear menu, which opens a dropdown with the available playback rates.
+ */
 class PlaybackRate extends UICorePlugin {
     currentPlayback = null;
     playbackRates = DEFAULT_PLAYBACK_RATES;
     prevSelectedRate;
     selectedRate = DEFAULT_PLAYBACK_RATE;
+    /**
+     * @internal
+     */
     get name() {
-        return 'media_control_playback_rate';
+        return 'playback_rate';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
-    get template() {
-        return tmpl(pluginHtml$3);
-    }
+    static template = tmpl(pluginHtml$3);
+    static buttonTemplate = tmpl(buttonHtml);
+    static listTemplate = tmpl(listHtml);
+    /**
+     * @internal
+     */
     get attributes() {
         return {
             'class': this.name,
             'data-playback-rate-select': ''
         };
     }
+    /**
+     * @internal
+     */
     get events() {
         return {
             'click .gear-sub-menu_btn': 'onRateSelect',
@@ -38751,8 +38924,12 @@ class PlaybackRate extends UICorePlugin {
             'click .go-back': 'goBack',
         };
     }
+    /**
+     * @internal
+     */
     bindEvents() {
         this.listenTo(this.core, 'gear:rendered', this.render);
+        // TODO this.core.getPlugin('media_control'), bottom_gear
         this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_CONTAINERCHANGED, this.reload);
         this.listenTo(this.core.mediaControl, MEDIACONTROL_PLAYBACKRATE, this.updatePlaybackRate);
         this.listenTo(this.core, 'core:advertisement:start', this.onStartAd);
@@ -38806,6 +38983,9 @@ class PlaybackRate extends UICorePlugin {
         this.currentPlayback = this.core.activePlayback;
         return !(this.currentPlayback?.tagName !== 'video' && this.currentPlayback?.tagName !== 'audio');
     }
+    /**
+     * @internal
+     */
     render() {
         const container = this.core.activeContainer;
         if (this.core.getPlaybackType() === Playback.LIVE && !container.isDvrEnabled()) {
@@ -38819,9 +38999,7 @@ class PlaybackRate extends UICorePlugin {
             this.selectedRate = cfg.defaultValue || DEFAULT_PLAYBACK_RATE;
         }
         if (this.shouldRender()) {
-            const t = tmpl(buttonHtml);
-            // const html = t({ playbackRates: this.playbackRates, title: this.getTitle() });
-            const button = t({
+            const button = PlaybackRate.buttonTemplate({
                 title: this.getTitle(),
                 speedIcon,
                 arrowRightIcon,
@@ -38869,8 +39047,7 @@ class PlaybackRate extends UICorePlugin {
         return false;
     }
     onShowMenu() {
-        const t = tmpl(listHtml);
-        this.$el.html(t({
+        this.$el.html(PlaybackRate.listTemplate({
             playbackRates: this.playbackRates,
             arrowLeftIcon,
             checkIcon,
@@ -38914,7 +39091,7 @@ const posterHTML = "<div class=\"play-wrapper\" data-poster></div>\n";
 //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$4 = 'plugins.poster_custom';
+const T$5 = 'plugins.poster_custom';
 /**
  * Displays a poster image in the background and a big play button on top when playback is stopped
  * @beta
@@ -39022,7 +39199,7 @@ class Poster extends UIContainerPlugin {
         super.disable();
     }
     onError(error) {
-        trace(`${T$4} onError`, {
+        trace(`${T$5} onError`, {
             enabled: this.enabled,
         });
         this.hasFatalError = error.level === PlayerError.Levels.FATAL;
@@ -39043,7 +39220,7 @@ class Poster extends UIContainerPlugin {
         this.update();
     }
     onStop() {
-        trace(`${T$4} onStop`, {
+        trace(`${T$5} onStop`, {
             enabled: this.enabled,
         });
         this.hasStartedPlaying = false;
@@ -39051,7 +39228,7 @@ class Poster extends UIContainerPlugin {
         this.update();
     }
     updatePlayButton(show) {
-        trace(`${T$4} updatePlayButton`, {
+        trace(`${T$5} updatePlayButton`, {
             chromeless: this.options.chromeless,
             allowUserInteraction: this.options.allowUserInteraction,
         });
@@ -39079,7 +39256,7 @@ class Poster extends UIContainerPlugin {
         this.$el.removeClass('clickable');
     }
     clicked() {
-        trace(`${T$4} clicked`, {
+        trace(`${T$5} clicked`, {
             hasStartedPlaying: this.hasStartedPlaying,
             chromeless: this.options.chromeless,
             allowUserInteraction: this.options.allowUserInteraction,
@@ -39103,7 +39280,7 @@ class Poster extends UIContainerPlugin {
         return !this.container.playback.isAudioOnly;
     }
     update() {
-        trace(`${T$4} update`, {
+        trace(`${T$5} update`, {
             shouldRender: this.shouldRender,
         });
         if (!this.shouldRender) {
@@ -39116,7 +39293,7 @@ class Poster extends UIContainerPlugin {
         this.updatePoster();
     }
     updatePoster() {
-        trace(`${T$4} updatePoster`, {
+        trace(`${T$5} updatePoster`, {
             hasStartedPlaying: this.hasStartedPlaying,
         });
         if (!this.hasStartedPlaying) {
@@ -39131,7 +39308,7 @@ class Poster extends UIContainerPlugin {
         this.$el.show();
     }
     hidePoster() {
-        trace(`${T$4} hidePoster`, {
+        trace(`${T$5} hidePoster`, {
             shouldHideOnPlay: this.shouldHideOnPlay(),
         });
         if (!this.options.disableMediaControl) {
@@ -39185,8 +39362,12 @@ const seekTimeHTML = "<span data-seek-time></span>\n<span data-duration></span>\
 
 // 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.
+// license that can be found at https://github.com/clappr/clappr-plugins/blob/master/LICENSE
 const { formatTime } = Utils;
+/**
+ * The plugin adds a seek time indicator to the media control UI.
+ * @beta
+ */
 class SeekTime extends UICorePlugin {
     get name() {
         return 'media_control_seek_time';
@@ -39343,6 +39524,9 @@ const fbIcon = "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<svg width=\"32px\"
 
 const twIcon = "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<svg width=\"32px\" height=\"32px\" viewBox=\"0 0 32 32\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n    <!-- Generator: Sketch 49 (51002) - http://www.bohemiancoding.com/sketch -->\n    <title>twitter</title>\n    <desc>Created with Sketch.</desc>\n    <defs></defs>\n    <g id=\"twitter\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n        <g fill-rule=\"nonzero\" id=\"Shape\">\n            <path d=\"M32,30 C32,31.104 31.104,32 30,32 L2,32 C0.896,32 0,31.104 0,30 L0,2 C0,0.896 0.896,0 2,0 L30,0 C31.104,0 32,0.896 32,2 L32,30 Z\" fill=\"#55ACEE\"></path>\n            <path class=\"icon-hover\" d=\"M25.987,9.894 C25.251,10.216 24.462,10.431 23.63,10.529 C24.48,10.031 25.13,9.24 25.436,8.298 C24.644,8.759 23.766,9.095 22.831,9.276 C22.083,8.491 21.017,8 19.838,8 C17.572,8 15.738,9.807 15.738,12.038 C15.738,12.352 15.774,12.663 15.842,12.96 C12.435,12.788 9.413,11.181 7.39,8.739 C7.038,9.336 6.834,10.029 6.834,10.771 C6.834,12.17 7.56,13.406 8.658,14.131 C7.987,14.109 7.354,13.928 6.802,13.625 C6.801,13.642 6.801,13.659 6.801,13.677 C6.801,15.632 8.215,17.266 10.091,17.637 C9.748,17.727 9.386,17.779 9.01,17.779 C8.746,17.779 8.49,17.755 8.24,17.707 C8.76,19.311 10.274,20.478 12.068,20.512 C10.67,21.594 8.9,22.24 6.979,22.24 C6.649,22.24 6.321,22.222 6,22.184 C7.814,23.329 9.971,23.997 12.287,23.997 C19.828,23.997 23.953,17.843 23.953,12.506 C23.953,12.333 23.948,12.156 23.941,11.985 C24.741,11.414 25.438,10.703 25.987,9.894 Z\" fill=\"#FFFFFF\"></path>\n        </g>\n    </g>\n</svg>";
 
+/**
+ * The plugin adds a share button to the media control UI.
+ */
 class Share extends UICorePlugin {
     hide = false;
     container = null;
@@ -39460,6 +39644,9 @@ class Share extends UICorePlugin {
 
 const pluginHtml$1 = "<div class=\"skip-container\" data-skip-container>\n    <div class=\"skip-item\" data-skip-left>\n    </div>\n    <div class=\"skip-item\" data-skip-mid>\n    </div>\n    <div class=\"skip-item\" data-skip-right>\n    </div>\n</div>\n";
 
+/**
+ * The plugin adds skip controls to the media control UI.
+ */
 class SkipTime extends UICorePlugin {
     get name() {
         return 'skip_time';
@@ -39568,7 +39755,7 @@ const spinnerHTML = "<div data-bounce1></div>\n<div data-bounce2></div>\n<div da
 // 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$3 = 'plugins.spinner';
+const T$4 = 'plugins.spinner';
 /**
  * Custom events emitted by the plugin
  */
@@ -39636,7 +39823,7 @@ class SpinnerThreeBounce extends UIContainerPlugin {
         this.hide();
     }
     onStop() {
-        trace(`${T$3} onStop`, {
+        trace(`${T$4} onStop`, {
             showOnError: this.options.spinner?.showOnError,
             hasFatalError: this.hasFatalError,
         });
@@ -39646,7 +39833,7 @@ class SpinnerThreeBounce extends UIContainerPlugin {
     }
     onError(e) {
         this.hasFatalError = e.code === PlaybackErrorCode.MediaSourceUnavailable;
-        trace(`${T$3} onError`, {
+        trace(`${T$4} onError`, {
             showOnError: this.options.spinner?.showOnError,
             hasFatalError: this.hasFatalError,
             error: e.code,
@@ -39679,7 +39866,7 @@ class SpinnerThreeBounce extends UIContainerPlugin {
      */
     render() {
         const showOnStart = this.options.spinner?.showOnStart;
-        trace(`${T$3} render`, {
+        trace(`${T$4} render`, {
             buffering: this.container.buffering});
         this.$el.html(this.template());
         this.el.firstElementChild?.addEventListener('animationiteration', () => {
@@ -39696,128 +39883,192 @@ class SpinnerThreeBounce extends UIContainerPlugin {
     }
 }
 
-// An example implementation of client side performancestatistics
-const CUSTOM_EVENTS_CONTAINER_START = 'container:start';
-const WATCH_CUTOFF = 5;
-const HEATMAP_INTERVAL = 10;
-// TODO rewrite as core plugin
-class Statistics extends ContainerPlugin {
-    get name() {
-        return 'statistics_gplayer';
-    }
-    get supportedVersion() {
-        return { min: CLAPPR_VERSION };
-    }
-    started = false;
-    timeStart = 0;
-    heatmapSent = false;
-    heatmapLastTime = 0;
-    watchSent = false;
-    bufTracking = false;
-    lags = 0;
-    /**
-     * The time when buffering last started.
+const T$3 = 'plugins.source_controller';
+const INITIAL_RETRY_DELAY = 1000;
+const MAX_RETRY_DELAY = 5000;
+const RETRY_DELAY_BLUR = 500;
+const VERSION$1 = '0.0.1';
+function noSync(cb) {
+    queueMicrotask(cb);
+}
+/**
+ * This plugin is responsible for managing the automatic failover between sources.
+ * @beta
+ * @remarks
+ * Have a look at the {@link https://miro.com/app/board/uXjVLiN15tY=/?share_link_id=390327585787 | source failover diagram} for the details
+ * on how sources ordering and selection works.
+ *
+ * This plugin does not expose any public methods apart from required by the Clappr plugin interface.
+ * It is supposed to work autonomously.
+ *
+ * @example
+ * ```ts
+ * import { SourceController } from '@gcorevideo/player'
+ *
+ * Player.registerPlugin(SourceController)
+ * ```
+ */
+class SourceController extends CorePlugin {
+    /*
+     * The Logic itself is quite simple:
+     * * Here is the short diagram:
+     *
+     * sources_list:
+     *       - a.mpd  |    +--------------------+
+     *       - b.m3u8 |--->|         init       |
+     *       - ...    |    |--------------------|
+     *                     | current_source = 0 |
+     *                     +--------------------+
+     *                            |
+     *                            |  source = a.mpd
+     *                            |  playback = dash.js
+     *                            v
+     *                      +------------------+
+     *                  +-->|   load source    |
+     *                  |   +---------|--------+
+     *                  |             v
+     *                  |   +------------------+
+     *                  |   |       play       |
+     *                  |   +---------|--------+
+     *                  |             |
+     *                  |             v
+     *                  |   +-----------------------+
+     *                  |   |  on playback_error    |
+     *                  |   |-----------------------|
+     *                  |   | current_source =      |
+     *                  |   |  (current_source + 1) |
+     *                  |   |  % len sources_list   |
+     *                  |   |                       |
+     *                  |   | delay 1..3s           |
+     *                  |   +---------------|-------+
+     *                  |                   |
+     *                  |   source=b.m3u8   |
+     *                  |   playback=hls.js |
+     *                  +-------------------+
+     *
      */
-    bufLastStarted = 0;
+    sourcesList = [];
+    currentSourceIndex = 0;
+    sourcesDelay = {};
+    active = false;
+    sync = noSync;
     /**
-     * The accumulated buffering duration.
+     * @internal
      */
-    bufAccDuration = 0;
-    constructor(container) {
-        super(container);
-        assert(this.options.statistics &&
-            typeof this.options.statistics.send === 'function', 'Statistics plugin requires statistics options');
-    }
-    bindEvents() {
-        // TODO remove this
-        this.listenToOnce(this.container, CUSTOM_EVENTS_CONTAINER_START, this.onStart);
-        this.listenToOnce(this.container, Events$1.CONTAINER_READY, this.onReady);
-        this.listenTo(this.container, Events$1.CONTAINER_STATE_BUFFERING, this.onBuffering);
-        this.listenTo(this.container, Events$1.CONTAINER_STATE_BUFFERFULL, this.onBufferFull);
-        this.listenTo(this.container.playback, Events$1.PLAYBACK_TIMEUPDATE, this.onTimeUpdateLive);
-        this.listenTo(this.container.playback, Events$1.PLAYBACK_LEVEL_SWITCH_START, this.startLevelSwitch);
-        this.listenTo(this.container.playback, Events$1.PLAYBACK_LEVEL_SWITCH_END, this.stopLevelSwitch);
-    }
-    startLevelSwitch() {
-        this.bufTracking = false;
+    get name() {
+        return 'source_controller';
     }
-    stopLevelSwitch() {
-        this.bufTracking = true;
+    /**
+     * @internal
+     */
+    get supportedVersion() {
+        return { min: CLAPPR_VERSION };
     }
-    onBuffering() {
-        if (this.bufTracking) {
-            this.bufLastStarted = performance.now();
+    constructor(core) {
+        super(core);
+        this.sourcesList = this.core.options.sources;
+        if (this.core.options.source !== undefined) {
+            // prevent Clappr from loading all sources simultaneously
+            this.core.options.sources = [this.core.options.source];
         }
-    }
-    onBufferFull() {
-        if (this.bufTracking && this.bufLastStarted) {
-            this.bufAccDuration += performance.now() - this.bufLastStarted;
-            this.lags++;
+        else {
+            this.core.options.sources = this.core.options.sources.slice(0, 1);
         }
-        this.bufTracking = true;
+    }
+    /**
+     * @internal
+     */
+    bindEvents() {
+        super.bindEvents();
+        this.listenTo(this.core, Events$1.CORE_ACTIVE_CONTAINER_CHANGED, () => this.onReady());
     }
     onReady() {
-        this.initEvent();
-        if (this.options.autoPlay) {
-            this.onStart();
+        trace(`${T$3} onReady`, {
+            retrying: this.active,
+            currentSource: this.sourcesList[this.currentSourceIndex],
+        });
+        const spinner = this.core.activeContainer?.getPlugin('spinner');
+        if (spinner) {
+            this.sync = (cb) => {
+                spinner.once(SpinnerEvents.SYNC, cb);
+            };
+        }
+        else {
+            this.sync = noSync;
+        }
+        this.bindContainerEventListeners();
+        if (this.active) {
+            this.core.activeContainer?.getPlugin('poster_custom')?.disable();
+            spinner?.show();
         }
     }
-    initEvent() {
-        this.sendMessage('init');
-    }
-    sendMessage(state) {
-        this.send(state, {
-        // embed_url: this.options.referer,
-        // user_agent: Browser.userAgent
+    bindContainerEventListeners() {
+        this.core.activePlayback.on(Events$1.PLAYBACK_ERROR, (error) => {
+            trace(`${T$3} on PLAYBACK_ERROR`, {
+                error: {
+                    code: error?.code,
+                    description: error?.description,
+                    level: error?.level,
+                },
+                retrying: this.active,
+                currentSource: this.sourcesList[this.currentSourceIndex],
+            });
+            switch (error.code) {
+                case PlaybackErrorCode.MediaSourceUnavailable:
+                    this.core.activeContainer?.getPlugin('poster_custom')?.disable();
+                    this.retryPlayback();
+                    break;
+            }
         });
-    }
-    send(event, data = {}) {
-        this.options.statistics.send({
-            event,
-            type: this.container.getPlaybackType(),
-            ...data,
+        this.core.activePlayback.on(Events$1.PLAYBACK_PLAY, () => {
+            trace(`${T$3} on PLAYBACK_PLAY`, {
+                currentSource: this.sourcesList[this.currentSourceIndex],
+                retrying: this.active,
+            });
+            if (this.active) {
+                this.reset();
+                // TODO make poster reset its state on enable
+                this.core.activeContainer?.getPlugin('poster_custom')?.enable();
+                this.core.activeContainer?.getPlugin('spinner')?.hide();
+            }
         });
     }
-    sendHeatmap(time) {
-        const res = {
-            buffering: Math.round(this.bufAccDuration),
-            lags: this.lags,
-        };
-        this.bufAccDuration = 0;
-        this.lags = 0;
-        if (this.container.getPlaybackType() === Playback.VOD) {
-            res.timestamp = time;
-        }
-        this.send('heatmap', res);
-        this.heatmapSent = true;
-        this.heatmapLastTime = time;
+    reset() {
+        this.active = false;
+        this.sourcesDelay = {};
     }
-    onTimeUpdateLive({ current }) {
-        // TODO check the `current` values for the live streams
-        if (!this.timeStart) {
-            this.timeStart = current;
-        }
-        try {
-            const elapsed = current - this.timeStart;
-            const heatmapElapsed = current - this.heatmapLastTime;
-            // TODO check if the heatmap is only needed for the live streams
-            if (!this.heatmapSent || heatmapElapsed >= HEATMAP_INTERVAL) {
-                this.sendHeatmap(current);
-            }
-            if (!this.watchSent && elapsed >= WATCH_CUTOFF) {
-                this.watchSent = true;
-                this.sendMessage('watch');
-            }
-        }
-        catch (error) {
-        }
+    retryPlayback() {
+        trace(`${T$3} retryPlayback enter`, {
+            currentSourceIndex: this.currentSourceIndex,
+            currentSource: this.sourcesList[this.currentSourceIndex],
+        });
+        this.active = true;
+        this.getNextMediaSource().then((nextSource) => {
+            const rnd = RETRY_DELAY_BLUR * Math.random();
+            this.sync(() => {
+                this.core.load(nextSource.source, nextSource.mimeType);
+                setTimeout(() => {
+                    // this.core.activePlayback.consent()
+                    this.core.activePlayback.play();
+                }, rnd);
+            });
+        });
     }
-    onStart() {
-        if (this.started) {
-            return;
-        }
-        this.started = true;
-        this.sendMessage('start');
+    getNextMediaSource() {
+        return new Promise((resolve) => {
+            this.sourcesDelay[this.currentSourceIndex] = Math.min(MAX_RETRY_DELAY, (this.sourcesDelay[this.currentSourceIndex] || INITIAL_RETRY_DELAY) * 2);
+            this.currentSourceIndex =
+                (this.currentSourceIndex + 1) % this.sourcesList.length;
+            const delay = this.sourcesDelay[this.currentSourceIndex] || INITIAL_RETRY_DELAY;
+            const s = this.sourcesList[this.currentSourceIndex];
+            setTimeout(() => resolve(s), delay);
+        });
+    }
+    /**
+     * @internal
+     */
+    static get version() {
+        return VERSION$1;
     }
 }
 
@@ -39829,7 +40080,7 @@ const comboboxHTML = "<button data-subtitles-button class='media-control-button
 
 const stringHTML = "<div class=\"subtitle-string\">\n  <p></p>\n</div>\n";
 
-const VERSION$1 = '2.19.14';
+const VERSION = '2.19.14';
 const LOCAL_STORAGE_SUBTITLES_ID = 'gplayer.plugins.subtitles.selected';
 const T$2 = 'plugins.subtitles';
 const NO_TRACK = { language: 'off' };
@@ -39883,7 +40134,7 @@ class Subtitles extends UICorePlugin {
      * @internal
      */
     static get version() {
-        return VERSION$1;
+        return VERSION;
     }
     static template = tmpl(comboboxHTML);
     static templateString = tmpl(stringHTML);
@@ -40153,40 +40404,217 @@ class Subtitles extends UICorePlugin {
                 this.tracks[i].mode = 'hidden';
             }
         }
-    }
-    setSubtitleText(text) {
-        this.$string.find('p').html(text);
-    }
-    clearSubtitleText() {
-        this.setSubtitleText('');
-    }
-    updateCurrentLevel(track) {
-        this.currentLevel = track;
-        if (track.language === 'off') {
-            this.hide();
-        }
-        else {
-            this.show();
+    }
+    setSubtitleText(text) {
+        this.$string.find('p').html(text);
+    }
+    clearSubtitleText() {
+        this.setSubtitleText('');
+    }
+    updateCurrentLevel(track) {
+        this.currentLevel = track;
+        if (track.language === 'off') {
+            this.hide();
+        }
+        else {
+            this.show();
+        }
+        this.selectSubtitles();
+        this.highlightCurrentSubtitles();
+    }
+    highlightCurrentSubtitles() {
+        this.levelElement().removeClass('current');
+        this.levelElement().find('a').removeClass('gcore-skin-active');
+        if (this.currentLevel) {
+            const currentLevelElement = this.levelElement(this.currentLevel.language);
+            currentLevelElement.addClass('current');
+            currentLevelElement.find('a').addClass('gcore-skin-active');
+        }
+    }
+    renderIcon() {
+        const icon = this.isShowing ? subtitlesOnIcon : subtitlesOffIcon;
+        this.core
+            .getPlugin('media_control')
+            .getElement('subtitlesSelector')
+            ?.find('span.subtitle-text')
+            .html(icon);
+    }
+}
+
+// An example implementation of client side performancestatistics
+const WATCH_CUTOFF = 5;
+const STALL_MEASURE_PERIOD = 10;
+const T$1 = 'plugins.telemetry';
+/**
+ * Telemetry event type
+ * @beta
+ */
+var TelemetryEvent;
+(function (TelemetryEvent) {
+    TelemetryEvent[TelemetryEvent["Init"] = 1] = "Init";
+    TelemetryEvent[TelemetryEvent["Start"] = 2] = "Start";
+    TelemetryEvent[TelemetryEvent["Watch"] = 3] = "Watch";
+    TelemetryEvent[TelemetryEvent["Stall"] = 4] = "Stall";
+})(TelemetryEvent || (TelemetryEvent = {}));
+/**
+ * Collects and reports the performance statistics.
+ * @beta
+ * @remarks
+ * This plugin is experimental and its API is likely to change.
+ *
+ * Configuration options {@link TelemetryPluginSettings}
+ *
+ * @example
+ * ```ts
+ * import { Statistics } from '@gcorevideo/player'
+ *
+ * Player.registerPlugin(Statistics)
+ *
+ * const player = new Player({
+ *   statistics: {
+ *     send: (data) => {
+ *        fetch('/stats', {
+ *          method: 'POST',
+ *          body: JSON.stringify(data),
+ *          headers: { 'content-type': 'application/json' },
+ *        })
+ *     },
+ *   },
+ *   ...
+ * })
+ * ```
+ */
+class Telemetry extends ContainerPlugin {
+    /**
+     * The name of the plugin.
+     */
+    get name() {
+        return 'telemetry';
+    }
+    /**
+     * The supported version of the plugin.
+     */
+    get supportedVersion() {
+        return { min: CLAPPR_VERSION };
+    }
+    started = false;
+    timeStart = 0;
+    stallSent = false;
+    stallLastTime = 0;
+    watchSent = false;
+    bufTracking = false;
+    numStalls = 0;
+    /**
+     * The time when buffering last started.
+     */
+    bufLastStarted = 0;
+    /**
+     * The accumulated buffering duration.
+     */
+    stallAcc = 0;
+    constructor(container) {
+        super(container);
+        assert(this.options.telemetry &&
+            typeof this.options.telemetry.send === 'function', 'Telemetry plugin configuration is invalid: `send` option is required');
+    }
+    /**
+     * @internal
+     */
+    bindEvents() {
+        // TODO remove this
+        // this.listenToOnce(
+        //   this.container,
+        //   CUSTOM_EVENTS_CONTAINER_START,
+        //   this.onStart,
+        // )
+        this.listenToOnce(this.container, Events$1.CONTAINER_READY, this.onReady);
+        this.listenTo(this.container, Events$1.CONTAINER_STATE_BUFFERING, this.onBuffering);
+        this.listenTo(this.container, Events$1.CONTAINER_STATE_BUFFERFULL, this.onBufferFull);
+        this.listenTo(this.container.playback, Events$1.PLAYBACK_TIMEUPDATE, this.onTimeUpdate);
+        this.listenTo(this.container.playback, Events$1.PLAYBACK_LEVEL_SWITCH_START, this.startLevelSwitch);
+        this.listenTo(this.container.playback, Events$1.PLAYBACK_LEVEL_SWITCH_END, this.endLevelSwitch);
+    }
+    startLevelSwitch() {
+        this.bufTracking = false;
+    }
+    endLevelSwitch() {
+        this.bufTracking = true;
+    }
+    onBuffering() {
+        if (this.bufTracking) {
+            this.bufLastStarted = performance.now();
+        }
+    }
+    onBufferFull() {
+        if (this.bufTracking && this.bufLastStarted) {
+            this.stallAcc += performance.now() - this.bufLastStarted;
+            this.numStalls++;
+        }
+        this.bufTracking = true;
+    }
+    onReady() {
+        this.sendInit();
+        trace(`${T$1} onReady`, {
+            autoPlay: this.options.autoPlay,
+        });
+        if (this.options.autoPlay) {
+            this.onStart();
+        }
+        else {
+            this.listenToOnce(this.container.playback, Events$1.PLAYBACK_PLAY_INTENT, this.onStart);
+        }
+    }
+    sendInit() {
+        this.send({ event: TelemetryEvent.Init });
+    }
+    send(event) {
+        this.options.telemetry.send({
+            type: this.container.getPlaybackType(),
+            ...event,
+        });
+    }
+    sendStall(time) {
+        // TODO don't send if no stalls?
+        const res = {
+            event: TelemetryEvent.Stall,
+            count: this.numStalls,
+            time,
+            total_ms: Math.round(this.stallAcc * 1000),
+        };
+        this.stallAcc = 0;
+        this.numStalls = 0;
+        this.send(res);
+        this.stallSent = true;
+        this.stallLastTime = time;
+    }
+    onTimeUpdate({ current }) {
+        if (!this.timeStart) {
+            this.timeStart = current;
+        }
+        try {
+            const elapsed = current - this.timeStart;
+            const stallElapsed = current - this.stallLastTime;
+            if (!this.stallSent || stallElapsed >= STALL_MEASURE_PERIOD) {
+                this.sendStall(current);
+            }
+            if (!this.watchSent && elapsed >= WATCH_CUTOFF) {
+                this.watchSent = true;
+                this.send({
+                    event: TelemetryEvent.Watch,
+                });
+            }
+        }
+        catch (error) {
         }
-        this.selectSubtitles();
-        this.highlightCurrentSubtitles();
     }
-    highlightCurrentSubtitles() {
-        this.levelElement().removeClass('current');
-        this.levelElement().find('a').removeClass('gcore-skin-active');
-        if (this.currentLevel) {
-            const currentLevelElement = this.levelElement(this.currentLevel.language);
-            currentLevelElement.addClass('current');
-            currentLevelElement.find('a').addClass('gcore-skin-active');
+    onStart() {
+        if (this.started) {
+            return;
         }
-    }
-    renderIcon() {
-        const icon = this.isShowing ? subtitlesOnIcon : subtitlesOffIcon;
-        this.core
-            .getPlugin('media_control')
-            .getElement('subtitlesSelector')
-            ?.find('span.subtitle-text')
-            .html(icon);
+        this.started = true;
+        this.send({
+            event: TelemetryEvent.Start,
+        });
     }
 }
 
@@ -40306,7 +40734,29 @@ const parseSRT = /*@__PURE__*/getDefaultExportFromCjs(parseSrtExports);
 
 const pluginHtml = "<div class=\"thumbnails-text\"></div>\n<% if (backdropHeight) { %>\n    <div class=\"backdrop\" style=\"height: <%= backdropHeight %>px;\">\n        <div class=\"carousel\"></div>\n    </div>\n<% }; %>\n<% if (spotlightHeight) { %>\n    <div class=\"spotlight\" style=\"height: <%= spotlightHeight %>px;\">\n    </div>\n<% }; %>\n";
 
-const T$1 = 'plugins.media_control_thumbnails';
+const T = 'plugins.thumbnails';
+/**
+ * Displays the thumbnails of the video when available.
+ * @beta
+ * @example
+ * ```ts
+ * import { Thumbnails } from '@gcorevideo/player'
+ *
+ * Player.registerPlugin(Thumbnails)
+ *
+ * new Player({
+ *   thumbnails: {
+ *     backdropHeight: 200,
+ *     backdropMinOpacity: 0.9,
+ *     backdropMaxOpacity: 0.99,
+ *     spotlightHeight: 100,
+ *     vtt: '1\n00:00:00,000 --> 00:00:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,0,100,56\n\n2\n00:00:10,000 --> 00:00:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,0,100,56\n\n3\n00:00:20,000 --> 00:00:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,0,100,56\n\n4\n00:00:30,000 --> 00:00:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,0,100,56\n\n5\n00:00:40,000 --> 00:00:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,0,100,56\n\n6\n00:00:50,000 --> 00:01:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,0,100,56\n\n7\n00:01:00,000 --> 00:01:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,0,100,56\n\n8\n00:01:10,000 --> 00:01:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,56,100,56\n\n9\n00:01:20,000 --> 00:01:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,56,100,56\n\n10\n00:01:30,000 --> 00:01:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,56,100,56\n\n11\n00:01:40,000 --> 00:01:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,56,100,56\n\n12\n00:01:50,000 --> 00:02:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,56,100,56\n\n13\n00:02:00,000 --> 00:02:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,56,100,56\n\n14\n00:02:10,000 --> 00:02:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,56,100,56\n\n15\n00:02:20,000 --> 00:02:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,112,100,56\n\n16\n00:02:30,000 --> 00:02:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,112,100,56\n\n17\n00:02:40,000 --> 00:02:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,112,100,56\n\n18\n00:02:50,000 --> 00:03:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,112,100,56\n\n19\n00:03:00,000 --> 00:03:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,112,100,56\n\n20\n00:03:10,000 --> 00:03:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,112,100,56\n\n21\n00:03:20,000 --> 00:03:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,112,100,56\n\n22\n00:03:30,000 --> 00:03:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,168,100,56\n\n23\n00:03:40,000 --> 00:03:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,168,100,56\n\n24\n00:03:50,000 --> 00:04:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,168,100,56\n\n25\n00:04:00,000 --> 00:04:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,168,100,56\n\n26\n00:04:10,000 --> 00:04:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,168,100,56\n\n27\n00:04:20,000 --> 00:04:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,168,100,56\n\n28\n00:04:30,000 --> 00:04:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,168,100,56\n\n29\n00:04:40,000 --> 00:04:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,224,100,56\n\n30\n00:04:50,000 --> 00:05:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,224,100,56\n\n31\n00:05:00,000 --> 00:05:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,224,100,56\n\n32\n00:05:10,000 --> 00:05:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,224,100,56\n\n33\n00:05:20,000 --> 00:05:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,224,100,56\n\n34\n00:05:30,000 --> 00:05:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,224,100,56\n\n35\n00:05:40,000 --> 00:05:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,224,100,56\n\n36\n00:05:50,000 --> 00:06:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,280,100,56\n\n37\n00:06:00,000 --> 00:06:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,280,100,56\n\n38\n00:06:10,000 --> 00:06:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,280,100,56\n\n39\n00:06:20,000 --> 00:06:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,280,100,56\n\n40\n00:06:30,000 --> 00:06:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,280,100,56\n\n41\n00:06:40,000 --> 00:06:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,280,100,56\n\n42\n00:06:50,000 --> 00:07:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,280,100,56\n\n43\n00:07:00,000 --> 00:07:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=0,336,100,56\n\n44\n00:07:10,000 --> 00:07:20,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=100,336,100,56\n\n45\n00:07:20,000 --> 00:07:30,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=200,336,100,56\n\n46\n00:07:30,000 --> 00:07:40,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=300,336,100,56\n\n47\n00:07:40,000 --> 00:07:50,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=400,336,100,56\n\n48\n00:07:50,000 --> 00:08:00,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=500,336,100,56\n\n49\n00:08:00,000 --> 00:08:10,000\n3dk4NsRt6vWsffEr_sprite.jpg#xywh=600,336,100,56\n',
+ *     sprite:
+ *      'https://static.gvideo.co/videoplatform/sprites/2675/2452164_3dk4NsRt6vWsffEr.mp4_sprite.jpg',
+ *   },
+ * })
+ * ```
+ */
 class Thumbnails extends UICorePlugin {
     _$spotlight = null;
     _$backdrop = null;
@@ -40321,20 +40771,27 @@ class Thumbnails extends UICorePlugin {
     _thumbsLoaded = false;
     _oldContainer = null;
     _thumbs = [];
+    /**
+     * @internal
+     */
     get name() {
-        return 'media_control_thumbnails';
+        return 'thumbnails';
     }
+    /**
+     * @internal
+     */
     get supportedVersion() {
         return { min: CLAPPR_VERSION };
     }
+    /**
+     * @internal
+     */
     get attributes() {
         return {
-            'class': this.name
+            class: this.name,
         };
     }
-    get template() {
-        return tmpl(pluginHtml);
-    }
+    static template = tmpl(pluginHtml);
     /*
      * Helper to build the "thumbs" property for a sprite sheet.
      *
@@ -40378,6 +40835,9 @@ class Thumbnails extends UICorePlugin {
         return thumbs;
     }
     // TODO check if seek enabled
+    /**
+     * @internal
+     */
     bindEvents() {
         this.listenToOnce(this.core, Events$1.CORE_READY, this._onCoreReady);
         this.listenTo(this.core.mediaControl, Events$1.MEDIACONTROL_MOUSEMOVE_SEEKBAR, this._onMouseMove);
@@ -40394,7 +40854,9 @@ class Thumbnails extends UICorePlugin {
     }
     _onCoreReady() {
         try {
-            if (!this.options.thumbnails || !this.options.thumbnails.sprite || !this.options.thumbnails.vtt) {
+            if (!this.options.thumbnails ||
+                !this.options.thumbnails.sprite ||
+                !this.options.thumbnails.vtt) {
                 this.destroy();
                 return;
             }
@@ -40444,7 +40906,7 @@ class Thumbnails extends UICorePlugin {
     }
     _getOptions() {
         if (!('thumbnails' in this.core.options)) {
-            throw '\'thumbnail property missing from options object.';
+            throw "'thumbnail property missing from options object.";
         }
         return this.core.options.thumbnails;
     }
@@ -40545,7 +41007,7 @@ class Thumbnails extends UICorePlugin {
         this.$img.css({
             height: this.spriteSheetHeight * scaleFactor,
             left: -1 * thumb.x * scaleFactor,
-            top: -1 * thumb.y * scaleFactor
+            top: -1 * thumb.y * scaleFactor,
         });
         if (this.$container.find(this.$img).length === 0) {
             this.$container.append(this.$img);
@@ -40576,7 +41038,7 @@ class Thumbnails extends UICorePlugin {
     // calculate how far along the carousel should currently be slid
     // depending on where the user is hovering on the progress bar
     _updateCarousel() {
-        trace(`${T$1} _updateCarousel`, {
+        trace(`${T} _updateCarousel`, {
             backdropHeight: this._getOptions().backdropHeight,
         });
         if (!this._getOptions().backdropHeight) {
@@ -40587,7 +41049,7 @@ class Thumbnails extends UICorePlugin {
         const videoDuration = this.core.mediaControl.container.getDuration();
         const startTimeOffset = this.core.mediaControl.container.getStartTimeOffset();
         // the time into the video at the current hover position
-        const hoverTime = startTimeOffset + (videoDuration * hoverPosition);
+        const hoverTime = startTimeOffset + videoDuration * hoverPosition;
         const backdropWidth = this._$backdrop.width();
         const $carousel = this._$carousel;
         const carouselWidth = $carousel.width();
@@ -40612,9 +41074,9 @@ class Thumbnails extends UICorePlugin {
         const positionInThumb = timeIntoThumb / thumbDuration;
         const xCoordInThumb = thumbWidth * positionInThumb;
         // now calculate the position along carousel that we want to be above the hover position
-        const xCoordInCarousel = (thumbIndex * thumbWidth) + xCoordInThumb;
+        const xCoordInCarousel = thumbIndex * thumbWidth + xCoordInThumb;
         // and finally the position of the carousel when the hover position is taken in to consideration
-        const carouselXCoord = xCoordInCarousel - (hoverPosition * backdropWidth);
+        const carouselXCoord = xCoordInCarousel - hoverPosition * backdropWidth;
         $carousel.css('left', -carouselXCoord);
         const maxOpacity = this._getOptions().backdropMaxOpacity || 0.6;
         const minOpacity = this._getOptions().backdropMinOpacity || 0.08;
@@ -40630,12 +41092,12 @@ class Thumbnails extends UICorePlugin {
                 distance = Math.min(0, distance + thumbWidth);
             }
             // fade over the width of 2 thumbnails
-            const opacity = Math.max(maxOpacity - (Math.abs(distance) / (2 * thumbWidth)), minOpacity);
+            const opacity = Math.max(maxOpacity - Math.abs(distance) / (2 * thumbWidth), minOpacity);
             this._$backdropCarouselImgs[i].css('opacity', opacity);
         }
     }
     _updateSpotlightThumb() {
-        trace(`${T$1} _updateSpotlightThumb`, {
+        trace(`${T} _updateSpotlightThumb`, {
             spotlightHeight: this._getOptions().spotlightHeight,
         });
         if (!this._getOptions().spotlightHeight) {
@@ -40646,7 +41108,7 @@ class Thumbnails extends UICorePlugin {
         const videoDuration = this.core.mediaControl.container.getDuration();
         // the time into the video at the current hover position
         const startTimeOffset = this.core.mediaControl.container.getStartTimeOffset();
-        const hoverTime = startTimeOffset + (videoDuration * hoverPosition);
+        const hoverTime = startTimeOffset + videoDuration * hoverPosition;
         this.setText(hoverTime);
         // determine which thumbnail applies to the current time
         const thumbIndex = this._getThumbIndexForTime(hoverTime);
@@ -40658,7 +41120,7 @@ class Thumbnails extends UICorePlugin {
         const elWidth = this.$el.width();
         const thumbWidth = $spotlight.width();
         const thumbHeight = $spotlight.height();
-        let spotlightXPos = (elWidth * hoverPosition) - (thumbWidth / 2);
+        let spotlightXPos = elWidth * hoverPosition - thumbWidth / 2;
         // adjust so the entire thumbnail is always visible
         spotlightXPos = Math.max(Math.min(spotlightXPos, elWidth - thumbWidth), 0);
         $spotlight.css('left', spotlightXPos);
@@ -40680,7 +41142,7 @@ class Thumbnails extends UICorePlugin {
         return 0;
     }
     _renderPlugin() {
-        trace(`${T$1} _renderPlugin`, {
+        trace(`${T} _renderPlugin`, {
             show: this._show,
             thumbsLoaded: this._thumbsLoaded,
             thumbs: this._thumbs.length,
@@ -40698,9 +41160,9 @@ class Thumbnails extends UICorePlugin {
         }
     }
     _createElements() {
-        this.$el.html(this.template({
-            'backdropHeight': this._getOptions().backdropHeight,
-            'spotlightHeight': this._getOptions().spotlightHeight
+        this.$el.html(Thumbnails.template({
+            backdropHeight: this._getOptions().backdropHeight,
+            spotlightHeight: this._getOptions().spotlightHeight,
         }));
         // cache dom references
         this._$spotlight = this.$el.find('.spotlight');
@@ -40712,200 +41174,12 @@ class Thumbnails extends UICorePlugin {
     }
 }
 
-const T = 'plugins.source_controller';
-const INITIAL_RETRY_DELAY = 1000;
-const MAX_RETRY_DELAY = 5000;
-const RETRY_DELAY_BLUR = 500;
-const VERSION = '0.0.1';
-function noSync(cb) {
-    queueMicrotask(cb);
-}
-/**
- * This plugin is responsible for managing the automatic failover between sources.
- * @beta
- * @remarks
- * Have a look at the {@link https://miro.com/app/board/uXjVLiN15tY=/?share_link_id=390327585787 | source failover diagram} for the details
- * on how sources ordering and selection works.
- *
- * This plugin does not expose any public methods apart from required by the Clappr plugin interface.
- * It is supposed to work autonomously.
- *
- * @example
- * ```ts
- * import { SourceController } from '@gcorevideo/player'
- *
- * Player.registerPlugin(SourceController)
- * ```
- */
-class SourceController extends CorePlugin {
-    /*
-     * The Logic itself is quite simple:
-     * * Here is the short diagram:
-     *
-     * sources_list:
-     *       - a.mpd  |    +--------------------+
-     *       - b.m3u8 |--->|         init       |
-     *       - ...    |    |--------------------|
-     *                     | current_source = 0 |
-     *                     +--------------------+
-     *                            |
-     *                            |  source = a.mpd
-     *                            |  playback = dash.js
-     *                            v
-     *                      +------------------+
-     *                  +-->|   load source    |
-     *                  |   +---------|--------+
-     *                  |             v
-     *                  |   +------------------+
-     *                  |   |       play       |
-     *                  |   +---------|--------+
-     *                  |             |
-     *                  |             v
-     *                  |   +-----------------------+
-     *                  |   |  on playback_error    |
-     *                  |   |-----------------------|
-     *                  |   | current_source =      |
-     *                  |   |  (current_source + 1) |
-     *                  |   |  % len sources_list   |
-     *                  |   |                       |
-     *                  |   | delay 1..3s           |
-     *                  |   +---------------|-------+
-     *                  |                   |
-     *                  |   source=b.m3u8   |
-     *                  |   playback=hls.js |
-     *                  +-------------------+
-     *
-     */
-    sourcesList = [];
-    currentSourceIndex = 0;
-    sourcesDelay = {};
-    active = false;
-    sync = noSync;
-    /**
-     * @internal
-     */
-    get name() {
-        return 'source_controller';
-    }
-    /**
-     * @internal
-     */
-    get supportedVersion() {
-        return { min: CLAPPR_VERSION };
-    }
-    constructor(core) {
-        super(core);
-        this.sourcesList = this.core.options.sources;
-        if (this.core.options.source !== undefined) {
-            // prevent Clappr from loading all sources simultaneously
-            this.core.options.sources = [this.core.options.source];
-        }
-        else {
-            this.core.options.sources = this.core.options.sources.slice(0, 1);
-        }
-    }
-    /**
-     * @internal
-     */
-    bindEvents() {
-        super.bindEvents();
-        this.listenTo(this.core, Events$1.CORE_ACTIVE_CONTAINER_CHANGED, () => this.onReady());
-    }
-    onReady() {
-        trace(`${T} onReady`, {
-            retrying: this.active,
-            currentSource: this.sourcesList[this.currentSourceIndex],
-        });
-        const spinner = this.core.activeContainer?.getPlugin('spinner');
-        if (spinner) {
-            this.sync = (cb) => {
-                spinner.once(SpinnerEvents.SYNC, cb);
-            };
-        }
-        else {
-            this.sync = noSync;
-        }
-        this.bindContainerEventListeners();
-        if (this.active) {
-            this.core.activeContainer?.getPlugin('poster_custom')?.disable();
-            spinner?.show();
-        }
-    }
-    bindContainerEventListeners() {
-        this.core.activePlayback.on(Events$1.PLAYBACK_ERROR, (error) => {
-            trace(`${T} on PLAYBACK_ERROR`, {
-                error: {
-                    code: error?.code,
-                    description: error?.description,
-                    level: error?.level,
-                },
-                retrying: this.active,
-                currentSource: this.sourcesList[this.currentSourceIndex],
-            });
-            switch (error.code) {
-                case PlaybackErrorCode.MediaSourceUnavailable:
-                    this.core.activeContainer?.getPlugin('poster_custom')?.disable();
-                    this.retryPlayback();
-                    break;
-            }
-        });
-        this.core.activePlayback.on(Events$1.PLAYBACK_PLAY, () => {
-            trace(`${T} on PLAYBACK_PLAY`, {
-                currentSource: this.sourcesList[this.currentSourceIndex],
-                retrying: this.active,
-            });
-            if (this.active) {
-                this.reset();
-                // TODO make poster reset its state on enable
-                this.core.activeContainer?.getPlugin('poster_custom')?.enable();
-                this.core.activeContainer?.getPlugin('spinner')?.hide();
-            }
-        });
-    }
-    reset() {
-        this.active = false;
-        this.sourcesDelay = {};
-    }
-    retryPlayback() {
-        trace(`${T} retryPlayback enter`, {
-            currentSourceIndex: this.currentSourceIndex,
-            currentSource: this.sourcesList[this.currentSourceIndex],
-        });
-        this.active = true;
-        this.getNextMediaSource().then((nextSource) => {
-            const rnd = RETRY_DELAY_BLUR * Math.random();
-            this.sync(() => {
-                this.core.load(nextSource.source, nextSource.mimeType);
-                setTimeout(() => {
-                    // this.core.activePlayback.consent()
-                    this.core.activePlayback.play();
-                }, rnd);
-            });
-        });
-    }
-    getNextMediaSource() {
-        return new Promise((resolve) => {
-            this.sourcesDelay[this.currentSourceIndex] = Math.min(MAX_RETRY_DELAY, (this.sourcesDelay[this.currentSourceIndex] || INITIAL_RETRY_DELAY) * 2);
-            this.currentSourceIndex =
-                (this.currentSourceIndex + 1) % this.sourcesList.length;
-            const delay = this.sourcesDelay[this.currentSourceIndex] || INITIAL_RETRY_DELAY;
-            const s = this.sourcesList[this.currentSourceIndex];
-            setTimeout(() => resolve(s), delay);
-        });
-    }
-    /**
-     * @internal
-     */
-    static get version() {
-        return VERSION;
-    }
-}
-
 var VolumeFadeEvents;
 (function (VolumeFadeEvents) {
     VolumeFadeEvents["FADE"] = "core:volume:fade";
 })(VolumeFadeEvents || (VolumeFadeEvents = {}));
 /**
+ * Applies fade effect to the player's volume change.
  * @beta
  */
 class VolumeFade extends UICorePlugin {
@@ -40913,15 +41187,22 @@ class VolumeFade extends UICorePlugin {
     container = null;
     delay = 0;
     interval = null;
+    /**
+     * @internal
+     */
     get name() {
         return 'volume_fade';
     }
+    /**
+     * @internal
+     */
     bindEvents() {
+        // TODO on container changed
         this.listenTo(this.core, Events$1.CORE_READY, this.onCoreReady);
         if (this.core.mediaControl) {
             this.listenTo(this.core.mediaControl, 'mediacontrol:volume:user', this._onUserChangeVolume);
         }
-        this.listenTo(this.core, 'core:volume:config', this._onVolumeConfig);
+        // this.listenTo(this.core, 'core:volume:config', this._onVolumeConfig);
     }
     unBindEvents() {
         this.core.$el.off('mouseleave.volume');
@@ -40991,4 +41272,4 @@ class VolumeFade extends UICorePlugin {
     }
 }
 
-export { AudioSelector, BigMuteButton, BottomGear, ClapprNerdStats, ClapprStats, ClickToPause, ClipsPlugin, ContextMenu, DisableControls, DvrControls, ErrorScreen, Favicon, GearEvents, GoogleAnalytics, Kibo, LevelSelector, Logo, MediaControl, MultiCamera, PictureInPicture, PlaybackRate, Poster, SeekTime, Share, SkipTime, SourceController, SpinnerEvents, SpinnerThreeBounce, Statistics, Subtitles, Thumbnails, VolumeFade, VolumeFadeEvents };
+export { AudioSelector, BigMuteButton, BottomGear, ClapprNerdStats, ClapprStats, ClickToPause, ClipsPlugin, ContextMenu, DvrControls, ErrorScreen, Favicon, GearEvents, GoogleAnalytics, Kibo, LevelSelector, Logo, MediaControl, MultiCamera, PictureInPicture, PlaybackRate, Poster, SeekTime, Share, SkipTime, SourceController, SpinnerEvents, SpinnerThreeBounce, Subtitles, Telemetry, TelemetryEvent, Thumbnails, VolumeFade, VolumeFadeEvents };