Add Auto Cast Feature

package.json

@@ -329,6 +329,7 @@
           "src/plugins/youtubePlayer/plugin.js",
           "src/scripts/alphanumericshortcuts.js",
           "src/scripts/autoBackdrops.js",
+          "src/scripts/autocast.js",
           "src/scripts/browser.js",
           "src/scripts/clientUtils.js",
           "src/scripts/datetime.js",

src/components/playback/playerSelectionMenu.js

@@ -6,6 +6,7 @@ import playbackManager from 'playbackManager';
 import appRouter from 'appRouter';
 import globalize from 'globalize';
 import appHost from 'apphost';
+import * as autocast from 'autocast';
 
 function mirrorItem(info, player) {
     var item = info.item;
@@ -221,6 +222,14 @@ function showActivePlayerMenuInternal(dialogHelper, playerInfo) {
 
     html += '</div>';
 
+    if (autocast.supported()) {
+        html += '<div><label class="checkboxContainer">';
+        var checkedHtmlAC = autocast.isEnabled() ? ' checked' : '';
+        html += '<input type="checkbox" is="emby-checkbox" class="chkAutoCast"' + checkedHtmlAC + '/>';
+        html += '<span>' + globalize.translate('EnableAutoCast') + '</span>';
+        html += '</label></div>';
+    }
+
     html += '<div style="margin-top:1em;display:flex;justify-content: flex-end;">';
 
     html += '<button is="emby-button" type="button" class="button-flat btnRemoteControl promptDialogButton">' + globalize.translate('HeaderRemoteControl') + '</button>';
@@ -237,6 +246,12 @@ function showActivePlayerMenuInternal(dialogHelper, playerInfo) {
         chkMirror.addEventListener('change', onMirrorChange);
     }
 
+    var chkAutoCast = dlg.querySelector('.chkAutoCast');
+
+    if (chkAutoCast) {
+        chkAutoCast.addEventListener('change', onAutoCastChange);
+    }
+
     var destination = '';
 
     var btnRemoteControl = dlg.querySelector('.btnRemoteControl');
@@ -269,6 +284,10 @@ function onMirrorChange() {
     playbackManager.enableDisplayMirroring(this.checked);
 }
 
+function onAutoCastChange() {
+    autocast.enable(this.checked);
+}
+
 document.addEventListener('viewshow', function (e) {
     var state = e.detail.state || {};
     var item = state.item;

src/scripts/autocast.js

@@ -0,0 +1,47 @@
+import events from 'events';
+import playbackManager from 'playbackManager';
+
+export function supported() {
+    return typeof(Storage) !== 'undefined';
+}
+
+export function enable(enabled) {
+    if (!supported()) return;
+
+    if (enabled) {
+        const currentPlayerInfo = playbackManager.getPlayerInfo();
+
+        if (currentPlayerInfo && currentPlayerInfo.id) {
+            localStorage.setItem('autocastPlayerId', currentPlayerInfo.id);
+        }
+    } else {
+        localStorage.removeItem('autocastPlayerId');
+    }
+}
+
+export function isEnabled() {
+    if (!supported()) return false;
+
+    const playerId = localStorage.getItem('autocastPlayerId');
+    const currentPlayerInfo = playbackManager.getPlayerInfo();
+
+    return (currentPlayerInfo && playerId && currentPlayerInfo.id === playerId);
+}
+
+function onOpen() {
+    const playerId = localStorage.getItem('autocastPlayerId');
+
+    playbackManager.getTargets().then(function (targets) {
+        for (var i = 0; i < targets.length; i++) {
+            if (targets[i].id == playerId) {
+                playbackManager.trySetActivePlayer(targets[i].playerName, targets[i]);
+                break;
+            }
+        }
+    });
+}
+
+const apiClient = window.connectionManager.currentApiClient();
+if (apiClient && supported()) {
+    events.on(apiClient, 'websocketopen', onOpen);
+}

src/scripts/libraryMenu.js

@@ -52,6 +52,7 @@ import 'flexStyles';
 
         lazyLoadViewMenuBarImages();
         bindMenuEvents();
+        updateCastIcon();
     }
 
     function getCurrentApiClient() {
@@ -996,6 +997,7 @@ import 'flexStyles';
     };
 
     window.LibraryMenu = LibraryMenu;
+    renderHeader();
 
 export default LibraryMenu;
 

src/scripts/site.js

@@ -581,6 +581,7 @@ function initClient() {
         define('webSettings', [scriptsPath + '/settings/webSettings'], returnFirstDependency);
         define('appSettings', [scriptsPath + '/settings/appSettings'], returnFirstDependency);
         define('userSettings', [scriptsPath + '/settings/userSettings'], returnFirstDependency);
+        define('autocast', [scriptsPath + '/autocast'], returnFirstDependency);
 
         define('mediaSession', [componentsPath + '/playback/mediasession'], returnFirstDependency);
         define('actionsheet', [componentsPath + '/actionSheet/actionSheet'], returnFirstDependency);

src/strings/en-us.json

@@ -183,6 +183,7 @@
     "EditImages": "Edit images",
     "EditMetadata": "Edit metadata",
     "EditSubtitles": "Edit subtitles",
+    "EnableAutoCast": "Set as Default",
     "EnableBackdropsHelp": "Display backdrops in the background of some pages while browsing the library.",
     "EnableCinemaMode": "Cinema mode",
     "EnableColorCodedBackgrounds": "Color coded backgrounds",