Merge pull request #3046 from dmitrylyzo/fix-playback-error-stop

Fix playback error stop

src/components/alert.js

@@ -1,4 +1,4 @@
-
+import { appRouter } from './appRouter';
 import browser from '../scripts/browser';
 import dialog from './dialog/dialog';
 import globalize from '../scripts/globalize';
@@ -10,7 +10,7 @@ import globalize from '../scripts/globalize';
         return originalString.replace(reg, strWith);
     }
 
-    export default function (text, title) {
+    export default async function (text, title) {
         let options;
         if (typeof text === 'string') {
             options = {
@@ -22,7 +22,9 @@ import globalize from '../scripts/globalize';
         }
 
         if (browser.tv && window.alert) {
+            await appRouter.ready();
             alert(replaceAll(options.text || '', '<br/>', '\n'));
+            return Promise.resolve();
         } else {
             const items = [];
 
@@ -35,8 +37,6 @@ import globalize from '../scripts/globalize';
             options.buttons = items;
             return dialog.show(options);
         }
-
-        return Promise.resolve();
     }
 
 /* eslint-enable indent */

src/components/appRouter.js

@@ -24,6 +24,7 @@ class AppRouter {
     isDummyBackToHome;
     msgTimeout;
     popstateOccurred = false;
+    promiseShow;
     resolveOnNextShow;
     previousRoute = {};
     /**
@@ -122,11 +123,24 @@ class AppRouter {
         }
     }
 
-    back() {
+    ready() {
-        page.back();
+        return this.promiseShow || Promise.resolve();
     }
 
-    show(path, options) {
+    async back() {
+        if (this.promiseShow) await this.promiseShow;
+
+        this.promiseShow = new Promise((resolve) => {
+            this.resolveOnNextShow = resolve;
+            page.back();
+        });
+
+        return this.promiseShow;
+    }
+
+    async show(path, options) {
+        if (this.promiseShow) await this.promiseShow;
+
         // ensure the path does not start with '#!' since the router adds this
         if (path.startsWith('#!')) {
             path = path.substring(2);
@@ -146,17 +160,25 @@ class AppRouter {
             }
         }
 
-        return new Promise((resolve) => {
+        this.promiseShow = new Promise((resolve) => {
             this.resolveOnNextShow = resolve;
-            page.show(path, options);
+            // Schedule a call to return the promise
+            setTimeout(() => page.show(path, options), 0);
         });
+
+        return this.promiseShow;
     }
 
-    showDirect(path) {
+    async showDirect(path) {
-        return new Promise(function(resolve) {
+        if (this.promiseShow) await this.promiseShow;
+
+        this.promiseShow = new Promise((resolve) => {
             this.resolveOnNextShow = resolve;
-            page.show(this.baseUrl() + path);
+            // Schedule a call to return the promise
+            setTimeout(() => page.show(this.baseUrl() + path), 0);
         });
+
+        return this.promiseShow;
     }
 
     start(options) {
@@ -414,6 +436,7 @@ class AppRouter {
     onViewShow() {
         const resolve = this.resolveOnNextShow;
         if (resolve) {
+            this.promiseShow = null;
             this.resolveOnNextShow = null;
             resolve();
         }

src/components/confirm/confirm.js

@@ -1,3 +1,4 @@
+import { appRouter } from '../appRouter';
 import browser from '../../scripts/browser';
 import dialog from '../dialog/dialog';
 import globalize from '../../scripts/globalize';
@@ -6,7 +7,7 @@ function replaceAll(str, find, replace) {
     return str.split(find).join(replace);
 }
 
-function nativeConfirm(options) {
+async function nativeConfirm(options) {
     if (typeof options === 'string') {
         options = {
             title: '',
@@ -15,6 +16,7 @@ function nativeConfirm(options) {
     }
 
     const text = replaceAll(options.text || '', '<br/>', '\n');
+    await appRouter.ready();
     const result = window.confirm(text);
 
     if (result) {

src/components/dialogHelper/dialogHelper.js

@@ -184,7 +184,9 @@ import '../../assets/css/scrollstyles.scss';
         return dlg.getAttribute('data-history') === 'true';
     }
 
-    export function open(dlg) {
+    export async function open(dlg) {
+        await appRouter.ready();
+
         if (globalOnOpenCallback) {
             globalOnOpenCallback(dlg);
         }

src/components/htmlMediaHelper.js

@@ -185,6 +185,12 @@ import { Events } from 'jellyfin-apiclient';
         return Promise.resolve();
     }
 
+    export function resetSrc(elem) {
+        elem.src = '';
+        elem.innerHTML = '';
+        elem.removeAttribute('src');
+    }
+
     function onSuccessfulPlay(elem, onErrorFn) {
         elem.addEventListener('error', onErrorFn);
     }
@@ -344,9 +350,7 @@ import { Events } from 'jellyfin-apiclient';
     export function onEndedInternal(instance, elem, onErrorFn) {
         elem.removeEventListener('error', onErrorFn);
 
-        elem.src = '';
+        resetSrc(elem);
-        elem.innerHTML = '';
-        elem.removeAttribute('src');
 
         destroyHlsPlayer(instance);
         destroyFlvPlayer(instance);

src/components/playback/playbackmanager.js

@@ -3064,7 +3064,9 @@ class PlaybackManager {
             const data = getPlayerData(player);
             const streamInfo = data.streamInfo;
 
-            const nextItem = self._playNextAfterEnded ? self._playQueueManager.getNextItemInfo() : null;
+            const errorOccurred = displayErrorCode && typeof (displayErrorCode) === 'string';
+
+            const nextItem = self._playNextAfterEnded && !errorOccurred ? self._playQueueManager.getNextItemInfo() : null;
 
             const nextMediaType = (nextItem ? nextItem.item.MediaType : null);
 
@@ -3101,17 +3103,15 @@ class PlaybackManager {
             const newPlayer = nextItem ? getPlayer(nextItem.item, nextItemPlayOptions) : null;
 
             if (newPlayer !== player) {
+                data.streamInfo = null;
                 destroyPlayer(player);
                 removeCurrentPlayer(player);
             }
 
-            if (displayErrorCode && typeof (displayErrorCode) === 'string') {
+            if (errorOccurred) {
                 showPlaybackInfoErrorMessage(self, 'PlaybackError' + displayErrorCode);
             } else if (nextItem) {
                 self.nextTrack();
-            } else {
-                // Nothing more to play - clear data
-                data.streamInfo = null;
             }
         }
 

src/plugins/htmlAudioPlayer/plugin.js

@@ -105,8 +105,6 @@ class HtmlAudioPlayer {
         };
 
         function setCurrentSrc(elem, options) {
-            elem.removeEventListener('error', onError);
-
             unBindEvents(elem);
             bindEvents(elem);
 
@@ -184,6 +182,7 @@ class HtmlAudioPlayer {
             elem.removeEventListener('playing', onPlaying);
             elem.removeEventListener('play', onPlay);
             elem.removeEventListener('waiting', onWaiting);
+            elem.removeEventListener('error', onError); // bound in htmlMediaHelper
         }
 
         self.stop = function (destroyPlayer) {
@@ -222,6 +221,7 @@ class HtmlAudioPlayer {
 
         self.destroy = function () {
             unBindEvents(self._mediaElement);
+            htmlMediaHelper.resetSrc(self._mediaElement);
         };
 
         function createMediaElement() {

src/plugins/htmlVideoPlayer/plugin.js

@@ -13,6 +13,7 @@ import {
     getCrossOriginValue,
     enableHlsJsPlayer,
     applySrc,
+    resetSrc,
     playWithPromise,
     onEndedInternal,
     saveVolume,
@@ -708,6 +709,9 @@ function tryRemoveElement(elem) {
                 videoElement.removeEventListener('click', this.onClick);
                 videoElement.removeEventListener('dblclick', this.onDblClick);
                 videoElement.removeEventListener('waiting', this.onWaiting);
+                videoElement.removeEventListener('error', this.onError); // bound in htmlMediaHelper
+
+                resetSrc(videoElement);
 
                 videoElement.parentNode.removeChild(videoElement);
             }