@gcorevideo/player 2.28.30 → 2.28.36

package/dist/index.embed.js

@@ -12674,6 +12674,9 @@ class BasePlayback extends HTML5Video$1 {
         super._onPlaying();
         this.trigger(Events$1.PLAYBACK_MEDIACONTROL_ENABLE);
     }
+    setTextTrack(id) {
+        // noop
+    }
 }
 
 var PlaybackEvents;
@@ -12696,6 +12699,7 @@ const T$8 = 'playback.dash';
 class DashPlayback extends BasePlayback {
     _levels = [];
     _currentLevel = AUTO$1;
+    _currentTextTrackId = -1;
     // true when the actual duration is longer than hlsjs's live sync point
     // when this is false playableRegionDuration will be the actual duration
     // when this is true playableRegionDuration will exclude the time after the sync point
@@ -12828,7 +12832,11 @@ class DashPlayback extends BasePlayback {
                 streaming: {
                     text: {
                         defaultEnabled: false,
-                        dispatchForManualRendering: true,
+                        // NOTE: dispatchForManualRendering is not correctly implemented in DASH.js;
+                        // it does not work when there are multiple text tracks.
+                        // CUE_ENTER and CUE_EXIT events might be dispatched additionally
+                        // for a track, other than the currently active one.
+                        // dispatchForManualRendering: true, // TODO only when useNativeSubtitles is not true?
                     },
                 },
             }, this.options.dash);
@@ -12872,24 +12880,6 @@ class DashPlayback extends BasePlayback {
         this._dash.on(_.events.PLAYBACK_RATE_CHANGED, (e) => {
             this.trigger(PlaybackEvents.PLAYBACK_RATE_CHANGED, e.playbackRate);
         });
-        this._dash.on(_.events.TRACK_CHANGE_RENDERED, (e) => {
-            if (e.mediaType === 'audio') {
-                this.trigger(Events$1.PLAYBACK_AUDIO_CHANGED, toClapprTrack$1(e.newMediaInfo));
-            }
-        });
-        this._dash.on(_.events.CUE_ENTER, (e) => {
-            this.oncueenter?.({
-                end: e.end,
-                id: e.id,
-                start: e.start,
-                text: e.text,
-            });
-        });
-        this._dash.on(_.events.CUE_EXIT, (e) => {
-            this.oncueexit?.({
-                id: e.id,
-            });
-        });
     }
     render() {
         this._ready();
@@ -13199,14 +13189,14 @@ class DashPlayback extends BasePlayback {
         this._dash?.setTextTrack(this.closedCaptionsTrackId);
     }
     setTextTrack(id) {
+        this._currentTextTrackId = id;
         this._dash?.setTextTrack(id);
     }
     /**
      * @override
      */
     get closedCaptionsTracks() {
-        const tt = this.getTextTracks();
-        return tt;
+        return this.getTextTracks();
     }
     getTextTracks() {
         return this._dash?.getTracksFor('text').map((t, index) => ({
@@ -13216,7 +13206,7 @@ class DashPlayback extends BasePlayback {
                 id: index,
                 label: getTextTrackLabel(t) || "",
                 language: t.lang,
-                mode: "hidden",
+                mode: this._currentTextTrackId === index ? "showing" : "hidden",
             },
         })) || [];
     }
@@ -50727,7 +50717,11 @@ class HlsPlayback extends BasePlayback {
         this.trigger(Events$1.PLAYBACK_AUDIO_CHANGED, toClapprTrack(track));
     }
     setTextTrack(id) {
+        if (id === this._hls.subtitleTrack) {
+            return;
+        }
         this._hls.subtitleTrack = id;
+        this.cues = [];
     }
     /**
      * @override
@@ -58549,7 +58543,7 @@ class SourceController extends CorePlugin {
     }
 }
 
-insertStyle(".media-control-skin-1 .media-control-cc button.media-control-button {\n  display: flex;\n  justify-content: center;\n  padding: 0;\n  align-items: center;\n  vertical-align: top;\n}\n.media-control-skin-1 .media-control-cc button.media-control-button:hover {\n  color: white;\n}\n.media-control-skin-1 .media-control-cc ul li {\n  text-align: center;\n}\n.media-control-skin-1 .media-control-cc ul li a {\n  height: 30px;\n  padding: 5px 10px;\n  color: #fffffe;\n}\n.media-control-skin-1 .media-control-cc ul li a:hover {\n  background-color: rgba(0, 0, 0, 0.4);\n}\n.media-control-skin-1 .media-control-cc ul li.current a {\n  background-color: rgba(0, 0, 0, 0.4);\n}\n.media-control-skin-1 .media-control-cc ul li:first-child a {\n  border-bottom-left-radius: 4px;\n  border-bottom-right-radius: 4px;\n}\n.media-control-skin-1 .media-control-cc ul li:last-child a {\n  border-top-left-radius: 4px;\n  border-top-right-radius: 4px;\n}\n.media-control-skin-1 .media-control-cc {\n  position: relative;\n  order: 85;\n}\n\n::cue {\n  visibility: hidden !important;\n  font-size: 0 !important;\n}\n\n.ios-fullscreen::cue {\n  visibility: visible !important;\n  font-size: 1em !important;\n}\n\n.container .gplayer-cc-line {\n  position: absolute;\n  bottom: calc(var(--bottom-panel) + 5px);\n  width: 100%;\n}\n.container .gplayer-cc-line p {\n  width: auto;\n  background-color: rgba(0, 0, 0, 0.4);\n  color: white;\n  display: inline-block;\n}");
+insertStyle(".media-control-skin-1 .media-control-cc button.media-control-button {\n  display: flex;\n  justify-content: center;\n  padding: 0;\n  align-items: center;\n  vertical-align: top;\n}\n.media-control-skin-1 .media-control-cc button.media-control-button:hover {\n  color: white;\n}\n.media-control-skin-1 .media-control-cc ul li {\n  text-align: center;\n}\n.media-control-skin-1 .media-control-cc ul li a {\n  height: 30px;\n  padding: 5px 10px;\n  color: #fffffe;\n}\n.media-control-skin-1 .media-control-cc ul li a:hover {\n  background-color: rgba(0, 0, 0, 0.4);\n}\n.media-control-skin-1 .media-control-cc ul li.current a {\n  background-color: rgba(0, 0, 0, 0.4);\n}\n.media-control-skin-1 .media-control-cc ul li:first-child a {\n  border-bottom-left-radius: 4px;\n  border-bottom-right-radius: 4px;\n}\n.media-control-skin-1 .media-control-cc ul li:last-child a {\n  border-top-left-radius: 4px;\n  border-top-right-radius: 4px;\n}\n.media-control-skin-1 .media-control-cc {\n  position: relative;\n  order: 85;\n}\n\n::cue {\n  visibility: hidden !important;\n  font-size: 0 !important;\n}\n\n.ios-fullscreen::cue {\n  visibility: visible !important;\n  font-size: 1em !important;\n}\n\n.container .gplayer-cc-line {\n  position: absolute;\n  bottom: calc(var(--bottom-panel) + 5px);\n  width: 100%;\n  transition: transform 0.3s ease-out;\n}\n.container .gplayer-cc-line.media-control-cc-pulled {\n  transform: translateY(var(--bottom-panel));\n}\n.container .gplayer-cc-line p {\n  width: auto;\n  background-color: rgba(0, 0, 0, 0.4);\n  color: white;\n  display: inline-block;\n}");
 
 const subtitlesOffIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n  <path\n    d=\"M16.238 16.1C13.979 16.1 12.578 14.538 12.578 11.997C12.578 9.462 13.973 7.9 16.238 7.9C18.087 7.9 19.5029 9.127 19.6219 10.824H18.032C17.876 9.927 17.168 9.338 16.238 9.338C15.011 9.338 14.249 10.354 14.249 11.997C14.249 13.641 15.011 14.662 16.243 14.662C17.178 14.662 17.881 14.111 18.038 13.251H19.627C19.492 14.938 18.119 16.1 16.238 16.1ZM8.03198 16.1C5.77298 16.1 4.37299 14.538 4.37299 11.997C4.37299 9.462 5.76798 7.9 8.03198 7.9C9.88098 7.9 11.298 9.127 11.416 10.824H9.82697C9.67097 9.927 8.96198 9.338 8.03198 9.338C6.80598 9.338 6.04297 10.354 6.04297 11.997C6.04297 13.641 6.80596 14.662 8.03796 14.662C8.97296 14.662 9.67601 14.111 9.83301 13.251H11.422C11.287 14.938 9.91398 16.1 8.03198 16.1ZM22.5 3H1.5C0.672 3 0 3.671 0 4.5V19.5C0 20.329 0.672 21 1.5 21H22.5C23.329 21 24 20.329 24 19.5V4.5C24 3.671 23.329 3 22.5 3Z\"\n    fill=\"#C9C9C9\"/>\n</svg>\n";
 
@@ -58560,7 +58554,6 @@ const comboboxHTML = "<button\n    class='media-control-button media-control-ico
 const stringHTML = "<div class=\"gplayer-cc-line\" id=\"gplayer-cc-line\">\n  <p></p>\n</div>\n";
 
 const VERSION = '2.19.14';
-const LOCAL_STORAGE_CC_ID = 'gplayer.plugins.cc.selected';
 /**
  * `PLUGIN` that provides a UI to select the subtitles when available.
  * @public
@@ -58597,9 +58590,10 @@ const LOCAL_STORAGE_CC_ID = 'gplayer.plugins.cc.selected';
  * ```
  */
 class ClosedCaptions extends UICorePlugin {
-    isPreselectedApplied = false;
+    isSelectedApplied = false;
     active = false;
     open = false;
+    userSelectedItemId = -1;
     track = null;
     tracks = [];
     $line = null;
@@ -58661,8 +58655,12 @@ class ClosedCaptions extends UICorePlugin {
         const mediaControl = this.core.getPlugin('media_control');
         assert(mediaControl, 'media_control plugin is required');
         this.listenTo(mediaControl, Events$1.MEDIACONTROL_RENDERED, this.mount);
+        this.listenTo(mediaControl, Events$1.MEDIACONTROL_SHOW, () => {
+            this.$line?.removeClass('media-control-cc-pulled');
+        });
         this.listenTo(mediaControl, Events$1.MEDIACONTROL_HIDE, () => {
             this.hideMenu();
+            this.$line?.addClass('media-control-cc-pulled');
         });
         this.listenTo(mediaControl, ExtendedEvents.MEDIACONTROL_MENU_COLLAPSE, (from) => {
             if (from !== this.name) {
@@ -58697,7 +58695,7 @@ class ClosedCaptions extends UICorePlugin {
                 video.classList.remove('ios-fullscreen');
             }
         });
-        this.isPreselectedApplied = false;
+        this.isSelectedApplied = false;
     }
     onPlaybackReady() {
         this.core.activePlayback.oncueenter = (e) => {
@@ -58720,23 +58718,27 @@ class ClosedCaptions extends UICorePlugin {
         this.activateTrack(id);
     }
     activateTrack(id) {
-        if (['dash', 'hls'].includes(this.core.activePlayback?.name)) {
-            this.core.activePlayback.setTextTrack(id);
+        const isManaged = this.core.activePlayback?.name === 'hls';
+        this.core.activePlayback.setTextTrack(id);
+        if (isManaged) {
+            return;
+        }
+        if (!this.core.activePlayback?.el.textTracks) {
             return;
         }
-        for (const track of this.currentTracks) {
-            if (track.id === id) {
+        for (const [index, track] of Array.from(this.core.activePlayback?.el.textTracks ?? []).entries()) {
+            if (index === id) {
                 if (this.useNativeSubtitles) {
-                    track.track.mode = 'showing';
+                    track.mode = 'showing';
                 }
                 else {
-                    track.track.mode = 'hidden';
+                    track.mode = 'hidden';
                 }
-                this.setSubtitleText(this.getSubtitleText(track.track));
-                track.track.oncuechange = (e) => {
+                this.setSubtitleText(this.getSubtitleText(track));
+                track.oncuechange = () => {
                     try {
-                        if (track.track.activeCues?.length) {
-                            const html = track.track.activeCues[0].getCueAsHTML();
+                        if (track.activeCues?.length) {
+                            const html = track.activeCues[0].getCueAsHTML();
                             this.setSubtitleText(html);
                         }
                         else {
@@ -58748,8 +58750,8 @@ class ClosedCaptions extends UICorePlugin {
                 };
             }
             else {
-                track.track.oncuechange = () => { };
-                track.track.mode = 'disabled';
+                track.oncuechange = () => { };
+                track.mode = 'disabled';
             }
         }
     }
@@ -58757,7 +58759,7 @@ class ClosedCaptions extends UICorePlugin {
         try {
             // TODO ensure to apply only once
             this.currentTracks = this.core.activePlayback.closedCaptionsTracks;
-            this.applyPreselectedSubtitles();
+            this.applySelectedSubtitles();
             this.render();
         }
         catch (error) {
@@ -58790,8 +58792,10 @@ class ClosedCaptions extends UICorePlugin {
         this.$el.find('#gplayer-cc-menu').hide();
         this.$el.find('#gplayer-cc-button').attr('aria-expanded', 'false');
         this.$line.hide();
-        for (const track of this.currentTracks) {
-            track.track.mode = 'hidden';
+        for (const track of this.core.activePlayback.el.textTracks) {
+            if (track.mode === 'showing') {
+                track.mode = 'hidden';
+            }
         }
     }
     /**
@@ -58803,7 +58807,6 @@ class ClosedCaptions extends UICorePlugin {
         if (this.core.activeContainer &&
             isFullscreen(this.core.activeContainer.el) &&
             this.currentTrack &&
-            // this.currentTrack.track.mode &&
             (Browser.isiOS || this.useNativeSubtitles)) {
             this.$line.hide();
             this.currentTrack.track.mode = 'showing';
@@ -58845,6 +58848,10 @@ class ClosedCaptions extends UICorePlugin {
         this.resizeFont();
         this.clampPopup();
         this.core.activeContainer.$el.append(this.$line);
+        const mc = this.core.getPlugin('media_control');
+        if (!mc?.isVisible()) {
+            this.$line?.addClass('media-control-cc-pulled');
+        }
         this.updateSelection();
         this.renderIcon();
         return this;
@@ -58862,22 +58869,36 @@ class ClosedCaptions extends UICorePlugin {
     }
     onItemSelect(event) {
         // event.target does not exist for some reason in tests
-        const id = (event.target ?? event.currentTarget).dataset?.item ??
-            '-1';
-        localStorage.setItem(LOCAL_STORAGE_CC_ID, id); // TODO store language instead?
-        this.selectItem(this.findById(Number(id)));
+        const id = Number((event.target ?? event.currentTarget).dataset?.item ??
+            '-1');
+        // TODO review, make configurable, and emit event in addition
+        // localStorage.setItem(LOCAL_STORAGE_CC_ID, id) // TODO store language instead?
+        this.userSelectedItemId = id;
+        this.selectItem(this.findById(id));
         this.hideMenu();
         return false;
     }
-    applyPreselectedSubtitles() {
-        if (!this.isPreselectedApplied) {
-            this.isPreselectedApplied = true;
-            // if the language is undefined, then let the engine decide
-            // to hide the subtitles forcefully, set the language to 'none'
-            setTimeout(() => {
-                this.selectItem(this.tracks.find((t) => this.isPreselectedLanguage(t.track.language)) ?? null);
-            }, 0);
+    applySelectedSubtitles() {
+        if (this.isSelectedApplied) {
+            return;
         }
+        this.isSelectedApplied = true;
+        // If user selected a language, activate that
+        // Otherwise, if there is no configured language, then let the engine decide
+        // To hide the subtitles initially forcefully, set the language to 'none'
+        let matcher;
+        if (this.userSelectedItemId !== -1) {
+            matcher = (track) => track.id === this.userSelectedItemId;
+        }
+        else if (this.preselectedLanguage) {
+            matcher = (track) => this.isPreselectedLanguage(track.track.language);
+        }
+        else {
+            return;
+        }
+        setTimeout(() => {
+            this.selectItem(this.tracks.find(matcher) ?? null);
+        }, 0);
     }
     hideMenu() {
         this.open = false;
@@ -58911,10 +58932,9 @@ class ClosedCaptions extends UICorePlugin {
         return this.$el.find('#gplayer-cc-menu li'); // TODO fix semantically
     }
     selectSubtitles() {
-        const trackId = this.currentTrack?.id ?? -1;
-        // TODO find out if this is needed
-        this.core.activePlayback.closedCaptionsTrackId = trackId;
-        // this.core.activePlayback.closedCaptionsTrackId = -1
+        if (this.currentTrack) {
+            this.core.activePlayback.closedCaptionsTrackId = this.currentTrack.id;
+        }
     }
     getSubtitleText(track) {
         const currentTime = this.core.activePlayback?.getCurrentTime() ?? 0;
@@ -58937,7 +58957,7 @@ class ClosedCaptions extends UICorePlugin {
         this.setSubtitleText('');
     }
     updateSelection() {
-        if (!this.currentTrack) {
+        if (this.core.activePlayback.closedCaptionsTrackId === -1) {
             this.hide();
         }
         else {