miniplayer: fix songs pausing after previous one ends
This commit is contained in:
parent
82f4d4513a
commit
45c1b2b603
1 changed files with 18 additions and 1 deletions
|
|
@ -15,6 +15,8 @@ function initMiniPlayer() {
|
||||||
const trackTitleEl = player.querySelector("track-title");
|
const trackTitleEl = player.querySelector("track-title");
|
||||||
const trackArtistEl = player.querySelector("track-artist");
|
const trackArtistEl = player.querySelector("track-artist");
|
||||||
|
|
||||||
|
|
||||||
|
let isTransitioning = false;
|
||||||
let currentTrackIndex = 0;
|
let currentTrackIndex = 0;
|
||||||
let isPlaying = false;
|
let isPlaying = false;
|
||||||
const sources = audio.querySelectorAll("source");
|
const sources = audio.querySelectorAll("source");
|
||||||
|
|
@ -48,13 +50,25 @@ function initMiniPlayer() {
|
||||||
|
|
||||||
const loadTrack = (index) => {
|
const loadTrack = (index) => {
|
||||||
currentTrackIndex = index;
|
currentTrackIndex = index;
|
||||||
|
|
||||||
|
const wasPlaying = isPlaying || isTransitioning;
|
||||||
|
|
||||||
|
isTransitioning = false;
|
||||||
|
|
||||||
audio.src = tracks[index].src;
|
audio.src = tracks[index].src;
|
||||||
audio.currentTime = 0;
|
audio.currentTime = 0;
|
||||||
|
|
||||||
progressInput.value = 0;
|
progressInput.value = 0;
|
||||||
currentTimeEl.textContent = "00:00";
|
currentTimeEl.textContent = "00:00";
|
||||||
|
|
||||||
if (trackTitleEl) trackTitleEl.textContent = tracks[index].title;
|
if (trackTitleEl) trackTitleEl.textContent = tracks[index].title;
|
||||||
if (trackArtistEl) trackArtistEl.textContent = tracks[index].artist;
|
if (trackArtistEl) trackArtistEl.textContent = tracks[index].artist;
|
||||||
if (isPlaying) audio.play();
|
|
||||||
|
if (wasPlaying) {
|
||||||
|
audio.addEventListener("loadeddata", () => {
|
||||||
|
audio.play();
|
||||||
|
}, { once: true });
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const handlePlayPause = () => {
|
const handlePlayPause = () => {
|
||||||
|
|
@ -73,6 +87,7 @@ function initMiniPlayer() {
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleNext = () => {
|
const handleNext = () => {
|
||||||
|
isTransitioning = true;
|
||||||
const newIndex = currentTrackIndex === tracks.length - 1 ? 0 : currentTrackIndex + 1;
|
const newIndex = currentTrackIndex === tracks.length - 1 ? 0 : currentTrackIndex + 1;
|
||||||
loadTrack(newIndex);
|
loadTrack(newIndex);
|
||||||
};
|
};
|
||||||
|
|
@ -111,6 +126,8 @@ function initMiniPlayer() {
|
||||||
|
|
||||||
|
|
||||||
audio.addEventListener("pause", () => {
|
audio.addEventListener("pause", () => {
|
||||||
|
if (isTransitioning) return;
|
||||||
|
|
||||||
isPlaying = false;
|
isPlaying = false;
|
||||||
updatePlayState();
|
updatePlayState();
|
||||||
});
|
});
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue