Backport pull request #3877 from jellyfin/release-10.8.z

Fix itemcontextmenu fails to update for items with no image metadata

Original-merge: 72d538e902

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

Backported-by: Joshua M. Boniface <joshua@boniface.me>
This commit is contained in:
callum 2022-09-24 00:00:13 -04:00 committed by Joshua M. Boniface
parent 98d6c823e8
commit ea2498a0dd

View File

@ -24,6 +24,7 @@ import { appRouter } from '../appRouter';
let currentTimeElement; let currentTimeElement;
let nowPlayingImageElement; let nowPlayingImageElement;
let nowPlayingImageUrl;
let nowPlayingTextElement; let nowPlayingTextElement;
let nowPlayingUserData; let nowPlayingUserData;
let muteButton; let muteButton;
@ -488,7 +489,6 @@ import { appRouter } from '../appRouter';
return null; return null;
} }
let currentImgUrl;
function updateNowPlayingInfo(state) { function updateNowPlayingInfo(state) {
const nowPlayingItem = state.NowPlayingItem; const nowPlayingItem = state.NowPlayingItem;
@ -524,17 +524,14 @@ import { appRouter } from '../appRouter';
height: imgHeight height: imgHeight
})) : null; })) : null;
let isRefreshing = false; if (url !== nowPlayingImageUrl) {
if (url !== currentImgUrl) {
currentImgUrl = url;
isRefreshing = true;
if (url) { if (url) {
imageLoader.lazyImage(nowPlayingImageElement, url); nowPlayingImageUrl = url;
imageLoader.lazyImage(nowPlayingImageElement, nowPlayingImageUrl);
nowPlayingImageElement.style.display = null; nowPlayingImageElement.style.display = null;
nowPlayingTextElement.style.marginLeft = null; nowPlayingTextElement.style.marginLeft = null;
} else { } else {
nowPlayingImageUrl = null;
nowPlayingImageElement.style.backgroundImage = ''; nowPlayingImageElement.style.backgroundImage = '';
nowPlayingImageElement.style.display = 'none'; nowPlayingImageElement.style.display = 'none';
nowPlayingTextElement.style.marginLeft = '1em'; nowPlayingTextElement.style.marginLeft = '1em';
@ -542,36 +539,34 @@ import { appRouter } from '../appRouter';
} }
if (nowPlayingItem.Id) { if (nowPlayingItem.Id) {
if (isRefreshing) { const apiClient = ServerConnections.getApiClient(nowPlayingItem.ServerId);
const apiClient = ServerConnections.getApiClient(nowPlayingItem.ServerId); apiClient.getItem(apiClient.getCurrentUserId(), nowPlayingItem.Id).then(function (item) {
apiClient.getItem(apiClient.getCurrentUserId(), nowPlayingItem.Id).then(function (item) { const userData = item.UserData || {};
const userData = item.UserData || {}; const likes = userData.Likes == null ? '' : userData.Likes;
const likes = userData.Likes == null ? '' : userData.Likes; if (!layoutManager.mobile) {
if (!layoutManager.mobile) { let contextButton = nowPlayingBarElement.querySelector('.btnToggleContextMenu');
let contextButton = nowPlayingBarElement.querySelector('.btnToggleContextMenu'); // We remove the previous event listener by replacing the item in each update event
// We remove the previous event listener by replacing the item in each update event const contextButtonClone = contextButton.cloneNode(true);
const contextButtonClone = contextButton.cloneNode(true); contextButton.parentNode.replaceChild(contextButtonClone, contextButton);
contextButton.parentNode.replaceChild(contextButtonClone, contextButton); contextButton = nowPlayingBarElement.querySelector('.btnToggleContextMenu');
contextButton = nowPlayingBarElement.querySelector('.btnToggleContextMenu'); const options = {
const options = { play: false,
play: false, queue: false,
queue: false, stopPlayback: true,
stopPlayback: true, clearQueue: true,
clearQueue: true, positionTo: contextButton
positionTo: contextButton };
}; apiClient.getCurrentUser().then(function (user) {
apiClient.getCurrentUser().then(function (user) { contextButton.addEventListener('click', function () {
contextButton.addEventListener('click', function () { itemContextMenu.show(Object.assign({
itemContextMenu.show(Object.assign({ item: item,
item: item, user: user
user: user }, options));
}, options));
});
}); });
} });
nowPlayingUserData.innerHTML = '<button is="emby-ratingbutton" type="button" class="listItemButton mediaButton paper-icon-button-light" data-id="' + item.Id + '" data-serverid="' + item.ServerId + '" data-itemtype="' + item.Type + '" data-likes="' + likes + '" data-isfavorite="' + (userData.IsFavorite) + '"><span class="material-icons favorite" aria-hidden="true"></span></button>'; }
}); nowPlayingUserData.innerHTML = '<button is="emby-ratingbutton" type="button" class="listItemButton mediaButton paper-icon-button-light" data-id="' + item.Id + '" data-serverid="' + item.ServerId + '" data-itemtype="' + item.Type + '" data-likes="' + likes + '" data-isfavorite="' + (userData.IsFavorite) + '"><span class="material-icons favorite" aria-hidden="true"></span></button>';
} });
} else { } else {
nowPlayingUserData.innerHTML = ''; nowPlayingUserData.innerHTML = '';
} }