This commit is contained in:
Filipinos 2025-07-04 10:04:57 +02:00
parent 326f1cceee
commit 4b54e359c1
5 changed files with 34 additions and 2 deletions

View File

@ -43,6 +43,10 @@ html {
scroll-behavior: smooth;
}
body.unlocalized {
visibility: hidden;
}
body {
background-color: var(--primary);
color: var(--text-primary);

View File

@ -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;

View File

@ -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);

View File

@ -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';
}
});
}

View File

@ -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>