rx-player 3.30.0-dev.2023020100 → 3.30.0-dev.2023030200

package/dist/_esm5.processed/core/api/debug/modules/general_info.js

@@ -0,0 +1,199 @@
+import { DEFAULT_REFRESH_INTERVAL } from "../constants";
+import { createCompositeElement, createElement, createMetricTitle, isExtendedMode, } from "../utils";
+export default function constructDebugGeneralInfo(instance, parentElt, cancelSignal) {
+    var generalInfoElt = createElement("div");
+    var adaptationsElt = createElement("div");
+    var representationsElt = createElement("div");
+    updateGeneralInfo();
+    var generalInfoItv = setInterval(function () {
+        updateGeneralInfo();
+    }, DEFAULT_REFRESH_INTERVAL);
+    cancelSignal.register(function () {
+        clearInterval(generalInfoItv);
+    });
+    return createCompositeElement("div", [
+        generalInfoElt,
+        adaptationsElt,
+        representationsElt,
+    ]);
+    function updateGeneralInfo() {
+        var videoElement = instance.getVideoElement();
+        if (videoElement === null) {
+            // disposed player. Clean-up everything
+            generalInfoElt.innerHTML = "";
+            adaptationsElt.innerHTML = "";
+            representationsElt.innerHTML = "";
+            clearInterval(generalInfoItv);
+            return;
+        }
+        else {
+            var currentTime = instance.getPosition();
+            var bufferGap = instance.getVideoBufferGap();
+            var bufferGapStr = bufferGap === Infinity ? "0" : bufferGap.toFixed(2);
+            var valuesLine1 = [
+                ["ct", currentTime.toFixed(2)],
+                ["bg", bufferGapStr],
+                ["rs", String(videoElement.readyState)],
+                ["pr", String(videoElement.playbackRate)],
+                ["sp", String(instance.getPlaybackRate())],
+                ["pa", String(videoElement.paused ? 1 : 0)],
+                ["en", String(videoElement.ended ? 1 : 0)],
+                ["li", String(instance.isLive() ? 1 : 0)],
+                ["wba", String(instance.getWantedBufferAhead())],
+                ["st", "\"".concat(instance.getPlayerState(), "\"")],
+            ];
+            var valuesLine2 = [];
+            var ks = instance.getKeySystemConfiguration();
+            if (ks !== null) {
+                valuesLine2.push(["ks", ks.keySystem]);
+            }
+            var mbb = instance.getMaxBufferBehind();
+            if (mbb !== Infinity) {
+                valuesLine2.push(["mbb", String(mbb)]);
+            }
+            var mba = instance.getMaxBufferAhead();
+            if (mba !== Infinity) {
+                valuesLine2.push(["mba", String(mba)]);
+            }
+            var mia = instance.getMinAudioBitrate();
+            if (mia !== 0) {
+                valuesLine2.push(["mia", String(mia)]);
+            }
+            var miv = instance.getMinVideoBitrate();
+            if (miv !== 0) {
+                valuesLine2.push(["miv", String(miv)]);
+            }
+            var maa = instance.getMaxAudioBitrate();
+            if (maa !== Infinity) {
+                valuesLine2.push(["maa", String(maa)]);
+            }
+            var mav = instance.getMaxVideoBitrate();
+            if (mav !== Infinity) {
+                valuesLine2.push(["mav", String(mav)]);
+            }
+            var fab = instance.getManualAudioBitrate();
+            if (fab >= 0) {
+                valuesLine2.push(["fab", String(fab)]);
+            }
+            var fvb = instance.getManualVideoBitrate();
+            if (fvb >= 0) {
+                valuesLine2.push(["fvb", String(fvb)]);
+            }
+            var mbs = instance.getMaxVideoBufferSize();
+            if (mbs !== Infinity) {
+                valuesLine2.push(["mbs", String(mbs)]);
+            }
+            var minPos = instance.getMinimumPosition();
+            if (minPos !== null) {
+                valuesLine1.push(["mip", minPos.toFixed(2)]);
+                valuesLine2.push(["dmi", (currentTime - minPos).toFixed(2)]);
+            }
+            var maxPos = instance.getMaximumPosition();
+            if (maxPos !== null) {
+                valuesLine1.push(["map", maxPos.toFixed(2)]);
+                valuesLine2.push(["dma", (maxPos - currentTime).toFixed(2)]);
+            }
+            var valuesLine3 = [];
+            var error = instance.getError();
+            if (error !== null) {
+                valuesLine3.push(["er", "\"".concat(String(error), "\"")]);
+            }
+            generalInfoElt.innerHTML = "";
+            for (var _i = 0, _a = [valuesLine1, valuesLine2, valuesLine3]; _i < _a.length; _i++) {
+                var valueSet = _a[_i];
+                if (valueSet.length > 0) {
+                    var lineInfoElt = createElement("div");
+                    for (var _b = 0, valueSet_1 = valueSet; _b < valueSet_1.length; _b++) {
+                        var value = valueSet_1[_b];
+                        lineInfoElt.appendChild(createMetricTitle(value[0]));
+                        lineInfoElt.appendChild(createElement("span", {
+                            textContent: value[1] + " ",
+                        }));
+                    }
+                    generalInfoElt.appendChild(lineInfoElt);
+                }
+            }
+            if (isExtendedMode(parentElt)) {
+                var url = instance.getUrl();
+                if (url !== undefined) {
+                    var reducedUrl = url.length > 100 ?
+                        url.substring(0, 99) + "…" :
+                        url;
+                    generalInfoElt.appendChild(createCompositeElement("div", [
+                        createMetricTitle("url"),
+                        createElement("span", {
+                            textContent: reducedUrl,
+                        }),
+                    ]));
+                }
+            }
+        }
+        if (isExtendedMode(parentElt)) {
+            var videoId = instance.getAvailableVideoTracks().map(function (_a) {
+                var id = _a.id, active = _a.active;
+                return active ? "*".concat(id) : id;
+            });
+            var audioId = instance.getAvailableAudioTracks().map(function (_a) {
+                var id = _a.id, active = _a.active;
+                return active ? "*".concat(id) : id;
+            });
+            var textId = instance.getAvailableTextTracks().map(function (_a) {
+                var id = _a.id, active = _a.active;
+                return active ? "*".concat(id) : id;
+            });
+            adaptationsElt.innerHTML = "";
+            if (videoId.length > 0) {
+                var textContent = "".concat(videoId.length, ":").concat(videoId.join(" "), " ");
+                if (textContent.length > 100) {
+                    textContent = textContent.substring(0, 98) + "… ";
+                }
+                var videoAdaps = createCompositeElement("div", [
+                    createMetricTitle("vt"),
+                    createElement("span", { textContent: textContent }),
+                ]);
+                adaptationsElt.appendChild(videoAdaps);
+            }
+            if (audioId.length > 0) {
+                var textContent = "".concat(audioId.length, ":").concat(audioId.join(" "), " ");
+                if (textContent.length > 100) {
+                    textContent = textContent.substring(0, 98) + "… ";
+                }
+                var audioAdaps = createCompositeElement("div", [
+                    createMetricTitle("at"),
+                    createElement("span", { textContent: textContent }),
+                ]);
+                adaptationsElt.appendChild(audioAdaps);
+            }
+            if (textId.length > 0) {
+                var textContent = "".concat(textId.length, ":").concat(textId.join(" "), " ");
+                if (textContent.length > 100) {
+                    textContent = textContent.substring(0, 98) + "… ";
+                }
+                var textAdaps = createCompositeElement("div", [
+                    createMetricTitle("tt"),
+                    createElement("span", { textContent: textContent }),
+                ]);
+                adaptationsElt.appendChild(textAdaps);
+            }
+            var videoBitrates = instance.getAvailableVideoBitrates();
+            var audioBitrates = instance.getAvailableAudioBitrates();
+            representationsElt.innerHTML = "";
+            if (videoBitrates.length > 0) {
+                representationsElt.appendChild(createMetricTitle("vb"));
+                representationsElt.appendChild(createElement("span", {
+                    textContent: videoBitrates.join(" ") + " ",
+                }));
+            }
+            if (audioBitrates.length > 0) {
+                representationsElt.appendChild(createMetricTitle("ab"));
+                representationsElt.appendChild(createElement("span", {
+                    textContent: audioBitrates.join(" ") + " ",
+                }));
+            }
+        }
+        else {
+            adaptationsElt.innerHTML = "";
+            representationsElt.innerHTML = "";
+        }
+    }
+}

package/dist/_esm5.processed/core/api/debug/modules/segment_buffer_content.d.ts

@@ -0,0 +1,4 @@
+import { CancellationSignal } from "../../../../utils/task_canceller";
+import { IBufferType } from "../../../segment_buffers";
+import RxPlayer from "../../public_api";
+export default function createSegmentBufferGraph(instance: RxPlayer, bufferType: IBufferType, title: string, parentElt: HTMLElement, cancelSignal: CancellationSignal): HTMLElement;

package/dist/_esm5.processed/core/api/debug/modules/segment_buffer_content.js

@@ -0,0 +1,121 @@
+import isNullOrUndefined from "../../../../utils/is_null_or_undefined";
+import SegmentBufferGraph from "../buffer_graph";
+import { DEFAULT_REFRESH_INTERVAL } from "../constants";
+import { createElement, createGraphCanvas, createMetricTitle, isExtendedMode, } from "../utils";
+export default function createSegmentBufferGraph(instance, bufferType, title, parentElt, cancelSignal) {
+    var bufferGraphWrapper = createElement("div");
+    var bufferTitle = createMetricTitle(title);
+    var canvasElt = createGraphCanvas();
+    var currentRangeRepInfoElt = createElement("div");
+    var loadingRangeRepInfoElt = createElement("div");
+    var bufferGraph = new SegmentBufferGraph(canvasElt);
+    var intervalId = setInterval(update, DEFAULT_REFRESH_INTERVAL);
+    cancelSignal.register(function () {
+        clearInterval(intervalId);
+    });
+    bufferGraphWrapper.appendChild(bufferTitle);
+    bufferGraphWrapper.appendChild(canvasElt);
+    bufferGraphWrapper.appendChild(currentRangeRepInfoElt);
+    bufferGraphWrapper.appendChild(loadingRangeRepInfoElt);
+    bufferGraphWrapper.style.padding = "5px 0px";
+    update();
+    return bufferGraphWrapper;
+    function update() {
+        var _a, _b, _c, _d;
+        if (instance.getVideoElement() === null) {
+            // disposed player. Clean-up everything
+            bufferGraphWrapper.style.display = "none";
+            bufferGraphWrapper.innerHTML = "";
+            clearInterval(intervalId);
+            return;
+        }
+        var showAllInfo = isExtendedMode(parentElt);
+        var inventory = instance.__priv_getSegmentBufferContent(bufferType);
+        if (inventory === null) {
+            bufferGraphWrapper.style.display = "none";
+            currentRangeRepInfoElt.innerHTML = "";
+            loadingRangeRepInfoElt.innerHTML = "";
+        }
+        else {
+            bufferGraphWrapper.style.display = "block";
+            var currentTime = instance.getPosition();
+            var width = Math.min(parentElt.clientWidth - 150, 600);
+            bufferGraph.update({
+                currentTime: currentTime,
+                minimumPosition: (_a = instance.getMinimumPosition()) !== null && _a !== void 0 ? _a : undefined,
+                maximumPosition: (_b = instance.getMaximumPosition()) !== null && _b !== void 0 ? _b : undefined,
+                inventory: inventory,
+                width: width,
+                height: 10,
+            });
+            if (!showAllInfo) {
+                currentRangeRepInfoElt.innerHTML = "";
+                loadingRangeRepInfoElt.innerHTML = "";
+                return;
+            }
+            currentRangeRepInfoElt.innerHTML = "";
+            for (var i = 0; i < inventory.length; i++) {
+                var rangeInfo = inventory[i];
+                var bufferedStart = rangeInfo.bufferedStart, bufferedEnd = rangeInfo.bufferedEnd, infos = rangeInfo.infos;
+                if (bufferedStart !== undefined && bufferedEnd !== undefined &&
+                    currentTime >= bufferedStart && currentTime < bufferedEnd) {
+                    currentRangeRepInfoElt.appendChild(createMetricTitle("play"));
+                    currentRangeRepInfoElt.appendChild(createElement("span", {
+                        textContent: constructRepresentationInfo(infos),
+                    }));
+                    break;
+                }
+            }
+            loadingRangeRepInfoElt.innerHTML = "";
+            var rep = (_c = instance.getCurrentRepresentations()) === null || _c === void 0 ? void 0 : _c[bufferType];
+            var adap = (_d = instance.getCurrentAdaptations()) === null || _d === void 0 ? void 0 : _d[bufferType];
+            var manifest = instance.getManifest();
+            if (manifest !== null && !isNullOrUndefined(rep) && !isNullOrUndefined(adap)) {
+                var period = manifest.getPeriodForTime(currentTime);
+                if (period !== undefined) {
+                    loadingRangeRepInfoElt.appendChild(createMetricTitle("load"));
+                    loadingRangeRepInfoElt.appendChild(createElement("span", {
+                        textContent: constructRepresentationInfo({
+                            period: period,
+                            adaptation: adap,
+                            representation: rep,
+                        }),
+                    }));
+                }
+            }
+        }
+    }
+}
+function constructRepresentationInfo(content) {
+    var _a;
+    var period = content.period;
+    var _b = content.adaptation, language = _b.language, isAudioDescription = _b.isAudioDescription, isClosedCaption = _b.isClosedCaption, isTrickModeTrack = _b.isTrickModeTrack, isSignInterpreted = _b.isSignInterpreted, bufferType = _b.type;
+    var _c = content.representation, id = _c.id, height = _c.height, width = _c.width, bitrate = _c.bitrate, codec = _c.codec;
+    var representationInfo = "\"".concat(id, "\" ");
+    if (height !== undefined && width !== undefined) {
+        representationInfo += "".concat(width, "x").concat(height, " ");
+    }
+    if (bitrate !== undefined) {
+        representationInfo += "(".concat((bitrate / 1000).toFixed(0), "kbps) ");
+    }
+    if (codec !== undefined) {
+        representationInfo += "c:\"".concat(codec, "\" ");
+    }
+    if (language !== undefined) {
+        representationInfo += "l:\"".concat(language, "\" ");
+    }
+    if (bufferType === "video" && typeof isSignInterpreted === "boolean") {
+        representationInfo += "si:".concat(isSignInterpreted ? 1 : 0, " ");
+    }
+    if (bufferType === "video" && typeof isTrickModeTrack === "boolean") {
+        representationInfo += "tm:".concat(isTrickModeTrack ? 1 : 0, " ");
+    }
+    if (bufferType === "audio" && typeof isAudioDescription === "boolean") {
+        representationInfo += "ad:".concat(isAudioDescription ? 1 : 0, " ");
+    }
+    if (bufferType === "text" && typeof isClosedCaption === "boolean") {
+        representationInfo += "cc:".concat(isClosedCaption ? 1 : 0, " ");
+    }
+    representationInfo += "p:".concat(period.start, "-").concat((_a = period.end) !== null && _a !== void 0 ? _a : "?");
+    return representationInfo;
+}

package/dist/_esm5.processed/core/api/debug/modules/segment_buffer_size.d.ts

@@ -0,0 +1,3 @@
+import { CancellationSignal } from "../../../../utils/task_canceller";
+import RxPlayer from "../../public_api";
+export default function createSegmentBufferSizeGraph(instance: RxPlayer, parentElt: HTMLElement, cancelSignal: CancellationSignal): HTMLElement;

package/dist/_esm5.processed/core/api/debug/modules/segment_buffer_size.js

@@ -0,0 +1,35 @@
+import BufferSizeGraph from "../buffer_size_graph";
+import { DEFAULT_REFRESH_INTERVAL } from "../constants";
+import { createElement, createGraphCanvas, createMetricTitle, } from "../utils";
+export default function createSegmentBufferSizeGraph(instance, parentElt, cancelSignal) {
+    var bufferSizeGraphWrapperElt = createElement("div");
+    var bufferSizeTitle = createMetricTitle("bgap");
+    var canvasElt = createGraphCanvas();
+    var bufferSizeGraph = new BufferSizeGraph(canvasElt);
+    var intervalId = setInterval(addBufferSize, DEFAULT_REFRESH_INTERVAL);
+    cancelSignal.register(function () {
+        clearInterval(intervalId);
+    });
+    bufferSizeGraphWrapperElt.appendChild(bufferSizeTitle);
+    bufferSizeGraphWrapperElt.appendChild(canvasElt);
+    bufferSizeGraphWrapperElt.style.padding = "7px 0px";
+    addBufferSize();
+    return bufferSizeGraphWrapperElt;
+    function addBufferSize() {
+        if (instance.getVideoElement() === null) {
+            // disposed player. Clean-up everything
+            bufferSizeGraphWrapperElt.innerHTML = "";
+            clearInterval(intervalId);
+            return;
+        }
+        var bufferGap = instance.getVideoBufferGap();
+        if (bufferGap === Infinity) {
+            bufferSizeGraph.pushBufferSize(0);
+        }
+        else {
+            bufferSizeGraph.pushBufferSize(bufferGap);
+        }
+        var width = Math.min(parentElt.clientWidth - 150, 600);
+        bufferSizeGraph.reRender(width, 10);
+    }
+}

package/dist/_esm5.processed/core/api/debug/render.d.ts

@@ -0,0 +1,3 @@
+import { CancellationSignal } from "../../../utils/task_canceller";
+import RxPlayer from "../public_api";
+export default function renderDebugElement(parentElt: HTMLElement, instance: RxPlayer, cancelSignal: CancellationSignal): void;

package/dist/_esm5.processed/core/api/debug/render.js

@@ -0,0 +1,32 @@
+import constructDebugGeneralInfo from "./modules/general_info";
+import createSegmentBufferGraph from "./modules/segment_buffer_content";
+import createSegmentBufferSizeGraph from "./modules/segment_buffer_size";
+import { createCompositeElement, createElement } from "./utils";
+export default function renderDebugElement(parentElt, instance, cancelSignal) {
+    var debugElementTitleElt = createElement("div", {
+        textContent: "RxPlayer Debug Information",
+    });
+    debugElementTitleElt.style.fontWeight = "bold";
+    debugElementTitleElt.style.borderBottom = "1px solid white";
+    debugElementTitleElt.style.marginBottom = "5px";
+    debugElementTitleElt.style.fontStyle = "italic";
+    var debugWrapperElt = createCompositeElement("div", [
+        debugElementTitleElt,
+        constructDebugGeneralInfo(instance, parentElt, cancelSignal),
+        createSegmentBufferGraph(instance, "video", "vbuf", parentElt, cancelSignal),
+        createSegmentBufferGraph(instance, "audio", "abuf", parentElt, cancelSignal),
+        createSegmentBufferGraph(instance, "text", "tbuf", parentElt, cancelSignal),
+        createSegmentBufferSizeGraph(instance, parentElt, cancelSignal),
+    ]);
+    debugWrapperElt.style.backgroundColor = "#00000099";
+    debugWrapperElt.style.padding = "7px";
+    debugWrapperElt.style.fontSize = "13px";
+    debugWrapperElt.style.fontFamily = "mono";
+    debugWrapperElt.style.color = "white";
+    debugWrapperElt.style.display = "inline-block";
+    debugWrapperElt.style.bottom = "0px";
+    parentElt.appendChild(debugWrapperElt);
+    cancelSignal.register(function () {
+        parentElt.removeChild(debugWrapperElt);
+    });
+}

package/dist/_esm5.processed/core/api/debug/utils.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Create an HTML element.
+ * @param {string} elementName - The element's name, like `"div"` for example.
+ * @param {Object} [options={}] - Optional attributes for the element.
+ * @param {string} [options.textContent] - Inner text for that element.
+ * @param {string} [options.className] - Value for a `class` attribute
+ * associated to this element.
+ * @param {string} [options.href] - Value for a `href` attribute
+ * associated to this element.
+ * @returns {HTMLElement}
+ */
+export declare function createElement(elementName: "input", opts?: CreateElementOptions | undefined): HTMLInputElement;
+export declare function createElement(elementName: "button", opts?: CreateElementOptions | undefined): HTMLButtonElement;
+export declare function createElement(elementName: "a", opts?: CreateElementOptions | undefined): HTMLLinkElement;
+export declare function createElement(elementName: "canvas", opts?: CreateElementOptions | undefined): HTMLCanvasElement;
+export declare function createElement(elementName: string, opts?: CreateElementOptions | undefined): HTMLElement;
+interface CreateElementOptions {
+    textContent?: string | undefined;
+    className?: string | undefined;
+}
+/**
+ * Create an HTML element which may contain mutiple HTML sub-elements.
+ * @param {string} rootElementName - The element's name, like `"div"` for
+ * example.
+ * @param {Array.<string|HTMLElement>} parts - The HTML sub-elements, in order.
+ * Those can also just be strings, in which case only text nodes (and no actual
+ * HTMLElement) will be added at this place.
+ * @param {Object} [options={}] - Optional attributes for the element.
+ * @param {string} [options.className] - Value for a `class` attribute
+ * associated to this element.
+ * @returns {HTMLElement}
+ */
+export declare function createCompositeElement(rootElementName: string, parts: Array<HTMLElement | string>, { className }?: {
+    className?: string;
+} | undefined): HTMLElement;
+export declare function isExtendedMode(parentElt: HTMLElement): boolean;
+export declare function createMetricTitle(title: string): HTMLElement;
+export declare function createGraphCanvas(): HTMLCanvasElement;
+export {};

package/dist/_esm5.processed/core/api/debug/utils.js

@@ -0,0 +1,57 @@
+export function createElement(elementName, _a) {
+    var _b = _a === void 0 ? {} : _a, textContent = _b.textContent, className = _b.className;
+    var elt = document.createElement(elementName);
+    if (className !== undefined) {
+        elt.className = className;
+    }
+    if (textContent !== undefined) {
+        elt.textContent = textContent;
+    }
+    return elt;
+}
+/**
+ * Create an HTML element which may contain mutiple HTML sub-elements.
+ * @param {string} rootElementName - The element's name, like `"div"` for
+ * example.
+ * @param {Array.<string|HTMLElement>} parts - The HTML sub-elements, in order.
+ * Those can also just be strings, in which case only text nodes (and no actual
+ * HTMLElement) will be added at this place.
+ * @param {Object} [options={}] - Optional attributes for the element.
+ * @param {string} [options.className] - Value for a `class` attribute
+ * associated to this element.
+ * @returns {HTMLElement}
+ */
+export function createCompositeElement(rootElementName, parts, _a) {
+    var _b = _a === void 0 ? {} : _a, className = _b.className;
+    var elt = document.createElement(rootElementName);
+    if (className !== undefined) {
+        elt.className = className;
+    }
+    for (var _i = 0, parts_1 = parts; _i < parts_1.length; _i++) {
+        var subElt = parts_1[_i];
+        if (typeof subElt === "string") {
+            elt.appendChild(document.createTextNode(subElt));
+        }
+        else {
+            elt.appendChild(subElt);
+        }
+    }
+    return elt;
+}
+export function isExtendedMode(parentElt) {
+    return parentElt.clientHeight > 400;
+}
+export function createMetricTitle(title) {
+    var elt = createElement("span", {
+        textContent: title + "/",
+    });
+    elt.style.fontWeight = "bold";
+    return elt;
+}
+export function createGraphCanvas() {
+    var canvasElt = createElement("canvas");
+    canvasElt.style.border = "1px solid white";
+    canvasElt.style.height = "15px";
+    canvasElt.style.marginLeft = "2px";
+    return canvasElt;
+}

package/dist/_esm5.processed/core/api/playback_observer.js

@@ -154,7 +154,7 @@ var PlaybackObserver = /** @class */ (function () {
      */
     PlaybackObserver.prototype.listen = function (cb, options) {
         var _a;
-        if (this._canceller.isUsed || ((_a = options === null || options === void 0 ? void 0 : options.clearSignal) === null || _a === void 0 ? void 0 : _a.isCancelled) === true) {
+        if (this._canceller.isUsed() || ((_a = options === null || options === void 0 ? void 0 : options.clearSignal) === null || _a === void 0 ? void 0 : _a.isCancelled()) === true) {
             return noop;
         }
         this._observationRef.onUpdate(cb, {
@@ -565,7 +565,8 @@ function generateReadOnlyObserver(src, transform, cancellationSignal) {
         },
         listen: function (cb, options) {
             var _a;
-            if (cancellationSignal.isCancelled || ((_a = options === null || options === void 0 ? void 0 : options.clearSignal) === null || _a === void 0 ? void 0 : _a.isCancelled) === true) {
+            if (cancellationSignal.isCancelled() ||
+                ((_a = options === null || options === void 0 ? void 0 : options.clearSignal) === null || _a === void 0 ? void 0 : _a.isCancelled()) === true) {
                 return;
             }
             mappedRef.onUpdate(cb, {

package/dist/_esm5.processed/core/api/public_api.d.ts

@@ -161,6 +161,9 @@ declare class Player extends EventEmitter<IPublicAPIEvent> {
         };
         autoPlay?: boolean;
     }): void;
+    createDebugElement(element: HTMLElement): {
+        dispose(): void;
+    };
     /**
      * From given options, initialize content playback.
      * @param {Object} options

package/dist/_esm5.processed/core/api/public_api.js

@@ -89,7 +89,7 @@ var Player = /** @class */ (function (_super) {
         // Workaround to support Firefox autoplay on FF 42.
         // See: https://bugzilla.mozilla.org/show_bug.cgi?id=1194624
         videoElement.preload = "auto";
-        _this.version = /* PLAYER_VERSION */ "3.30.0-dev.2023020100";
+        _this.version = /* PLAYER_VERSION */ "3.30.0-dev.2023030200";
         _this.log = log;
         _this.state = "STOPPED";
         _this.videoElement = videoElement;
@@ -312,6 +312,18 @@ var Player = /** @class */ (function (_super) {
         }
         this._priv_initializeContentPlayback(newOptions);
     };
+    Player.prototype.createDebugElement = function (element) {
+        if (features.createDebugElement === null) {
+            throw new Error("Feature `DEBUG_ELEMENT` not added to the RxPlayer");
+        }
+        var canceller = new TaskCanceller();
+        features.createDebugElement(element, this, canceller.signal);
+        return {
+            dispose: function () {
+                canceller.cancel();
+            },
+        };
+    };
     /**
      * From given options, initialize content playback.
      * @param {Object} options
@@ -422,7 +434,7 @@ var Player = /** @class */ (function (_super) {
             }
             mediaElementTrackChoiceManager =
                 this._priv_initializeMediaElementTrackChoiceManager(defaultAudioTrack, defaultTextTrack, currentContentCanceller.signal);
-            if (currentContentCanceller.isUsed) {
+            if (currentContentCanceller.isUsed()) {
                 return;
             }
             initializer = new features.directfile.initDirectFile({ autoPlay: autoPlay, keySystems: keySystems, speed: this._priv_speed, startAt: startAt, url: url });
@@ -589,7 +601,7 @@ var Player = /** @class */ (function (_super) {
         playerStateRef.onUpdate(function (newState) {
             updateReloadingMetadata(newState);
             _this._priv_setPlayerState(newState);
-            if (currentContentCanceller.isUsed) {
+            if (currentContentCanceller.isUsed()) {
                 return;
             }
             if (seekEventsCanceller !== null) {
@@ -599,15 +611,14 @@ var Player = /** @class */ (function (_super) {
                 }
             }
             else if (isLoadedState(_this.state)) {
-                seekEventsCanceller = new TaskCanceller({
-                    cancelOn: currentContentCanceller.signal,
-                });
+                seekEventsCanceller = new TaskCanceller();
+                seekEventsCanceller.linkToSignal(currentContentCanceller.signal);
                 emitSeekEvents(videoElement, playbackObserver, function () { return _this.trigger("seeking", null); }, function () { return _this.trigger("seeked", null); }, seekEventsCanceller.signal);
             }
             // Previous call could have performed all kind of side-effects, thus,
             // we re-check the current state associated to the RxPlayer
             if (_this.state === "ENDED" /* PLAYER_STATES.ENDED */ && _this._priv_stopAtEnd) {
-                currentContentCanceller.cancel();
+                _this.stop();
             }
         }, { emitCurrentValue: true, clearSignal: currentContentCanceller.signal });
         // React to playback conditions change
@@ -1933,16 +1944,16 @@ var Player = /** @class */ (function (_super) {
             this._priv_triggerEventIfNotStopped("videoTrackChange", null, cancelSignal);
         }
         this._priv_triggerAvailableBitratesChangeEvent("availableAudioBitratesChange", this.getAvailableAudioBitrates(), cancelSignal);
-        if (contentInfos.currentContentCanceller.isUsed) {
+        if (contentInfos.currentContentCanceller.isUsed()) {
             return;
         }
         this._priv_triggerAvailableBitratesChangeEvent("availableVideoBitratesChange", this.getAvailableVideoBitrates(), cancelSignal);
-        if (contentInfos.currentContentCanceller.isUsed) {
+        if (contentInfos.currentContentCanceller.isUsed()) {
             return;
         }
         var audioBitrate = (_f = (_e = (_d = this._priv_getCurrentRepresentations()) === null || _d === void 0 ? void 0 : _d.audio) === null || _e === void 0 ? void 0 : _e.bitrate) !== null && _f !== void 0 ? _f : -1;
         this._priv_triggerCurrentBitrateChangeEvent("audioBitrateChange", audioBitrate, cancelSignal);
-        if (contentInfos.currentContentCanceller.isUsed) {
+        if (contentInfos.currentContentCanceller.isUsed()) {
             return;
         }
         var videoBitrate = (_j = (_h = (_g = this._priv_getCurrentRepresentations()) === null || _g === void 0 ? void 0 : _g.video) === null || _h === void 0 ? void 0 : _h.bitrate) !== null && _j !== void 0 ? _j : -1;
@@ -2230,7 +2241,7 @@ var Player = /** @class */ (function (_super) {
      */
     Player.prototype._priv_triggerAvailableBitratesChangeEvent = function (event, newVal, currentContentCancelSignal) {
         var prevVal = this._priv_contentEventsMemory[event];
-        if (!currentContentCancelSignal.isCancelled &&
+        if (!currentContentCancelSignal.isCancelled() &&
             (prevVal === undefined || !areArraysOfNumbersEqual(newVal, prevVal))) {
             this._priv_contentEventsMemory[event] = newVal;
             this.trigger(event, newVal);
@@ -2244,7 +2255,7 @@ var Player = /** @class */ (function (_super) {
      * @param {Object} currentContentCancelSignal
      */
     Player.prototype._priv_triggerCurrentBitrateChangeEvent = function (event, newVal, currentContentCancelSignal) {
-        if (!currentContentCancelSignal.isCancelled &&
+        if (!currentContentCancelSignal.isCancelled() &&
             newVal !== this._priv_contentEventsMemory[event]) {
             this._priv_contentEventsMemory[event] = newVal;
             this.trigger(event, newVal);
@@ -2268,7 +2279,7 @@ var Player = /** @class */ (function (_super) {
      * @param {Object} currentContentCancelSignal
      */
     Player.prototype._priv_triggerEventIfNotStopped = function (evt, arg, currentContentCancelSignal) {
-        if (!currentContentCancelSignal.isCancelled) {
+        if (!currentContentCancelSignal.isCancelled()) {
             this.trigger(evt, arg);
         }
     };
@@ -2328,5 +2339,5 @@ var Player = /** @class */ (function (_super) {
     };
     return Player;
 }(EventEmitter));
-Player.version = /* PLAYER_VERSION */ "3.30.0-dev.2023020100";
+Player.version = /* PLAYER_VERSION */ "3.30.0-dev.2023030200";
 export default Player;