update
This commit is contained in:
parent
326f1cceee
commit
4b54e359c1
@ -43,6 +43,10 @@ html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
body.unlocalized {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--primary);
|
||||
color: var(--text-primary);
|
||||
|
@ -399,6 +399,20 @@ body.miniplayer-active #musicPlayerContainer {
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
@keyframes spin-song {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
.song-item .loading-spinner {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border: 2px solid var(--text-secondary);
|
||||
border-top-color: var(--accent);
|
||||
border-radius: 50%;
|
||||
animation: spin-song 0.8s linear infinite;
|
||||
}
|
||||
.song-item:hover .play-icon,
|
||||
.song-item.current-song .play-icon {
|
||||
opacity: 1;
|
||||
|
@ -34,6 +34,7 @@ function localizeHtmlPage() {
|
||||
|
||||
document.documentElement.lang = chrome.i18n.getUILanguage().split('-')[0];
|
||||
document.title = document.title.replace(i18nRegex, replaceMsg);
|
||||
document.body.classList.remove('unlocalized');
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', localizeHtmlPage);
|
@ -509,6 +509,13 @@ export class MusicPlayer {
|
||||
playSong(cancion, index) {
|
||||
if (!this.isReady || !this.audioPlayer || !cancion || !cancion.url) return;
|
||||
|
||||
const songItemElement = document.querySelector(`.song-item[data-index='${index}']`);
|
||||
const playIconElement = songItemElement ? songItemElement.querySelector('.play-icon') : null;
|
||||
|
||||
if (playIconElement) {
|
||||
playIconElement.className = 'loading-spinner';
|
||||
}
|
||||
|
||||
const miniplayer = document.getElementById('miniplayer');
|
||||
if (miniplayer.style.display === 'none') {
|
||||
gsap.fromTo(miniplayer, { y: '100%' }, { display: 'grid', y: '0%', duration: 0.5, ease: 'power3.out' });
|
||||
@ -539,8 +546,14 @@ export class MusicPlayer {
|
||||
this.currentSongArtistId = cancion.artistId;
|
||||
this.markCurrentSong();
|
||||
this.markCurrentArtist(cancion.artistId);
|
||||
if (playIconElement) {
|
||||
playIconElement.className = 'fas fa-play play-icon';
|
||||
}
|
||||
}).catch((error) => {
|
||||
this.handleAudioError(_('playbackError'));
|
||||
if (playIconElement) {
|
||||
playIconElement.className = 'fas fa-play play-icon';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -15,7 +15,7 @@
|
||||
<link rel="stylesheet" href="css/photos.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<body class="unlocalized">
|
||||
<div id="particles-js"></div>
|
||||
|
||||
<header class="top-bar">
|
||||
@ -308,7 +308,7 @@
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="appLanguage" class="form-label">__MSG_settingsTmdbLangLabel__</label>
|
||||
<select class="form-control" id="appLanguage">
|
||||
<select class="form-control filter-select" id="appLanguage">
|
||||
<option value="es">__MSG_lang_es__</option>
|
||||
<option value="en">__MSG_lang_en__</option>
|
||||
<option value="fr">__MSG_lang_fr__</option>
|
||||
|
Loading…
x
Reference in New Issue
Block a user