Working player, some other fixes
This commit is contained in:
@@ -1,4 +1,10 @@
|
||||
---
|
||||
export interface Track {
|
||||
src: string;
|
||||
metadata: Record<string, any>;
|
||||
duration: number;
|
||||
}
|
||||
|
||||
import { Icon } from "astro-icon/components";
|
||||
|
||||
interface Props {
|
||||
@@ -6,6 +12,28 @@ interface Props {
|
||||
}
|
||||
|
||||
const { height = "h-28" } = Astro.props as Props;
|
||||
|
||||
import { getAudioDurationInSeconds } from "get-audio-duration";
|
||||
import { join } from "path";
|
||||
|
||||
import { getCollection } from "astro:content";
|
||||
const autoQueuedTracks = (
|
||||
await getCollection("tracks", ({ data }) => data.autoQueue)
|
||||
).sort(
|
||||
(a, b) => (a.data.autoQueue?.order || -1) - (b.data.autoQueue?.order || 1)
|
||||
);
|
||||
|
||||
const initialQueue = await Promise.all(
|
||||
autoQueuedTracks.map(async ({ data }) => {
|
||||
const fullFilePath = join(process.cwd(), "public", data.src);
|
||||
const duration = await getAudioDurationInSeconds(fullFilePath);
|
||||
return {
|
||||
src: data.src,
|
||||
metadata: data.metadata,
|
||||
duration: duration
|
||||
};
|
||||
})
|
||||
);
|
||||
---
|
||||
|
||||
<div
|
||||
@@ -32,13 +60,13 @@ const { height = "h-28" } = Astro.props as Props;
|
||||
</div>
|
||||
<div class="p-2 text-white">
|
||||
<div class="grid grid-cols-2 text-xs">
|
||||
<span id="player:time:current" class="col-span-1 text-left"></span>
|
||||
<span id="player:time:total" class="col-span-1 text-right"></span>
|
||||
<span id="player:times:current" class="col-span-1 text-left">0:00</span>
|
||||
<span id="player:times:duration" class="col-span-1 text-right">0:00</span>
|
||||
</div>
|
||||
<div class="flex h-full flex-row items-center justify-center align-middle">
|
||||
<div class="m-0 flex grow-0 flex-row space-x-2 p-0 text-3xl">
|
||||
<span>
|
||||
<Icon name="fa7-solid:backward" id="player:controls:backward" />
|
||||
<Icon name="fa7-solid:backward" id="player:controls:previous" />
|
||||
</span>
|
||||
<span>
|
||||
<Icon name="fa7-solid:play" id="player:controls:play" />
|
||||
@@ -49,7 +77,7 @@ const { height = "h-28" } = Astro.props as Props;
|
||||
/>
|
||||
</span>
|
||||
<span>
|
||||
<Icon name="fa7-solid:forward" id="player:controls:forward" />
|
||||
<Icon name="fa7-solid:forward" id="player:controls:next" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex flex-grow flex-col text-sm">
|
||||
@@ -63,363 +91,260 @@ const { height = "h-28" } = Astro.props as Props;
|
||||
</div>
|
||||
<div class:list={[height]}></div>
|
||||
|
||||
<script src="/js/howler.min.js" is:inline></script>
|
||||
<script is:inline src="/js/howler.min.js"></script>
|
||||
<script is:inline define:vars={{ initialQueue }}>
|
||||
/**
|
||||
* Player class containing the state of our playlist and where we are in it.
|
||||
* Includes all methods for playing, skipping, updating the display, etc.
|
||||
* @param {Array} playlist Array of objects with playlist song details ({title, file, howl}).
|
||||
*/
|
||||
class Player {
|
||||
constructor(playlist) {
|
||||
this.playlist = window.player?.playlist ?? playlist;
|
||||
this.index = window.player?.index ?? 0;
|
||||
|
||||
<!-- Retrieve elements -->
|
||||
<script is:inline>
|
||||
// numbers
|
||||
const player_playerTimeCurrent = document.getElementById(
|
||||
"player:time:current"
|
||||
);
|
||||
const player_playerTimeTotal = document.getElementById("player:time:total");
|
||||
|
||||
// progress bars
|
||||
const player_playerTimeProgress = document.getElementById(
|
||||
"player:time:progress"
|
||||
);
|
||||
const player_playerTimeProgressPlayed = document.getElementById(
|
||||
"player:time:progress:played"
|
||||
);
|
||||
const player_playerTimeProgressBuffered = document.getElementById(
|
||||
"player:time:progress:buffered"
|
||||
);
|
||||
|
||||
// metadata
|
||||
const player_playerMetadataTitle = document.getElementById(
|
||||
"player:metadata:title"
|
||||
);
|
||||
const player_playerMetadataSubtitle = document.getElementById(
|
||||
"player:metadata:subtitle"
|
||||
);
|
||||
const player_playerMetadataExtra = document.getElementById(
|
||||
"player:metadata:extra"
|
||||
);
|
||||
|
||||
// controls
|
||||
const player_playerControlsPlay = document.getElementById(
|
||||
"player:controls:play"
|
||||
);
|
||||
const player_playerControlsPause = document.getElementById(
|
||||
"player:controls:pause"
|
||||
);
|
||||
const player_playerControlsForward = document.getElementById(
|
||||
"player:controls:forward"
|
||||
);
|
||||
const player_playerControlsBackward = document.getElementById(
|
||||
"player:controls:backward"
|
||||
);
|
||||
</script>
|
||||
|
||||
<!-- Add listeners -->
|
||||
<script is:inline>
|
||||
if (player_playerTimeProgress) {
|
||||
player_playerTimeProgress.addEventListener("click", function (event) {
|
||||
const x = event.offsetX;
|
||||
const percentage =
|
||||
x / player_playerTimeProgress.getBoundingClientRect().width;
|
||||
player_seekTrack(percentage);
|
||||
});
|
||||
}
|
||||
|
||||
if (player_playerControlsPlay) {
|
||||
player_playerControlsPlay.addEventListener("click", function (event) {
|
||||
player_playPause();
|
||||
});
|
||||
}
|
||||
|
||||
if (player_playerControlsPause) {
|
||||
player_playerControlsPause.addEventListener("click", function (event) {
|
||||
player_playPause();
|
||||
});
|
||||
}
|
||||
|
||||
if (player_playerControlsForward) {
|
||||
player_playerControlsForward.addEventListener("click", function (event) {
|
||||
player_playForward();
|
||||
});
|
||||
}
|
||||
|
||||
if (player_playerControlsBackward) {
|
||||
player_playerControlsBackward.addEventListener("click", function (event) {
|
||||
player_playBackward();
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Playing control logic -->
|
||||
<script is:inline>
|
||||
function player_seekTrack(percentage) {
|
||||
const currentTrack = player_getCurrentTrack();
|
||||
if (currentTrack) {
|
||||
const duration = currentTrack.howl.duration();
|
||||
const seconds = duration * percentage;
|
||||
const ID = player_getCurrentTrackID();
|
||||
currentTrack.howl.seek(seconds, ID);
|
||||
}
|
||||
}
|
||||
|
||||
function player_playPause() {
|
||||
const currentTrack = player_getCurrentTrack();
|
||||
if (!currentTrack) {
|
||||
return;
|
||||
}
|
||||
|
||||
const ID = player_getCurrentTrackID();
|
||||
|
||||
if (currentTrack.howl.playing(ID)) {
|
||||
currentTrack.howl.pause(ID);
|
||||
return;
|
||||
}
|
||||
|
||||
// Case 2: Valid ID but not playing
|
||||
if (typeof ID === "number" && ID >= 0) {
|
||||
currentTrack.howl.play(ID);
|
||||
return;
|
||||
}
|
||||
|
||||
// Case 3: No valid ID yet (first play)
|
||||
player_nextIndex++;
|
||||
player_currentID = currentTrack.howl.play();
|
||||
}
|
||||
|
||||
function player_playForward() {
|
||||
player_playNext();
|
||||
}
|
||||
|
||||
function player_playBackward() {
|
||||
player_playPrevious();
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Handle UI -->
|
||||
<script is:inline>
|
||||
function player_formatTime(seconds) {
|
||||
const minutes = Math.floor(seconds / 60);
|
||||
const secs = Math.floor(seconds % 60);
|
||||
// Pad with 0s if less than 10
|
||||
const paddedMinutes = String(minutes).padStart(2, "0");
|
||||
const paddedSecs = String(secs).padStart(2, "0");
|
||||
return `${paddedMinutes}:${paddedSecs}`;
|
||||
}
|
||||
|
||||
function player_getBufferedAmount(track) {
|
||||
const audioNode = track._sounds[0]._node;
|
||||
if (audioNode && audioNode.buffered.length) {
|
||||
// Get the highest buffered point
|
||||
return audioNode.buffered.end(0);
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
|
||||
function player_updateProgressAndDuration(
|
||||
current,
|
||||
total,
|
||||
progress,
|
||||
buffered
|
||||
) {
|
||||
if (player_playerTimeCurrent) {
|
||||
player_playerTimeCurrent.textContent = player_formatTime(current);
|
||||
}
|
||||
|
||||
if (player_playerTimeTotal) {
|
||||
player_playerTimeTotal.textContent = player_formatTime(total);
|
||||
}
|
||||
|
||||
if (player_playerTimeProgressPlayed) {
|
||||
player_playerTimeProgressPlayed.style.width = `${(progress * 100).toString()}%`;
|
||||
}
|
||||
|
||||
if (player_playerTimeProgressBuffered) {
|
||||
let bufferedPercentage = (total / buffered) * 100;
|
||||
|
||||
if (Math.abs(100 - bufferedPercentage) < 1) {
|
||||
bufferedPercentage = 100;
|
||||
}
|
||||
|
||||
player_playerTimeProgressBuffered.style.width = `${bufferedPercentage.toString()}%`;
|
||||
}
|
||||
}
|
||||
|
||||
function player_updateMetadata(title, subtitle, extra, artist) {
|
||||
if (player_playerMetadataTitle) {
|
||||
player_playerMetadataTitle.textContent = title;
|
||||
}
|
||||
|
||||
if (player_playerMetadataSubtitle) {
|
||||
player_playerMetadataSubtitle.textContent = subtitle;
|
||||
}
|
||||
|
||||
if (player_playerMetadataExtra) {
|
||||
player_playerMetadataExtra.textContent = extra;
|
||||
}
|
||||
}
|
||||
|
||||
function player_updatePlayPause() {
|
||||
if (player_playerControlsPlay && player_playerControlsPause) {
|
||||
const currentTrack = player_getCurrentTrack();
|
||||
|
||||
if (currentTrack) {
|
||||
if (currentTrack.howl.playing()) {
|
||||
player_playerControlsPause.classList.remove("hidden");
|
||||
player_playerControlsPlay.classList.add("hidden");
|
||||
} else {
|
||||
player_playerControlsPause.classList.add("hidden");
|
||||
player_playerControlsPlay.classList.remove("hidden");
|
||||
this.UI = {
|
||||
controls: {
|
||||
play: document.getElementById("player:controls:play"),
|
||||
pause: document.getElementById("player:controls:pause"),
|
||||
previous: document.getElementById("player:controls:previous"),
|
||||
next: document.getElementById("player:controls:next")
|
||||
},
|
||||
times: {
|
||||
current: document.getElementById("player:times:current"),
|
||||
duration: document.getElementById("player:times:duration")
|
||||
},
|
||||
metadata: {
|
||||
title: document.getElementById("player:metadata:title"),
|
||||
subtitle: document.getElementById("player:metadata:subtitle"),
|
||||
extra: document.getElementById("player:metadata:extra")
|
||||
},
|
||||
progress: {
|
||||
bar: document.getElementById("player:time:progress"),
|
||||
buffered: document.getElementById("player:time:progress:buffered"),
|
||||
played: document.getElementById("player:time:progress:played")
|
||||
}
|
||||
};
|
||||
|
||||
this.UI.metadata.title.textContent = playlist[this.index].metadata.title;
|
||||
this.UI.metadata.subtitle.textContent =
|
||||
playlist[this.index].metadata.subtitle;
|
||||
this.UI.metadata.extra.textContent = playlist[this.index].metadata.extra;
|
||||
this.UI.times.duration.textContent = this.formatTime(
|
||||
Math.round(playlist[this.index].duration)
|
||||
);
|
||||
|
||||
this.UI.controls.play.addEventListener("click", function () {
|
||||
window.player.play();
|
||||
});
|
||||
this.UI.controls.pause.addEventListener("click", function () {
|
||||
window.player.pause();
|
||||
});
|
||||
this.UI.controls.previous.addEventListener("click", function () {
|
||||
window.player.skip("prev");
|
||||
});
|
||||
this.UI.controls.next.addEventListener("click", function () {
|
||||
window.player.skip("next");
|
||||
});
|
||||
|
||||
this.UI.progress.bar.addEventListener("click", function (event) {
|
||||
window.player.seek(event.clientX / window.innerWidth);
|
||||
});
|
||||
|
||||
window.playerIsInitialised = true;
|
||||
}
|
||||
|
||||
/**
|
||||
* Play a song in the playlist.
|
||||
* @param {Number} index Index of the song in the playlist (leave empty to play the first or current).
|
||||
*/
|
||||
play(index) {
|
||||
var sound;
|
||||
|
||||
index = typeof index === "number" ? index : this.index;
|
||||
var data = this.playlist[index];
|
||||
|
||||
// If we already loaded this track, use the current one.
|
||||
if (data.howl) {
|
||||
sound = data.howl;
|
||||
} else {
|
||||
sound = data.howl = new Howl({
|
||||
src: [data.src],
|
||||
autoplay: false,
|
||||
html5: true, // Force to HTML5 so that the audio can stream in (best for large files).
|
||||
onplay: () => {
|
||||
// Display the duration.
|
||||
this.UI.times.duration.textContent = this.formatTime(
|
||||
Math.round(sound.duration())
|
||||
);
|
||||
|
||||
// Start updating the progress of the track.
|
||||
requestAnimationFrame(this.step.bind(this));
|
||||
|
||||
this.UI.controls.pause.classList.remove("hidden");
|
||||
this.UI.controls.play.classList.add("hidden");
|
||||
},
|
||||
// onload: () => {
|
||||
// loading.style.display = "none";
|
||||
// },
|
||||
onend: () => {
|
||||
this.skip("next");
|
||||
},
|
||||
onpause: () => {
|
||||
this.UI.controls.pause.classList.add("hidden");
|
||||
this.UI.controls.play.classList.remove("hidden");
|
||||
},
|
||||
// onstop: () => {
|
||||
// },
|
||||
onseek: () => {
|
||||
// Start updating the progress of the track.
|
||||
requestAnimationFrame(this.step.bind(this));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Begin playing the sound.
|
||||
sound.play();
|
||||
|
||||
// Update the track display.
|
||||
this.UI.metadata.title.textContent = data.metadata.title;
|
||||
this.UI.metadata.subtitle.textContent = data.metadata.subtitle;
|
||||
this.UI.metadata.extra.textContent = data.metadata.extra;
|
||||
this.UI.times.duration.textContent = this.formatTime(
|
||||
Math.round(data.duration)
|
||||
);
|
||||
|
||||
// Keep track of the index we are currently playing.
|
||||
this.index = index;
|
||||
}
|
||||
|
||||
/**
|
||||
* Pause the currently playing track.
|
||||
*/
|
||||
pause() {
|
||||
// Get the Howl we want to manipulate.
|
||||
var sound = this.playlist[this.index].howl;
|
||||
|
||||
sound.pause();
|
||||
|
||||
this.UI.controls.pause.classList.add("hidden");
|
||||
this.UI.controls.play.classList.remove("hidden");
|
||||
}
|
||||
|
||||
/**
|
||||
* Skip to the next or previous track.
|
||||
* @param {String} direction 'next' or 'prev'.
|
||||
*/
|
||||
skip(direction) {
|
||||
var current = this.playlist[this.index];
|
||||
var sound = current.howl;
|
||||
var currentlyPlaying = sound && sound.playing();
|
||||
|
||||
if (direction === "prev" && currentlyPlaying && sound.seek() > 3) {
|
||||
sound.seek(0);
|
||||
return;
|
||||
}
|
||||
|
||||
let index;
|
||||
if (direction === "prev") {
|
||||
index = (this.index - 1 + this.playlist.length) % this.playlist.length;
|
||||
} else {
|
||||
index = (this.index + 1) % this.playlist.length;
|
||||
}
|
||||
|
||||
this.skipTo(index);
|
||||
}
|
||||
|
||||
/**
|
||||
* Skip to a specific track based on its playlist index.
|
||||
* @param {Number} index Index in the playlist.
|
||||
*/
|
||||
skipTo(index) {
|
||||
// Stop the current track.
|
||||
if (this.playlist[this.index].howl) {
|
||||
this.playlist[this.index].howl.stop();
|
||||
}
|
||||
|
||||
// Reset progress.
|
||||
this.UI.progress.played.style.width = "0%";
|
||||
this.UI.times.current.textContent = this.formatTime(0);
|
||||
|
||||
// Play the new track.
|
||||
this.play(index);
|
||||
}
|
||||
|
||||
/**
|
||||
* Seek to a new position in the currently playing track.
|
||||
* @param {Number} per Percentage through the song to skip.
|
||||
*/
|
||||
seek(per) {
|
||||
// Get the Howl we want to manipulate.
|
||||
var sound = this.playlist[this.index].howl;
|
||||
|
||||
if (sound.playing()) {
|
||||
// Convert the percent into a seek position.
|
||||
sound.seek(sound.duration() * per);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* The step called within requestAnimationFrame to update the playback position.
|
||||
*/
|
||||
step() {
|
||||
// Get the Howl we want to manipulate.
|
||||
var sound = this.playlist[this.index].howl;
|
||||
|
||||
var seek = sound.seek() || 0;
|
||||
this.UI.times.current.textContent = this.formatTime(Math.round(seek));
|
||||
this.UI.progress.played.style.width =
|
||||
((seek / sound.duration()) * 100 || 0) + "%";
|
||||
|
||||
// If the sound is still playing, continue stepping.
|
||||
if (sound.playing()) {
|
||||
requestAnimationFrame(this.step.bind(this));
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Format the time from seconds to M:SS.
|
||||
* @param {Number} secs Seconds to format.
|
||||
* @return {String} Formatted time.
|
||||
*/
|
||||
formatTime(secs) {
|
||||
var minutes = Math.floor(secs / 60) || 0;
|
||||
var seconds = secs - minutes * 60 || 0;
|
||||
|
||||
return minutes + ":" + (seconds < 10 ? "0" : "") + seconds;
|
||||
}
|
||||
|
||||
queue(track, immediatePlay = false) {
|
||||
this.playlist.splice(this.index + 1, 0, track);
|
||||
|
||||
if (immediatePlay) {
|
||||
this.skipTo(this.index + 1);
|
||||
}
|
||||
}
|
||||
|
||||
addFromTrackCard(track) {
|
||||
var current = this.playlist[this.index];
|
||||
|
||||
if (
|
||||
track.metadata.title === current.metadata.title &&
|
||||
track.metadata.subtitle === current.metadata.subtitle &&
|
||||
track.metadata.extra === current.metadata.extra
|
||||
) {
|
||||
if (current.howl && current.howl.playing()) {
|
||||
this.pause();
|
||||
} else {
|
||||
this.play();
|
||||
}
|
||||
} else {
|
||||
this.queue(track, true);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function player_updateUIElements() {
|
||||
const currentTrack = player_getCurrentTrack();
|
||||
if (currentTrack) {
|
||||
// progress bar and times
|
||||
const current = currentTrack.howl.seek();
|
||||
const duration = currentTrack.howl.duration();
|
||||
const progress = current / duration;
|
||||
const buffered = player_getBufferedAmount(currentTrack.howl);
|
||||
|
||||
player_updateProgressAndDuration(current, duration, progress, buffered);
|
||||
|
||||
// metadata
|
||||
const title = currentTrack.metadata.title;
|
||||
const subtitle = currentTrack.metadata.subtitle || "";
|
||||
const extra = currentTrack.metadata.extra || "";
|
||||
const artist = currentTrack.metadata.artist || "";
|
||||
|
||||
player_updateMetadata(title, subtitle, extra, artist);
|
||||
|
||||
player_updatePlayPause();
|
||||
}
|
||||
|
||||
requestAnimationFrame(player_updateUIElements);
|
||||
}
|
||||
|
||||
requestAnimationFrame(player_updateUIElements);
|
||||
</script>
|
||||
|
||||
<!-- Main logic -->
|
||||
<script is:inline>
|
||||
const player_playlist = [];
|
||||
let player_currentID = -999;
|
||||
let player_nextIndex = 0;
|
||||
|
||||
function player_getCurrentTrack() {
|
||||
if (player_getPlaylistSize() === 0) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return player_playlist[player_getCurrentTrackIndex()];
|
||||
}
|
||||
|
||||
function player_getCurrentTrackNumber() {
|
||||
return player_nextIndex;
|
||||
}
|
||||
|
||||
function player_getCurrentTrackIndex() {
|
||||
if (player_nextIndex === 0) {
|
||||
return player_nextIndex;
|
||||
}
|
||||
return player_nextIndex - 1;
|
||||
}
|
||||
|
||||
function player_getCurrentTrackID() {
|
||||
return player_currentID;
|
||||
}
|
||||
|
||||
function player_getPlaylistSize() {
|
||||
return player_playlist.length;
|
||||
}
|
||||
|
||||
function player_playNext() {
|
||||
if (player_getPlaylistSize() === 0) {
|
||||
// the playlist is empty, just exit
|
||||
return;
|
||||
}
|
||||
|
||||
const currentTrack = player_getCurrentTrack();
|
||||
const currentID = player_getCurrentTrackID();
|
||||
|
||||
if (currentTrack && currentTrack.howl.playing()) {
|
||||
currentTrack.howl.stop(currentID);
|
||||
currentTrack.howl.seek(0, currentID);
|
||||
}
|
||||
|
||||
if (player_nextIndex >= player_getPlaylistSize()) {
|
||||
// wrap around
|
||||
player_nextIndex = 0;
|
||||
}
|
||||
|
||||
const newTrack = player_playlist[player_nextIndex];
|
||||
player_nextIndex++;
|
||||
player_currentID = newTrack.howl.play();
|
||||
}
|
||||
|
||||
function player_playPrevious() {
|
||||
if (player_getPlaylistSize() === 0) {
|
||||
// the playlist is empty, just exit
|
||||
return;
|
||||
}
|
||||
|
||||
const currentTrack = player_getCurrentTrack();
|
||||
const ID = player_getCurrentTrackID();
|
||||
|
||||
if (
|
||||
currentTrack &&
|
||||
currentTrack.howl.playing() &&
|
||||
currentTrack.howl.seek() >= 2
|
||||
) {
|
||||
// there's currently a track playing and we're more than two seconds into it
|
||||
// play it from the start rather than going back to the previous
|
||||
currentTrack.howl.seek(0, ID);
|
||||
return;
|
||||
}
|
||||
|
||||
if (currentTrack && currentTrack.howl.playing(ID)) {
|
||||
currentTrack.howl.stop(ID);
|
||||
}
|
||||
|
||||
// Rewind index
|
||||
player_nextIndex -= 2;
|
||||
if (player_nextIndex < 0) {
|
||||
player_nextIndex = player_getPlaylistSize() - 1;
|
||||
}
|
||||
|
||||
const newTrack = player_playlist[player_nextIndex];
|
||||
player_nextIndex++;
|
||||
player_currentID = newTrack.howl.play();
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Player utilities -->
|
||||
<script is:inline>
|
||||
function player_constructTrack(trackData) {
|
||||
trackData.howl = new Howl({
|
||||
src: [`/audio/${trackData.src}`],
|
||||
html5: true,
|
||||
preload: "metadata",
|
||||
volume: 1,
|
||||
onend: player_playNext
|
||||
});
|
||||
return trackData;
|
||||
}
|
||||
|
||||
function player_addToPlaylist(track, autoPlay = true) {
|
||||
const currentTrack = player_getCurrentTrack();
|
||||
if (
|
||||
currentTrack &&
|
||||
currentTrack.metadata.title === track.metadata.title &&
|
||||
currentTrack.metadata.subtitle === track.metadata.subtitle
|
||||
) {
|
||||
player_playPause();
|
||||
return;
|
||||
}
|
||||
|
||||
if (autoPlay) {
|
||||
player_playlist.splice(player_nextIndex, 0, track);
|
||||
player_playNext();
|
||||
} else {
|
||||
player_playlist.push(track);
|
||||
}
|
||||
if (!window.playerIsInitialised) {
|
||||
window.player = new Player(initialQueue);
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user