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

Hide lyrics button when there are no lyrics

Browse source
This commit is contained in:
Bill Thornton 2024-04-30 17:32:16 -04:00
parent 92c02f8d99
commit c95592d6e3
1 changed files with 17 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

51
src/components/nowPlayingBar/nowPlayingBar.js
View file

@ -43,8 +43,7 @@ let currentRuntimeTicks = 0;
let isVisibilityAllowed = true; let isVisibilityAllowed = true;
let lyricPageActive = false; let isLyricPageActive = false;
let isAudio = false;
function getNowPlayingBarHtml() { function getNowPlayingBarHtml() {
let html = ''; let html = '';
@ -86,7 +85,7 @@ function getNowPlayingBarHtml() {
html += `<button is="paper-icon-button-light" class="btnAirPlay mediaButton" title="${globalize.translate('AirPlay')}"><span class="material-icons airplay" aria-hidden="true"></span></button>`; html += `<button is="paper-icon-button-light" class="btnAirPlay mediaButton" title="${globalize.translate('AirPlay')}"><span class="material-icons airplay" aria-hidden="true"></span></button>`;
html += `<button is="paper-icon-button-light" class="openLyricsButton mediaButton" title="${globalize.translate('Lyrics')}"><span class="material-icons lyrics" style="top:0.1em" aria-hidden="true"></span></button>`; html += `<button is="paper-icon-button-light" class="openLyricsButton mediaButton hide" title="${globalize.translate('Lyrics')}"><span class="material-icons lyrics" style="top:0.1em" aria-hidden="true"></span></button>`;
html += `<button is="paper-icon-button-light" class="toggleRepeatButton mediaButton" title="${globalize.translate('Repeat')}"><span class="material-icons repeat" aria-hidden="true"></span></button>`; html += `<button is="paper-icon-button-light" class="toggleRepeatButton mediaButton" title="${globalize.translate('Repeat')}"><span class="material-icons repeat" aria-hidden="true"></span></button>`;
html += `<button is="paper-icon-button-light" class="btnShuffleQueue mediaButton" title="${globalize.translate('Shuffle')}"><span class="material-icons shuffle" aria-hidden="true"></span></button>`; html += `<button is="paper-icon-button-light" class="btnShuffleQueue mediaButton" title="${globalize.translate('Shuffle')}"><span class="material-icons shuffle" aria-hidden="true"></span></button>`;
@ -220,7 +219,7 @@ function bindEvents(elem) {
}); });
lyricButton.addEventListener('click', function() { lyricButton.addEventListener('click', function() {
if (lyricPageActive) { if (isLyricPageActive) {
appRouter.back(); appRouter.back();
} else { } else {
appRouter.show('lyrics'); appRouter.show('lyrics');
@ -303,8 +302,8 @@ function getNowPlayingBar() {
nowPlayingBarElement = parentContainer.querySelector('.nowPlayingBar'); nowPlayingBarElement = parentContainer.querySelector('.nowPlayingBar');
if (layoutManager.mobile) { if (layoutManager.mobile) {
hideButton(nowPlayingBarElement.querySelector('.btnShuffleQueue')); nowPlayingBarElement.querySelector('.btnShuffleQueue').classList.add('hide');
hideButton(nowPlayingBarElement.querySelector('.nowPlayingBarCenter')); nowPlayingBarElement.querySelector('.nowPlayingBarCenter').classList.add('hide');
} }
if (browser.safari && browser.slow) { if (browser.safari && browser.slow) {
@ -319,14 +318,6 @@ function getNowPlayingBar() {
return nowPlayingBarElement; return nowPlayingBarElement;
} }
function showButton(button) {
button.classList.remove('hide');
}
function hideButton(button) {
button.classList.add('hide');
}
function updatePlayPauseState(isPaused) { function updatePlayPauseState(isPaused) {
if (playPauseButtons) { if (playPauseButtons) {
playPauseButtons.forEach((button) => { playPauseButtons.forEach((button) => {
@ -378,7 +369,7 @@ function updatePlayerStateInternal(event, state, player) {
updateTimeDisplay(playState.PositionTicks, nowPlayingItem.RunTimeTicks, playbackManager.getBufferedRanges(player)); updateTimeDisplay(playState.PositionTicks, nowPlayingItem.RunTimeTicks, playbackManager.getBufferedRanges(player));
updateNowPlayingInfo(state); updateNowPlayingInfo(state);
updateLyricButton(); updateLyricButton(nowPlayingItem);
} }
function updateRepeatModeDisplay(repeatMode) { function updateRepeatModeDisplay(repeatMode) {
@ -453,11 +444,7 @@ function updatePlayerVolumeState(isMuted, volumeLevel) {
showVolumeSlider = false; showVolumeSlider = false;
} }
if (showMuteButton) { muteButton.classList.toggle('hide', !showMuteButton);
showButton(muteButton);
} else {
hideButton(muteButton);
}
// See bindEvents for why this is necessary // See bindEvents for why this is necessary
if (volumeSlider) { if (volumeSlider) {
@ -469,20 +456,18 @@ function updatePlayerVolumeState(isMuted, volumeLevel) {
} }
} }
function updateLyricButton() { function updateLyricButton(item) {
if (!isEnabled) { if (!isEnabled) return;
return;
}
isAudio ? showButton(lyricButton) : hideButton(lyricButton); const hasLyrics = !!item && item.Type === 'Audio' && item.HasLyrics;
lyricButton.classList.toggle('hide', !hasLyrics);
setLyricButtonActiveStatus(); setLyricButtonActiveStatus();
} }
function setLyricButtonActiveStatus() { function setLyricButtonActiveStatus() {
if (!isEnabled) { if (!isEnabled) return;
return;
} lyricButton.classList.toggle('buttonActive', isLyricPageActive);
lyricButton.classList.toggle('buttonActive', lyricPageActive);
} }
function seriesImageUrl(item, options) { function seriesImageUrl(item, options) {
@ -628,8 +613,6 @@ function onPlaybackStart(e, state) {
console.debug('nowplaying event: ' + e.type); console.debug('nowplaying event: ' + e.type);
const player = this; const player = this;
isAudio = state.NowPlayingItem?.Type === 'Audio';
onStateChanged.call(player, e, state); onStateChanged.call(player, e, state);
} }
@ -733,7 +716,7 @@ function onStateChanged(event, state) {
} }
getNowPlayingBar(); getNowPlayingBar();
updateLyricButton(); updateLyricButton(state.NowPlayingItem);
updatePlayerStateInternal(event, state, player); updatePlayerStateInternal(event, state, player);
} }
@ -790,7 +773,7 @@ function refreshFromPlayer(player, type) {
} }
function bindToPlayer(player) { function bindToPlayer(player) {
lyricPageActive = appRouter.currentRouteInfo.path.toLowerCase() === '/lyrics'; isLyricPageActive = appRouter.currentRouteInfo.path.toLowerCase() === '/lyrics';
if (player === currentPlayer) { if (player === currentPlayer) {
return; return;
} }
@ -823,7 +806,7 @@ Events.on(playbackManager, 'playerchange', function () {
bindToPlayer(playbackManager.getCurrentPlayer()); bindToPlayer(playbackManager.getCurrentPlayer());
document.addEventListener('viewbeforeshow', function (e) { document.addEventListener('viewbeforeshow', function (e) {
lyricPageActive = appRouter.currentRouteInfo.path.toLowerCase() === '/lyrics'; isLyricPageActive = appRouter.currentRouteInfo.path.toLowerCase() === '/lyrics';
setLyricButtonActiveStatus(); setLyricButtonActiveStatus();
if (!e.detail.options.enableMediaControl) { if (!e.detail.options.enableMediaControl) {
if (isVisibilityAllowed) { if (isVisibilityAllowed) {