@gcorevideo/player 2.18.3 → 2.19.0

package/lib/plugins/vast-ads/xmlmerge.js

@@ -0,0 +1,82 @@
+import { reportError } from '@gcorevideo/utils';
+import assert from "assert";
+export default class MergeVast {
+    firstXML;
+    secondXML;
+    firstVAST;
+    secondVAST;
+    constructor(xml1, xml2) {
+        this.firstXML = this._stringToXML(xml1);
+        this.secondXML = this._stringToXML(xml2);
+        this.firstVAST = this.firstXML.getElementsByTagName('VAST');
+        this.secondVAST = this.secondXML.getElementsByTagName('VAST');
+    }
+    merge() {
+        const res = this._mergeXML(this.firstVAST, this.secondVAST);
+        try {
+            return res[0].outerHTML;
+        }
+        catch (error) {
+            // LogManager.exception(error);
+            reportError(error);
+        }
+        return '';
+    }
+    _mergeXML(first, second, parent) {
+        // const sources = [].slice.call( arguments, 0 );
+        // const first = sources[0];
+        // const second = sources[1];
+        // const parent = sources[2];
+        for (let i = 0; i < first.length; i++) {
+            let secondItems = this._getPieceTree(first[i].nodeName, second);
+            if (first[i].nodeName === 'Tracking' ||
+                first[i].nodeName === 'Impression' ||
+                first[i].nodeName === 'Error' ||
+                first[i].nodeName === 'Viewable' ||
+                first[i].nodeName === 'ClickTracking' ||
+                first[i].nodeName === 'ClickThrough') {
+                secondItems = null;
+            }
+            if (!secondItems) {
+                try {
+                    assert(parent, 'parent is null');
+                    parent.appendChild(first[i].cloneNode(true));
+                }
+                catch (error) {
+                    // LogManager.exception(error);
+                    reportError(error);
+                }
+            }
+            else {
+                if (first[i].children.length > 0 && secondItems) {
+                    this._mergeXML(first[i].children, secondItems.children, secondItems);
+                }
+            }
+        }
+        return second;
+    }
+    _getPieceTree(nodeName, xml) {
+        if (xml) {
+            if (xml instanceof HTMLCollection) {
+                for (const item of xml) {
+                    if (item.nodeName === nodeName) {
+                        return item;
+                    }
+                }
+            }
+        }
+        return null;
+    }
+    _stringToXML(val) {
+        let xmlDoc = null;
+        if (document.implementation && document.implementation.createDocument) {
+            return (new DOMParser()).parseFromString(val, 'application/xml');
+        }
+        else if ('ActiveXObject' in window) {
+            xmlDoc = new window.ActiveXObject('Microsoft.XMLDOM');
+            xmlDoc.loadXML(val);
+            return xmlDoc;
+        }
+        throw new Error('XML Parser not found');
+    }
+}

package/lib/plugins/volume-fade/VolumeFade.d.ts

@@ -0,0 +1,21 @@
+import { UICorePlugin } from '@clappr/core';
+export declare enum VolumeFadeEvents {
+    FADE = "core:volume:fade"
+}
+export declare class VolumeFade extends UICorePlugin {
+    private _aboveBorderVolume;
+    private container;
+    private delay;
+    private interval;
+    get name(): string;
+    bindEvents(): void;
+    unBindEvents(): void;
+    private _onUserChangeVolume;
+    private _onVolumeConfig;
+    private onCoreReady;
+    private onEnter;
+    private numberTo;
+    private clearCurrentInterval;
+    private onLeave;
+}
+//# sourceMappingURL=VolumeFade.d.ts.map

package/lib/plugins/volume-fade/VolumeFade.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VolumeFade.d.ts","sourceRoot":"","sources":["../../../src/plugins/volume-fade/VolumeFade.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAiC,MAAM,cAAc,CAAC;AAK3E,oBAAY,gBAAgB;IAC1B,IAAI,qBAAqB;CAC1B;AAED,qBAAa,UAAW,SAAQ,YAAY;IAC1C,OAAO,CAAC,kBAAkB,CAAK;IAE/B,OAAO,CAAC,SAAS,CAA0B;IAE3C,OAAO,CAAC,KAAK,CAAK;IAElB,OAAO,CAAC,QAAQ,CAAwB;IAExC,IAAI,IAAI,WAEP;IAEQ,UAAU;IAQnB,YAAY;IAKZ,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,eAAe;IAKvB,OAAO,CAAC,WAAW;IAwBnB,OAAO,CAAC,OAAO;IAIf,OAAO,CAAC,QAAQ;IA0BhB,OAAO,CAAC,oBAAoB;IAO5B,OAAO,CAAC,OAAO;CAGhB"}

package/lib/plugins/volume-fade/VolumeFade.js

@@ -0,0 +1,90 @@
+import { UICorePlugin, Events, Browser, $ } from '@clappr/core';
+import { reportError } from '@gcorevideo/utils';
+export var VolumeFadeEvents;
+(function (VolumeFadeEvents) {
+    VolumeFadeEvents["FADE"] = "core:volume:fade";
+})(VolumeFadeEvents || (VolumeFadeEvents = {}));
+export class VolumeFade extends UICorePlugin {
+    _aboveBorderVolume = 0;
+    container = null;
+    delay = 0;
+    interval = null;
+    get name() {
+        return 'volume_fade';
+    }
+    bindEvents() {
+        this.listenTo(this.core, Events.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);
+    }
+    unBindEvents() {
+        this.core.$el.off('mouseleave.volume');
+        this.core.$el.off('mouseenter.volume');
+    }
+    _onUserChangeVolume(volume) {
+        this._aboveBorderVolume = volume;
+    }
+    _onVolumeConfig(value) {
+        this._aboveBorderVolume = value;
+        this.container?.setVolume(0);
+    }
+    onCoreReady() {
+        this.unBindEvents();
+        this.container = this.core.activeContainer;
+        if (this.core && this.core.$el) {
+            // TODO find out why options.playerElement instead of this.core.$el or this.container.$el
+            $(this.options.playerElement).on('mouseenter.volume', () => {
+                this.onEnter();
+            });
+            $(this.options.playerElement).on('mouseleave.volume', () => {
+                this.onLeave();
+            });
+        }
+        if (!this._aboveBorderVolume) {
+            this._aboveBorderVolume = this.container?.volume && !isNaN(this.container.volume) ? this.container.volume : 80;
+        }
+        if (this.options.mute || Browser.isMobile) {
+            this.destroy();
+            return;
+        }
+        this.delay = this.options.volumeFade && this.options.volumeFade.delay || 600;
+        this.container?.setVolume(0);
+    }
+    onEnter() {
+        this.numberTo(this.delay);
+    }
+    numberTo(duration, contra = 0) {
+        this.clearCurrentInterval();
+        const start = new Date().getTime();
+        this.interval = setInterval(() => {
+            let now = (new Date().getTime()) - start;
+            if (now > duration) {
+                now = duration;
+            }
+            const progress = Math.abs(contra - now / duration);
+            try {
+                this.container?.setVolume(progress * this._aboveBorderVolume);
+                this.core.trigger(VolumeFadeEvents.FADE, progress * this._aboveBorderVolume);
+            }
+            catch (error) {
+                // LogManager.exception(error);
+                reportError(error);
+                this.clearCurrentInterval();
+            }
+            if (progress >= 1 || progress <= 0) {
+                this.clearCurrentInterval();
+            }
+        }, 10);
+    }
+    clearCurrentInterval() {
+        if (this.interval !== null) {
+            clearInterval(this.interval);
+            this.interval = null;
+        }
+    }
+    onLeave() {
+        this.numberTo(this.delay, 1);
+    }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gcorevideo/player",
-  "version": "2.18.3",
+  "version": "2.19.0",
   "description": "Gcore JavaScript video player",
   "main": "dist/index.js",
   "type": "module",
@@ -36,6 +36,8 @@
     "@rollup/plugin-json": "^6.1.0",
     "@rollup/plugin-node-resolve": "^15.3.0",
     "@sinonjs/fake-timers": "^14.0.0",
+    "@types/human-format": "^1.0.3",
+    "@types/mousetrap": "^1.6.15",
     "@types/node": "^22.10.1",
     "@types/sinonjs__fake-timers": "^8.1.5",
     "assert": "^2.1.0",
@@ -43,6 +45,9 @@
     "nodemon": "^3.1.9",
     "rollup": "^4.27.4",
     "rollup-plugin-polyfill-node": "^0.13.0",
+    "rollup-plugin-sass": "^1.15.2",
+    "rollup-plugin-string": "^3.0.0",
+    "sass": "^1.85.0",
     "typescript": "^5.7.2",
     "vitest": "^3.0.4"
   },
@@ -52,6 +57,9 @@
     "@sentry/types": "^8.47.0",
     "dashjs": "^4.7.4",
     "event-lite": "^1.0.0",
-    "hls.js": "^1.5.17"
+    "hls.js": "^1.5.17",
+    "human-format": "^1.2.1",
+    "mousetrap": "^1.6.5",
+    "parse-srt": "^1.0.0-alpha"
   }
 }

package/rollup.config.js

@@ -3,10 +3,12 @@ import commonjs from '@rollup/plugin-commonjs';
 import json from '@rollup/plugin-json';
 import resolve from '@rollup/plugin-node-resolve';
 import polyfillNode from 'rollup-plugin-polyfill-node';
+import sass from 'rollup-plugin-sass';
+import { string } from 'rollup-plugin-string';
 
 export default [
   {
-    input: 'lib/index.js',
+    input: 'lib/index.core.js',
     plugins: [
       resolve(), // TODO check which aren't inlined in the bundle and put them here
       commonjs(),
@@ -15,7 +17,35 @@ export default [
     ],
     output: [
       {
-        dir: 'dist',
+        file: 'dist/index.js',
+        format: 'es',
+        generatedCode: 'es2015',
+      }
+    ]
+  },
+  {
+    input: 'lib/index.plugins.js',
+    plugins: [
+      resolve(), // TODO check which aren't inlined in the bundle and put them here
+      commonjs(),
+      json(),
+      polyfillNode(),
+      sass({
+        output: 'dist/plugins/index.css',
+        verbose: true,
+      }),
+      string({
+        include: [
+          '**/*.ejs',
+          '**/*.html',
+          '**/*.svg',
+          '**/*.worker.js',
+        ],
+      }),
+    ],
+    output: [
+      {
+        dir: 'dist/plugins/index.js',
         format: 'es',
         generatedCode: 'es2015',
       }

package/src/index.core.ts

@@ -0,0 +1,15 @@
+/**
+ * Video player for the Gcore streaming platform
+ *
+ * @remarks
+ * This package provides a video player for the Gcore streaming platform.
+ * It is built on top of the Clappr library and provides a framework for building custom integrations.
+ *
+ * @packageDocumentation
+ */
+
+export { LogTracer, Logger, SentryTracer, reportError, setTracer, trace } from '@gcorevideo/utils'
+export * from './Player.js'
+export * from './playback.types.js'
+export * from './types.js'
+export * from './version.js'

package/src/index.plugins.ts

@@ -0,0 +1,42 @@
+/**
+ * @packageDocumentation
+ * @beta
+ * A collection of plugins for the Gcore video player
+ */
+
+import '../assets/style/main.scss';
+
+export * from "./plugins/audio-selector/AudioSelector.js";
+export * from "./plugins/big-mute-button/BigMuteButton.js";
+export * from "./plugins/bottom-gear/BottomGear.js";
+export * from "./plugins/clappr-nerd-stats/ClapprNerdStats.js";
+export * from "./plugins/clappr-stats/ClapprStats.js";
+export * from "./plugins/click-to-pause/ClickToPause.js";
+export * from "./plugins/clips/Clips.js";
+export * from "./plugins/context-menu/ContextMenu.js";
+export * from "./plugins/disable-controls/DisableControls.js";
+export * from "./plugins/dvr-controls/DvrControls.js";
+export * from "./plugins/error-screen/ErrorScreen.js";
+export * from "./plugins/favicon/Favicon.js";
+// _ ga-events
+export * from "./plugins/google-analytics/GoogleAnalytics.js";
+export * from "./plugins/kibo/index.js";
+export * from "./plugins/level-selector/LevelSelector.js";
+export * from "./plugins/logo/Logo.js";
+export * from "./plugins/media-control/MediaControl.js";
+export * from "./plugins/multi-camera/MultiCamera.js";
+export * from "./plugins/picture-in-picture/PictureInPicture.js";
+export * from "./plugins/playback-rate/PlaybackRate.js";
+export * from "./plugins/poster/Poster.js";
+export * from "./plugins/seek-time/SeekTime.js";
+export * from "./plugins/share/Share.js";
+export * from "./plugins/skip-time/SkipTime.js";
+export * from "./plugins/spinner-three-bounce/SpinnerThreeBounce.js";
+export * from "./plugins/statistics/Statistics.js";
+export * from "./plugins/subtitles/Subtitles.js";
+export * from "./plugins/thumbnails/Thumbnails.js";
+export { setTracer} from "@gcorevideo/utils";
+export * from "./plugins/source-controller/SourceController.js";
+// _ vast-ads
+// _ video360
+export * from "./plugins/volume-fade/VolumeFade.js";

package/src/index.ts

@@ -1,15 +1,2 @@
-/**
- * Video player for the Gcore streaming platform
- *
- * @remarks
- * This package provides a video player for the Gcore streaming platform.
- * It is built on top of the Clappr library and provides a framework for building custom integrations.
- *
- * @packageDocumentation
- */
-
-export { LogTracer, Logger, SentryTracer, reportError, setTracer, trace } from '@gcorevideo/utils'
-export * from './Player.js'
-export * from './playback.types.js'
-export * from './types.js'
-export * from './version.js'
+export * from './index.core.js'
+export * from './index.plugins.js'