j1-template 2024.3.27 → 2024.3.28

data/assets/theme/j1/modules/lightGallery/js/lightgallery.js

@@ -30,7 +30,8 @@
 }(this, (function () {
 'use strict';
 
-    /*! *****************************************************************************
+    /*! 
+    ****************************************************************************
     Copyright (c) Microsoft Corporation.
 
     Permission to use, copy, modify, and/or distribute this software for any
@@ -43,7 +44,8 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
+    **************************************************************************** 
+    */
 
     var __assign = function() {
         __assign = Object.assign || function __assign(t) {

data/assets/theme/j1/modules/lightGallery/js/plugins/lg-autoplay.js

@@ -27,9 +27,11 @@
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
     typeof define === 'function' && define.amd ? define(factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.lgAutoplay = factory());
-}(this, (function () { 'use strict';
+}(this, (function () {
+    'use strict';
 
-    /*! *****************************************************************************
+    /*! 
+    ****************************************************************************
     Copyright (c) Microsoft Corporation.
 
     Permission to use, copy, modify, and/or distribute this software for any
@@ -42,7 +44,8 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
+    **************************************************************************** 
+    */
 
     var __assign = function() {
         __assign = Object.assign || function __assign(t) {

data/assets/theme/j1/modules/lightGallery/js/plugins/lg-comment.js

@@ -27,9 +27,11 @@
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
     typeof define === 'function' && define.amd ? define(factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.lgComment = factory());
-}(this, (function () { 'use strict';
+}(this, (function () {
+    'use strict';
 
-    /*! *****************************************************************************
+    /*! 
+    ****************************************************************************
     Copyright (c) Microsoft Corporation.
 
     Permission to use, copy, modify, and/or distribute this software for any
@@ -42,7 +44,8 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
+    **************************************************************************** 
+    */
 
     var __assign = function() {
         __assign = Object.assign || function __assign(t) {

data/assets/theme/j1/modules/lightGallery/js/plugins/lg-fullscreen.js

@@ -27,9 +27,11 @@
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
     typeof define === 'function' && define.amd ? define(factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.lgFullscreen = factory());
-}(this, (function () { 'use strict';
+}(this, (function () {
+    'use strict';
 
-    /*! *****************************************************************************
+    /*! 
+    ****************************************************************************
     Copyright (c) Microsoft Corporation.
 
     Permission to use, copy, modify, and/or distribute this software for any
@@ -42,7 +44,8 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
+    **************************************************************************** 
+    */
 
     var __assign = function() {
         __assign = Object.assign || function __assign(t) {

data/assets/theme/j1/modules/lightGallery/js/plugins/lg-hash.js

@@ -27,9 +27,11 @@
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
     typeof define === 'function' && define.amd ? define(factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.lgHash = factory());
-}(this, (function () { 'use strict';
+}(this, (function () {
+    'use strict';
 
-    /*! *****************************************************************************
+    /*! 
+    ****************************************************************************
     Copyright (c) Microsoft Corporation.
 
     Permission to use, copy, modify, and/or distribute this software for any
@@ -42,7 +44,8 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
+    **************************************************************************** 
+    */
 
     var __assign = function() {
         __assign = Object.assign || function __assign(t) {

data/assets/theme/j1/modules/lightGallery/js/plugins/lg-medium-zoom.js

@@ -27,9 +27,11 @@
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
     typeof define === 'function' && define.amd ? define(factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.lgMediumZoom = factory());
-}(this, (function () { 'use strict';
+}(this, (function () {
+    'use strict';
 
-    /*! *****************************************************************************
+    /*! 
+    ****************************************************************************
     Copyright (c) Microsoft Corporation.
 
     Permission to use, copy, modify, and/or distribute this software for any
@@ -42,7 +44,8 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
+    **************************************************************************** 
+    */
 
     var __assign = function() {
         __assign = Object.assign || function __assign(t) {

data/assets/theme/j1/modules/lightGallery/js/plugins/lg-pager.js

@@ -27,9 +27,11 @@
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
     typeof define === 'function' && define.amd ? define(factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.lgPager = factory());
-}(this, (function () { 'use strict';
+}(this, (function () {
+    'use strict';
 
-    /*! *****************************************************************************
+    /*! 
+    ****************************************************************************
     Copyright (c) Microsoft Corporation.
 
     Permission to use, copy, modify, and/or distribute this software for any
@@ -42,7 +44,8 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
+    **************************************************************************** 
+    */
 
     var __assign = function() {
         __assign = Object.assign || function __assign(t) {

data/assets/theme/j1/modules/lightGallery/js/plugins/lg-relative-caption.js

@@ -27,9 +27,11 @@
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
     typeof define === 'function' && define.amd ? define(factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.lgRelativeCaption = factory());
-}(this, (function () { 'use strict';
+}(this, (function () {
+    'use strict';
 
-    /*! *****************************************************************************
+    /*! 
+    ****************************************************************************
     Copyright (c) Microsoft Corporation.
 
     Permission to use, copy, modify, and/or distribute this software for any
@@ -42,7 +44,8 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
+    **************************************************************************** 
+    */
 
     var __assign = function() {
         __assign = Object.assign || function __assign(t) {

data/assets/theme/j1/modules/lightGallery/js/plugins/lg-rotate.js

@@ -27,9 +27,10 @@
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
     typeof define === 'function' && define.amd ? define(factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.lgRotate = factory());
-}(this, (function () { 'use strict';
-
-    /*! *****************************************************************************
+}(this, (function () {
+    'use strict';
+    /*! 
+    ****************************************************************************
     Copyright (c) Microsoft Corporation.
 
     Permission to use, copy, modify, and/or distribute this software for any
@@ -42,7 +43,8 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
+    **************************************************************************** 
+    */
 
     var __assign = function() {
         __assign = Object.assign || function __assign(t) {

data/assets/theme/j1/modules/lightGallery/js/plugins/lg-share.js

@@ -27,9 +27,11 @@
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
     typeof define === 'function' && define.amd ? define(factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.lgShare = factory());
-}(this, (function () { 'use strict';
+}(this, (function () {
+    'use strict';
 
-    /*! *****************************************************************************
+    /*! 
+    ****************************************************************************
     Copyright (c) Microsoft Corporation.
 
     Permission to use, copy, modify, and/or distribute this software for any
@@ -42,7 +44,8 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
+    **************************************************************************** 
+    */
 
     var __assign = function() {
         __assign = Object.assign || function __assign(t) {

data/assets/theme/j1/modules/lightGallery/js/plugins/lg-thumbnail.js

@@ -27,9 +27,11 @@
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
     typeof define === 'function' && define.amd ? define(factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.lgThumbnail = factory());
-}(this, (function () { 'use strict';
+}(this, (function () {
+    'use strict';
 
-    /*! *****************************************************************************
+    /*! 
+    ****************************************************************************
     Copyright (c) Microsoft Corporation.
 
     Permission to use, copy, modify, and/or distribute this software for any
@@ -42,7 +44,8 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
+    **************************************************************************** 
+    */
 
     var __assign = function() {
         __assign = Object.assign || function __assign(t) {

data/assets/theme/j1/modules/lightGallery/js/plugins/lg-video.js

@@ -1,6 +1,6 @@
 /*
  # -----------------------------------------------------------------------------
- # ~/assets/theme/j1/modules/lightGallery/js/plugins/lg-video.js
+ # ~/assets/theme/j1/modules/lightGallery/js/plugins/lg-video.js (5)
  # Provides lightGallery v2.8.3 JS code for the plugin lgVideo
  #
  # Product/Info:
@@ -30,7 +30,8 @@
 }(this, (function () {
 'use strict';
 
-    /*! *****************************************************************************
+    /*! 
+    ****************************************************************************
     Copyright (c) Microsoft Corporation.
 
     Permission to use, copy, modify, and/or distribute this software for any
@@ -43,7 +44,8 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
+    **************************************************************************** 
+    */
 
     var __assign = function() {
         __assign = Object.assign || function __assign(t) {
@@ -291,7 +293,7 @@
             loadVtt(videojsPlayer.chapterTracksSource, cb_load);
 
             // failsafe: remove already existing markers for current player
-            removeChapterMarkers(timeline, playerID);
+            // removeChapterMarkers(timeline, playerID);
 
             // if tracks available, add (chapter) tracks on timeline
             // -----------------------------------------------------------------
@@ -329,8 +331,9 @@
                             clearInterval(markers_loaded);
                         } // END if markers.length
                     }, 10); // END interval markers_loaded
-                }, 100 ); // END timeout
+                }, 100); // END timeout
             } // END if chapterTracks enabled
+
         } // END addChapterMarkers
 
 
@@ -338,21 +341,30 @@
         // main
         // =====================================================================
         dependency_met_module_ready = setInterval (() => {
-            var playerId, videoData, timeline;
-            var isModuleInitialised  = (j1.adapter.gallery.getState() === 'finished') ? true : false;
-            var isVideojsOptions     = (isEmpty(vjsObject.settings.videojsOptions)) ? false : true;
+            var playerId, videoData, timeline,
+            textTracks, isModuleInitialised, isVideojsOptions,
+            hasChapters, hasSubtitles;
+
+            textTracks          = videojsPlayer.textTracks();
+            isModuleInitialised = (j1.adapter.gallery.getState() === 'finished') ? true : false;
+            isVideojsOptions    = (isEmpty(vjsObject.settings.videojsOptions)) ? false : true;
+
+            // check on chapters
+            hasChapters = Array.from(textTracks).some(track => 
+                track.kind === 'chapters' && track.cues && track.cues.length > 0
+            );
+            
+            // check on subtitles||captions  
+            hasSubtitles = Array.from(textTracks).some(track => 
+                (track.kind === 'subtitles' || track.kind === 'captions') && 
+                track.cues && track.cues.length > 0
+            );
 
             if (isModuleInitialised && isVideojsOptions) {
                 playerId    = videojsPlayer.id();
                 videoData   = { tracks: [] };
                 playerState = getPlayerStatus(videojsPlayer);
 
-                // set (initial) videoData tracks.chapters to empty array
-                videoData.tracks.chapters = [];
-
-                // ENABLE chapter tracks by default (to enable very first checks)
-                // videojsPlayer.chapterTracksEnabled = true;
-
                 var hotKeysPluginDefaults = {
                     volumeStep:                 vjsOptions.plugins.hotKeys.volumeStep,
                     seekStep:                   vjsOptions.plugins.hotKeys.seekStep,
@@ -383,7 +395,7 @@
                     zoom:                       vjsOptions.plugins.zoomButtons.zoom
                 };
 
-                //  jadams, 2025-06-11: added customControlContainer
+                //  add customControlContainer
                 // -------------------------------------------------------------
                 var vjsPlayerControlBar = videojsPlayer.controlBar;
 
@@ -421,7 +433,7 @@
                     zoomPlugin        = vjsObject.settings.videojsOptions.controlBar.zoomPlugin;
                     playbackRates     = vjsObject.settings.videojsOptions.controlBar.playbackRates;
 
-                    //  jadams, 2024-01-22: added video start position
+                    // add video start position
                     // ---------------------------------------------------------
                     if (vjsObject.settings.videojsOptions.videoStart !== undefined) {
                         videoStart = vjsObject.settings.videojsOptions.videoStart[index];
@@ -431,11 +443,11 @@
                         }); // END on event play
                     } // END if videoStart
 
-                    // add playbackRates, only available for VideoJS
+                    // add playbackRates
                     // ---------------------------------------------------------
                     videojsPlayer.playbackRates(playbackRates);
 
-                    // add hotkeys Plugin, only available for VideoJS
+                    // add hotkeys Plugin
                     // ---------------------------------------------------------
                     if (hotKeysPlugin !== undefined && hotKeysPlugin.enabled && videojsPlayer.hotKeys !== undefined) {
 
@@ -479,7 +491,7 @@
 
                     } // END if hotKeysPlugin enabled
 
-                    // add skipButtons Plugin, only available for VideoJS
+                    // add skipButtons Plugin
                     // ---------------------------------------------------------
                     if (skipButtonsPlugin !== undefined && skipButtonsPlugin.enabled && videojsPlayer.skipButtons !== undefined) {
                         // merge objects
@@ -502,7 +514,7 @@
 
                     } // END if skipButtons Plugin enabled
 
-                    // add zoom Plugin (only available for VJS|local video/mp4)
+                    // add zoom Plugin (only available for video/mp4
                     // ---------------------------------------------------------
                     if (videoInfo.youtube) {
                         // zoom pluging NOT supported for YouTube
@@ -530,10 +542,10 @@
 
                     } // END if zoom Plugin enabled
 
-
-                    // chapter track processing, only available for VideoJS
+                    // chapter track processing
                     // ---------------------------------------------------------
-                    if (vjsObject.core.galleryItems[vjsObject.core.index].video !== undefined) {
+                    var tracksEnabled = vjsObject.settings.videojsOptions.tracks;
+                    if (tracksEnabled && vjsObject.core.galleryItems[vjsObject.core.index].video !== undefined) {
                         videoData = JSON.parse(vjsObject.core.galleryItems[vjsObject.core.index].video);
                         videojsPlayer.videoData = videoData;
 
@@ -548,65 +560,89 @@
                             j1.modules.videojs.data.players[playerId]['videoData'] = {};
                             j1.modules.videojs.data.players[playerId].videoData['tracks'] = videoData.tracks || [];
                         }    
-                    }
-
-                    // load source file for chapter tracks
-                    // ---------------------------------------------------------
-                    var chapterTracksSrc;
-                    for (var i=0; i<videojsPlayer.videoData.tracks.length; i++) {
-                        if (videojsPlayer.videoData.tracks[i].kind == 'chapters') {
-                            chapterTracksSrc = videojsPlayer.videoData.tracks[i].src;
-                            videojsPlayer.chapterTracksSource  = chapterTracksSrc;
-                        }
-                    }
-
-                    // process chapter tracks
-                    if (j1.modules.videojs.data.players[playerId].videoData.tracks.length) {
-                        playerId = videojsPlayer.id();
-                        timeline = $(videojsPlayer.controlBar.progressControl.children_[0].el_);
-
-                        removeChapterMarkers(timeline, playerId);
-
-                        // add chapter tracks when playing alreay (e.g. autoplay)
-                        // -----------------------------------------------------                        
-                        if (isPlaying(videojsPlayer)) {
-                            addChapterMarkers(videojsPlayer) 
-                        } // END if VideoJS player isPlaying
 
-                        // jadams, 2025-06-22: prepare settting start position
-                        // TODO: coding is to be continued 
+                        // load source file for chapter tracks
                         // -----------------------------------------------------
-                        // videojsPlayer.currentTime(videoStart);
-
-                        // remove chapter tracks on event 'pause'
-                        // -----------------------------------------------------
-                        videojsPlayer.on("pause", function() {
-                            var timeline = $(videojsPlayer.controlBar.progressControl.children_[0].el_);
-
-                            removeChapterMarkers(timeline, videojsPlayer.id());
-                        }); // END on event 'pause'
+                        var chapterTracksSrc;
+                        for (var i=0; i<videojsPlayer.videoData.tracks.length; i++) {
+                            if (videojsPlayer.videoData.tracks[i].kind == 'captions') {
+                                videojsPlayer.captionTracks = videojsPlayer.videoData.tracks[i];
+                            }
+                            if (videojsPlayer.videoData.tracks[i].kind == 'chapters') {
+                                chapterTracksSrc = videojsPlayer.videoData.tracks[i].src;
+                                videojsPlayer.chapterTracks  = videojsPlayer.videoData.tracks[i];
+                                videojsPlayer.chapterTracksSource  = chapterTracksSrc;
+                            }                            
+                        }
 
-                        // add chapter tracks on event 'play'
+                        // process chapter tracks
                         // -----------------------------------------------------
-                        videojsPlayer.on("play", function() {
-                            addChapterMarkers(videojsPlayer) 
-                        }); // END on event 'play'
+                        if (j1.modules.videojs.data.players[playerId].videoData.tracks.length) {
+                            
+                            playerId = videojsPlayer.id();
+                            timeline = $(videojsPlayer.controlBar.progressControl.children_[0].el_);
+                            removeChapterMarkers(timeline, playerId);
+
+                            // add chapter markers when playing (e.g. autoplay)
+                            // -------------------------------------------------
+                            if (isPlaying(videojsPlayer)) {
+                                addChapterMarkers(videojsPlayer);
+                            } // END if VideoJS player isPlaying
+
+                            // jadams, 2025-06-22: prepare processing start position
+                            // TODO: coding is to be continued 
+                            // -------------------------------------------------
+                            // videojsPlayer.currentTime(videoStart);
+
+                            // remove chapter markers on event 'pause'
+                            // TODO: should be confifurable
+                            // -------------------------------------------------
+                            // videojsPlayer.on("pause", function() {
+                            //     var timeline = $(videojsPlayer.controlBar.progressControl.children_[0].el_);
+                            //     removeChapterMarkers(timeline, videojsPlayer.id());
+                            // }); // END on event 'pause'
+
+                            // add chapter tracks on event 'play'
+                            // TODO: should be configurable
+                            // -------------------------------------------------
+                            videojsPlayer.on("play", function() {
+                                addChapterMarkers(videojsPlayer) 
+                            }); // END on event 'play'
+
+                            // failsafe: remove chapter markers on player destroyed
+                            // TODO: should be configurable
+                            // -------------------------------------------------
+                            // videojsPlayer.on("dispose", function() {
+                            //     var timeline = $(videojsPlayer.controlBar.progressControl.children_[0].el_);
+                            //     removeChapterMarkers(timeline, videojsPlayer.id());
+                            // });
+
+                            // add tracks and buttons
+                            // -------------------------------------------------
+                            videojsPlayer.addRemoteTextTrack(videojsPlayer.captionTracks);
+                            videojsPlayer.addRemoteTextTrack(videojsPlayer.chapterTracks);
+
+                            // enable 'english' caption tracks
+                            // -------------------------------------------------
+                            textTracks = videojsPlayer.textTracks();
+                            for (var i = 0; i < textTracks.length; i++) {
+                                var track = textTracks[i];
+                                if (track.kind === 'captions' && track.language === 'en') {
+                                    track.mode = 'showing';     // enable
+                                } else {
+                                    track.mode = 'disabled';    // disable other
+                                }
+                            }                            
 
-                        // failsafe: remove chapter markers on the player removed||destroyed
-                        videojsPlayer.on("dispose", function() {
+                        } else {
+                            // remove existing chapter markers if NO tracks enabled
+                            // -------------------------------------------------
+                            var playerId = videojsPlayer.id();
                             var timeline = $(videojsPlayer.controlBar.progressControl.children_[0].el_);
+                            removeChapterMarkers(timeline, playerId);                        
+                        } // END if chapterTracks enabled
 
-                            // remove already existing markers for the  player destroyed
-                            removeChapterMarkers(timeline, videojsPlayer.id());
-                        });
-
-                    } else {
-                        // remove existing chapter markers if NO tracks enabled
-                        var timeline = $(videojsPlayer.controlBar.progressControl.children_[0].el_);
-                        var playerId = videojsPlayer.id();
-
-                        removeChapterMarkers(timeline, playerId);                        
-                    } // END if chapterTracks enabled
+                    } // END if tracksEnabled
 
                 } // END if videojsOptions
 
@@ -818,7 +854,8 @@
                 <source
                   type="video/youtube",
                   src="//youtube.com/watch?v=${ytVideoID}"
-                >
+                >,
+                <tracks>
 
                 Your browser does not support HTML5 video.
               </video>