140 lines
3.9 KiB
JavaScript
140 lines
3.9 KiB
JavaScript
var domReady = false;
|
|
var domInterval = null;
|
|
var isPlaying = false;
|
|
var canPlay = false;
|
|
document.addEventListener('astro:page-load', function() {
|
|
domInterval = setInterval(() => {
|
|
/* Patch */
|
|
if ($(".play")) {
|
|
domReady = true;
|
|
try {
|
|
sound.stop();
|
|
} catch (e) { }
|
|
}
|
|
if (domReady) {
|
|
initialize();
|
|
clearInterval(domInterval);
|
|
}
|
|
}, 500)
|
|
});
|
|
|
|
initialize = () => {
|
|
(function () {
|
|
var sound = new Howl({
|
|
src: ["https://stream.codey.lol/sfm.ogg"],
|
|
html5: true,
|
|
onloaderror: (id) => { console.log(`Fail: ${id}`) },
|
|
onplayerror: (id) => { console.log(`Fail b: ${id}`)},
|
|
onend: (e) => { sound.play(); }
|
|
});
|
|
|
|
console.log(sound);
|
|
|
|
let currentTime = 0;
|
|
let currentDuration = 0;
|
|
let currentUUID = null;
|
|
const title = $('.music-player__title');
|
|
const author = $('.music-player__author');
|
|
const cover = $('.cover');
|
|
const genre = $('.music-player__genre');
|
|
const playBtn = $('#play');
|
|
const progressBar = $('#length');
|
|
const currentTimeIndicator = $('.music-time__current');
|
|
const leftTimeIndicator = $('.music-time__last');
|
|
|
|
|
|
const fail = (type="soft") => {
|
|
$(title).text('Offline');
|
|
$(author).text('');
|
|
$(genre).text('');
|
|
$(cover).prop('src', '/images/radio_art_default.jpg')
|
|
$(genre).hide();
|
|
$(currentTimeIndicator).text('0:00');
|
|
$(leftTimeIndicator).text('0:00');
|
|
if (type==="hard") {
|
|
canPlay = false;
|
|
}
|
|
}
|
|
|
|
const getCurrentTrack = () => {
|
|
$.ajax({
|
|
url: API_URL+'/radio/np',
|
|
method: "POST",
|
|
contentType: "application/json"
|
|
}).done(function(data) {
|
|
if (data.artist == "N/A" && data.song == "N/A") {
|
|
// server issue/not playing
|
|
return fail("hard");
|
|
}
|
|
canPlay = true;
|
|
if (currentUUID == data.uuid) {
|
|
currentTime = data.elapsed;
|
|
currentDuration = data.duration;
|
|
return changeBar(); // no change
|
|
}
|
|
currentUUID = data.uuid;
|
|
$(title).text(data.song);
|
|
author_text = data.artist;
|
|
$(author).text(author_text);
|
|
if (data.genre && data.genre !== "N/A") {
|
|
$(genre).text(data.genre);
|
|
if (! $(genre).is(':visible')) {
|
|
$(genre).show();
|
|
}
|
|
} else { // API response does not contain genre
|
|
if ($(genre).is(':visible')) {
|
|
$(genre).hide();
|
|
}
|
|
}
|
|
$(cover).prop('src', API_URL+'/radio/album_art?'+Date.now());
|
|
changeBar();
|
|
}).fail(function (e, eData, jqXHR) {
|
|
return fail();
|
|
});
|
|
}
|
|
|
|
getCurrentTrack();
|
|
setInterval(() => { getCurrentTrack(); }, 1000);
|
|
|
|
const changeBar = () => {
|
|
const percentage = (currentTime / currentDuration).toFixed(3);
|
|
$(progressBar).css('transition', "");
|
|
|
|
//set current time
|
|
const minute = Math.floor(currentTime / 60);
|
|
const second = Math.floor(currentTime % 60);
|
|
const leftTime = currentDuration - currentTime;
|
|
$(currentTimeIndicator).html(("0" + minute).substr(-2) + ":" + ("0" + second).substr(-2));
|
|
|
|
//set left time
|
|
const leftMinute = Math.floor(leftTime / 60);
|
|
const leftSecond = Math.floor(leftTime % 60);
|
|
|
|
$(leftTimeIndicator).html(
|
|
("0" + leftMinute).substr(-2) + ":" + ("0" + leftSecond).substr(-2));
|
|
|
|
//set time bar
|
|
$(progressBar).css('width', percentage * 100 + "%");
|
|
}
|
|
|
|
const showTime = () => {
|
|
timer = setInterval(() => changeBar(), 500);
|
|
}
|
|
|
|
const togglePlayback = () => {
|
|
if (window.isPlaying) {
|
|
sound.stop();
|
|
sound.unload();
|
|
} else {
|
|
sound.play();
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Exports
|
|
*/
|
|
|
|
window.togglePlayback = togglePlayback;
|
|
window.sound = sound;
|
|
})();
|
|
} |