73 lines
2.3 KiB
JavaScript
73 lines
2.3 KiB
JavaScript
function $(id) { return document.getElementById(id); }
|
|
|
|
function updateRadioStatus() {
|
|
fetch("/status")
|
|
.then(r => r.json())
|
|
.then(r => {
|
|
$("radio-song").textContent = r.song;
|
|
$("radio-listeners").textContent = r.listeners;
|
|
$("radio-listener-peak").textContent = r.listener_peak;
|
|
}).catch(() => {
|
|
$("radio-song").textContent = "";
|
|
$("radio-listeners").textContent =
|
|
$("radio-listener-peak").textContent = "0";
|
|
});
|
|
}
|
|
|
|
function updateLastPlayedSong() {
|
|
fetch("/lastsong")
|
|
.then(r => r.json())
|
|
.then(last_played => {
|
|
if ($("last-played").firstChild === null)
|
|
$("last-played").appendChild(document.createElement("tbody"))
|
|
else if (last_played.time == $("last-played").firstChild.lastChild.firstChild.innerText)
|
|
return;
|
|
|
|
if ($("last-played").firstChild.children.length == 10)
|
|
$("last-played").firstChild.firstChild.remove();
|
|
|
|
let row = $("last-played").insertRow();
|
|
row.insertCell().appendChild(document.createTextNode(last_played.time));
|
|
row.insertCell().appendChild(document.createTextNode(last_played.listeners == 0 ? "" : last_played.listeners));
|
|
row.insertCell().appendChild(document.createTextNode(last_played.song));
|
|
});
|
|
}
|
|
|
|
document.getElementsByName("update")[0].addEventListener("click", () => {
|
|
updateLastPlayedSong();
|
|
updateRadioStatus(); });
|
|
|
|
setInterval(updateRadioStatus, 45000);
|
|
setInterval(updateLastPlayedSong, 45000);
|
|
|
|
const volume = document.getElementsByName("volume");
|
|
|
|
volume.addEventListener("input", e => {
|
|
audio.volume = parseFloat(e.target.value) / 100.0; });
|
|
|
|
const audio = document.getElementsByTagName("audio")[0];
|
|
const audio_src = audio.childNodes[0].src;
|
|
audio.hidden = true;
|
|
audio.volume = parseFloat(volume.value) / 100.0;
|
|
|
|
audio.addEventListener("timeupdate", e => {
|
|
const ct = e.target.currentTime;
|
|
const s = Math.floor(ct % 60);
|
|
const m = Math.floor((ct / 60) % 60);
|
|
const h = Math.floor(ct / 3600);
|
|
document.getElementsByClassName("elapsed")[0].textContent = `${h}h ${m}m ${s}s`; });
|
|
|
|
$("player").firstChild.style.display = "flex";
|
|
$("player").style.display = "flex";
|
|
|
|
document.getElementsByName("play")[0].addEventListener("click", e => {
|
|
if (audio.paused) {
|
|
audio.src = audio_src;
|
|
audio.play();
|
|
} else {
|
|
audio.pause();
|
|
audio.src = "";
|
|
}
|
|
e.target.style.maskImage = e.target.style.webkitMaskImage = audio.paused ?
|
|
"url(/assets/img/play.svg)" : "url(/assets/img/stop.svg)"; });
|