update edge playback

dashboard-ui/scripts/htmlmediarenderer.js

@@ -5,6 +5,7 @@
     var requiresSettingStartTimeOnStart;
     var subtitleTrackIndexToSetOnPlaying;
     var currentTrackList;
+    var currentPlayOptions;
 
     function htmlMediaRenderer(options) {
 
@@ -32,6 +33,13 @@
             //        }
             //    }
             //}
+
+            if (options.type == 'video') {
+                // Get the player position + the transcoding offset
+                var timeMs = this.currentTime * 1000;
+                timeMs += ((currentPlayOptions.startTimeTicksOffset || 0) / 10000);
+                updateSubtitleText(timeMs);
+            }
             Events.trigger(self, 'timeupdate');
         }
 
@@ -325,9 +333,12 @@
 
             if (!elem) {
                 currentSrc = null;
+                currentPlayOptions = null;
                 return;
             }
 
+            currentPlayOptions = streamInfo;
+
             if (!streamInfo) {
                 currentSrc = null;
                 elem.src = null;
@@ -517,6 +528,10 @@
                 return false;
             }
 
+            if (browserInfo.edge || browserInfo.msie) {
+                return false;
+            }
+
             if (browserInfo.firefox) {
                 if ((currentSrc || '').toLowerCase().indexOf('.m3u8') != -1) {
                     return false;
@@ -528,6 +543,13 @@
 
         function destroyCustomTrack(isPlaying) {
 
+            //window.removeEventListener('resize', onVideoResize);
+
+            var videoSubtitlesElem = document.querySelector('.videoSubtitles');
+            if (videoSubtitlesElem) {
+                videoSubtitlesElem.parentNode.removeChild(videoSubtitlesElem);
+            }
+
             if (isPlaying) {
 
                 var allTracks = mediaElement.textTracks; // get list of tracks
@@ -542,6 +564,15 @@
             }
 
             customTrackIndex = -1;
+            currentSubtitlesElement = null;
+            currentTrackEvents = null;
+            currentClock = null;
+
+            var renderer = currentAssRenderer;
+            if (renderer) {
+                renderer.setEnabled(false);
+            }
+            currentAssRenderer = null;
         }
 
         function fetchSubtitles(track) {
@@ -553,8 +584,6 @@
             });
         }
 
-        var customTrackIndex = -1;
-
         function setTrackForCustomDisplay(track) {
 
             if (!track) {
@@ -570,10 +599,18 @@
             destroyCustomTrack(true);
             customTrackIndex = track.index;
             renderTracksEvents(track);
+            lastCustomTrackMs = 0;
         }
 
         function renderTracksEvents(track) {
 
+            if (browserInfo.edge || browserInfo.msie) {
+                fetchSubtitles(track).then(function (data) {
+                    currentTrackEvents = data.TrackEvents;
+                });
+                return;
+            }
+
             var trackElement = null;
             var expectedId = 'manualTrack' + track.index;
 
@@ -602,7 +639,7 @@
                     // add some cues to show the text
                     // in safari, the cues need to be added before setting the track mode to showing
                     data.TrackEvents.forEach(function (trackEvent) {
-                        trackElement.addCue(new VTTCue(trackEvent.StartPositionTicks / 10000000, trackEvent.EndPositionTicks / 10000000, trackEvent.Text.replace(/\\N/gi, '\n')));
+                        trackElement.addCue(new (window.VTTCue || window.TextTrackCue)(trackEvent.StartPositionTicks / 10000000, trackEvent.EndPositionTicks / 10000000, trackEvent.Text.replace(/\\N/gi, '\n')));
                     });
                     trackElement.mode = 'showing';
                 });
@@ -611,6 +648,58 @@
             }
         }
 
+        var currentSubtitlesElement;
+        var currentTrackEvents;
+        var customTrackIndex = -1;
+        var lastCustomTrackMs = 0;
+        var currentClock;
+        var currentAssRenderer;
+        function updateSubtitleText(timeMs) {
+
+            //var clock = currentClock;
+            //if (clock) {
+            //    clock.seek(timeMs / 1000);
+            //}
+
+            var trackEvents = currentTrackEvents;
+            if (!trackEvents) {
+                return;
+            }
+
+            if (!currentSubtitlesElement) {
+                var videoSubtitlesElem = document.querySelector('.videoSubtitles');
+                if (!videoSubtitlesElem) {
+                    videoSubtitlesElem = document.createElement('div');
+                    videoSubtitlesElem.classList.add('videoSubtitles');
+                    videoSubtitlesElem.innerHTML = '<div class="videoSubtitlesInner"></div>';
+                    document.body.appendChild(videoSubtitlesElem);
+                }
+                currentSubtitlesElement = videoSubtitlesElem.querySelector('.videoSubtitlesInner');
+            }
+
+            if (lastCustomTrackMs > 0) {
+                if (Math.abs(lastCustomTrackMs - timeMs) < 500) {
+                    return;
+                }
+            }
+
+            lastCustomTrackMs = new Date().getTime();
+
+            var positionTicks = timeMs * 10000;
+            for (var i = 0, length = trackEvents.length; i < length; i++) {
+
+                var caption = trackEvents[i];
+                if (positionTicks >= caption.StartPositionTicks && positionTicks <= caption.EndPositionTicks) {
+                    currentSubtitlesElement.innerHTML = caption.Text;
+                    currentSubtitlesElement.classList.remove('hide');
+                    return;
+                }
+            }
+
+            currentSubtitlesElement.innerHTML = '';
+            currentSubtitlesElement.classList.add('hide');
+        }
+
         self.setCurrentTrackElement = function (streamIndex) {
 
             console.log('Setting new text track index to: ' + streamIndex);