1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

Backport pull request #5898 from jellyfin-web/release-10.9.z

Fix autoCast race condition

Original-merge: 7f575d724e

Merged-by: thornbill <thornbill@users.noreply.github.com>

Backported-by: thornbill <thornbill@users.noreply.github.com>
This commit is contained in:
thornbill 2024-08-13 11:53:23 -04:00
parent 75d78a96b8
commit 37fbfb3772
4 changed files with 26 additions and 39 deletions

View file

@ -12,7 +12,7 @@ import { playbackManager } from 'components/playback/playbackmanager';
import React, { FC, useCallback, useState } from 'react'; import React, { FC, useCallback, useState } from 'react';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { enable, isEnabled, supported } from 'scripts/autocast'; import { enable, isEnabled } from 'scripts/autocast';
import globalize from 'scripts/globalize'; import globalize from 'scripts/globalize';
interface RemotePlayActiveMenuProps extends MenuProps { interface RemotePlayActiveMenuProps extends MenuProps {
@ -43,11 +43,10 @@ const RemotePlayActiveMenu: FC<RemotePlayActiveMenuProps> = ({
}, [ isDisplayMirrorEnabled, setIsDisplayMirrorEnabled ]); }, [ isDisplayMirrorEnabled, setIsDisplayMirrorEnabled ]);
const [ isAutoCastEnabled, setIsAutoCastEnabled ] = useState(isEnabled()); const [ isAutoCastEnabled, setIsAutoCastEnabled ] = useState(isEnabled());
const isAutoCastSupported = supported();
const toggleAutoCast = useCallback(() => { const toggleAutoCast = useCallback(() => {
enable(!isAutoCastEnabled); enable(!isAutoCastEnabled);
setIsAutoCastEnabled(!isAutoCastEnabled); setIsAutoCastEnabled(!isAutoCastEnabled);
}, [ isAutoCastEnabled, setIsAutoCastEnabled ]); }, [ isAutoCastEnabled ]);
const remotePlayerName = playerInfo?.deviceName || playerInfo?.name; const remotePlayerName = playerInfo?.deviceName || playerInfo?.name;
@ -117,20 +116,18 @@ const RemotePlayActiveMenu: FC<RemotePlayActiveMenuProps> = ({
</MenuItem> </MenuItem>
)} )}
{isAutoCastSupported && ( <MenuItem onClick={toggleAutoCast}>
<MenuItem onClick={toggleAutoCast}> {isAutoCastEnabled && (
{isAutoCastEnabled && ( <ListItemIcon>
<ListItemIcon> <Check />
<Check /> </ListItemIcon>
</ListItemIcon> )}
)} <ListItemText inset={!isAutoCastEnabled}>
<ListItemText inset={!isAutoCastEnabled}> {globalize.translate('EnableAutoCast')}
{globalize.translate('EnableAutoCast')} </ListItemText>
</ListItemText> </MenuItem>
</MenuItem>
)}
{(isDisplayMirrorSupported || isAutoCastSupported) && <Divider />} <Divider />
<MenuItem <MenuItem
component={Link} component={Link}

View file

@ -6,7 +6,7 @@ import { pluginManager } from '../pluginManager';
import { appRouter } from '../router/appRouter'; import { appRouter } from '../router/appRouter';
import globalize from '../../scripts/globalize'; import globalize from '../../scripts/globalize';
import { appHost } from '../apphost'; import { appHost } from '../apphost';
import { enable, isEnabled, supported } from '../../scripts/autocast'; import { enable, isEnabled } from '../../scripts/autocast';
import '../../elements/emby-checkbox/emby-checkbox'; import '../../elements/emby-checkbox/emby-checkbox';
import '../../elements/emby-button/emby-button'; import '../../elements/emby-button/emby-button';
import dialog from '../dialog/dialog'; import dialog from '../dialog/dialog';
@ -200,13 +200,11 @@ function showActivePlayerMenuInternal(playerInfo) {
html += '</div>'; html += '</div>';
if (supported()) { html += '<div><label class="checkboxContainer">';
html += '<div><label class="checkboxContainer">'; const checkedHtmlAC = isEnabled() ? ' checked' : '';
const checkedHtmlAC = isEnabled() ? ' checked' : ''; html += '<input type="checkbox" is="emby-checkbox" class="chkAutoCast"' + checkedHtmlAC + '/>';
html += '<input type="checkbox" is="emby-checkbox" class="chkAutoCast"' + checkedHtmlAC + '/>'; html += '<span>' + globalize.translate('EnableAutoCast') + '</span>';
html += '<span>' + globalize.translate('EnableAutoCast') + '</span>'; html += '</label></div>';
html += '</label></div>';
}
html += '<div style="margin-top:1em;display:flex;justify-content: flex-end;">'; html += '<div style="margin-top:1em;display:flex;justify-content: flex-end;">';

View file

@ -24,6 +24,7 @@ import packageManager from './components/packageManager';
import './components/playback/displayMirrorManager.ts'; import './components/playback/displayMirrorManager.ts';
import { appRouter } from './components/router/appRouter'; import { appRouter } from './components/router/appRouter';
import './elements/emby-button/emby-button'; import './elements/emby-button/emby-button';
import { initialize as initializeAutoCast } from 'scripts/autocast';
import './scripts/autoThemes'; import './scripts/autoThemes';
import './components/themeMediaPlayer'; import './components/themeMediaPlayer';
import { pageClassOn, serverAddress } from './utils/dashboard'; import { pageClassOn, serverAddress } from './utils/dashboard';
@ -79,6 +80,8 @@ build: ${__JF_BUILD_VERSION__}`);
}).then(() => { }).then(() => {
console.debug('initAfterDependencies promises resolved'); console.debug('initAfterDependencies promises resolved');
initializeAutoCast(ServerConnections.currentApiClient());
loadCoreDictionary().then(function () { loadCoreDictionary().then(function () {
onGlobalizeInit(); onGlobalizeInit();
}); });

View file

@ -1,14 +1,7 @@
import { playbackManager } from '../components/playback/playbackmanager'; import { playbackManager } from '../components/playback/playbackmanager';
import ServerConnections from '../components/ServerConnections';
import Events from '../utils/events.ts'; import Events from '../utils/events.ts';
export function supported() {
return typeof(Storage) !== 'undefined';
}
export function enable(enabled) { export function enable(enabled) {
if (!supported()) return;
if (enabled) { if (enabled) {
const currentPlayerInfo = playbackManager.getPlayerInfo(); const currentPlayerInfo = playbackManager.getPlayerInfo();
@ -21,8 +14,6 @@ export function enable(enabled) {
} }
export function isEnabled() { export function isEnabled() {
if (!supported()) return false;
const playerId = localStorage.getItem('autocastPlayerId'); const playerId = localStorage.getItem('autocastPlayerId');
const currentPlayerInfo = playbackManager.getPlayerInfo(); const currentPlayerInfo = playbackManager.getPlayerInfo();
@ -42,12 +33,10 @@ function onOpen() {
}); });
} }
try { export function initialize(apiClient) {
const apiClient = ServerConnections.currentApiClient(); if (apiClient) {
if (apiClient && supported()) {
Events.on(apiClient, 'websocketopen', onOpen); Events.on(apiClient, 'websocketopen', onOpen);
} else {
console.warn('[autoCast] cannot initialize missing apiClient');
} }
} catch (ex) {
console.warn('Could not get current apiClient', ex);
} }