2020-08-18 16:03:56 -04:00
|
|
|
var worker;
|
2020-05-11 12:41:26 -04:00
|
|
|
|
|
|
|
function load() {
|
2020-08-18 16:03:56 -04:00
|
|
|
init_worker();
|
2020-06-16 09:13:12 -04:00
|
|
|
document.querySelector('#player').addEventListener('ended', function() {
|
|
|
|
if (document.querySelector('#shuffle').checked) {
|
2020-08-18 16:03:56 -04:00
|
|
|
ww_send_event('random_track', {});
|
2020-06-16 09:13:12 -04:00
|
|
|
}
|
|
|
|
});
|
2020-05-11 12:41:26 -04:00
|
|
|
}
|
|
|
|
|
2020-08-18 16:03:56 -04:00
|
|
|
function init_worker() {
|
|
|
|
worker = new Worker('/static/scorchWorker.js');
|
|
|
|
worker.onmessage = ww_onmessage;
|
|
|
|
worker.events = {};
|
|
|
|
worker.events['artist_albums'] = artist_albums_recv;
|
|
|
|
worker.events['album_tracks'] = album_tracks_recv;
|
|
|
|
worker.events['track'] = track_recv;
|
2020-05-11 12:41:26 -04:00
|
|
|
}
|
|
|
|
|
2020-08-18 16:03:56 -04:00
|
|
|
function ww_send_event(event_title, data) {
|
|
|
|
worker.postMessage([event_title, data]);
|
2020-08-14 22:36:20 -04:00
|
|
|
}
|
|
|
|
|
2020-08-18 16:03:56 -04:00
|
|
|
function ww_onmessage(event) {
|
2020-06-15 09:57:23 -04:00
|
|
|
let data;
|
|
|
|
let event_title;
|
|
|
|
try {
|
|
|
|
data = JSON.parse(event.data);
|
|
|
|
} catch(err) {
|
|
|
|
// not JSON
|
|
|
|
console.log(err);
|
|
|
|
console.log(event);
|
|
|
|
throw new Error("Error decoding JSON");
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (!data.ok) {
|
|
|
|
throw new Error("Socket error: event = " + event_title + ", error = " + data.error);
|
|
|
|
}
|
|
|
|
|
|
|
|
try {
|
|
|
|
event_title = data.event;
|
|
|
|
data = data.data;
|
|
|
|
} catch(err) {
|
|
|
|
// not proper event
|
|
|
|
console.log(err);
|
|
|
|
console.log(event);
|
|
|
|
throw new Error("Event malformed");
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2020-08-18 16:03:56 -04:00
|
|
|
if (worker.events[event_title] === undefined) {
|
2020-06-15 09:57:23 -04:00
|
|
|
console.log("Unknown socket event: " + event_title);
|
|
|
|
return;
|
|
|
|
}
|
2020-08-18 16:03:56 -04:00
|
|
|
//console.log("Received `" + event_title + "` event with following data: " + JSON.stringify(data));
|
|
|
|
worker.events[event_title](data);
|
2020-06-15 09:57:23 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
/* Websocket receive */
|
2020-06-16 08:58:47 -04:00
|
|
|
function artist_albums_recv(data) {
|
2020-06-15 09:57:23 -04:00
|
|
|
let albums_list = document.querySelector('#albumList');
|
|
|
|
while (albums_list.firstChild) {
|
|
|
|
albums_list.removeChild(albums_list.lastChild);
|
|
|
|
}
|
2020-10-05 10:52:51 -04:00
|
|
|
let track_list = document.querySelector('#trackList');
|
|
|
|
while (track_list.firstChild) {
|
|
|
|
track_list.removeChild(track_list.firstChild);
|
|
|
|
}
|
2020-06-15 09:57:23 -04:00
|
|
|
for (let album of data) {
|
|
|
|
let option = document.createElement('option');
|
2020-06-16 08:58:47 -04:00
|
|
|
option.value = album['album'];
|
|
|
|
option.innerText = album['album'];
|
2020-10-05 11:51:43 -04:00
|
|
|
option.dataset['date'] = album['date']
|
2020-06-15 09:57:23 -04:00
|
|
|
albums_list.appendChild(option);
|
|
|
|
}
|
2020-05-11 12:41:26 -04:00
|
|
|
}
|
2020-06-15 09:57:23 -04:00
|
|
|
|
2020-06-16 08:58:47 -04:00
|
|
|
function album_tracks_recv(data) {
|
|
|
|
let track_list = document.querySelector('#trackList');
|
|
|
|
while (track_list.firstChild) {
|
|
|
|
track_list.removeChild(track_list.lastChild);
|
|
|
|
}
|
|
|
|
for (let track of data) {
|
|
|
|
let option = document.createElement('option');
|
|
|
|
option.value = track['title'];
|
|
|
|
option.innerText = track['discnumber'] + '.' + track['tracknumber'] + ' - ' + track['title'];
|
2020-10-05 11:51:43 -04:00
|
|
|
option.dataset['date'] = track['date']
|
2020-06-16 08:58:47 -04:00
|
|
|
option.dataset['discnumber'] = track['discnumber']
|
|
|
|
option.dataset['tracknumber'] = track['tracknumber']
|
|
|
|
track_list.appendChild(option);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function track_recv(data) {
|
|
|
|
document.querySelector('#nowPlayingArtist').innerText = data['albumartist'];
|
|
|
|
document.querySelector('#nowPlayingAlbum').innerText = data['album'];
|
|
|
|
document.querySelector('#nowPlayingTitle').innerText = data['title'];
|
2020-06-16 12:40:02 -04:00
|
|
|
document.title = 'Scorch | ' + data['artist'] + ' - ' + data['title'];
|
2020-06-16 08:58:47 -04:00
|
|
|
let player = document.querySelector('#player');
|
|
|
|
player.firstElementChild.src = data['url'];
|
|
|
|
player.load();
|
|
|
|
player.play();
|
2020-06-16 09:58:00 -04:00
|
|
|
document.querySelector('#albumCover').firstChild.src = data['coverart'];
|
2020-06-16 08:58:47 -04:00
|
|
|
}
|
|
|
|
|
2020-06-15 09:57:23 -04:00
|
|
|
/* Websocket send */
|
2020-06-16 08:58:47 -04:00
|
|
|
function select_artist(select) {
|
|
|
|
let data = {
|
|
|
|
'artist': select.value,
|
|
|
|
};
|
2020-08-18 16:03:56 -04:00
|
|
|
ww_send_event('select_artist', data);
|
2020-06-16 08:58:47 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
function select_album(select) {
|
|
|
|
let data = {
|
|
|
|
'artist': document.querySelector('#artistList').value,
|
|
|
|
'album': select.value,
|
2020-10-05 11:51:43 -04:00
|
|
|
'date': select.selectedOptions[0].dataset['date'],
|
2020-06-16 08:58:47 -04:00
|
|
|
};
|
2020-08-18 16:03:56 -04:00
|
|
|
ww_send_event('select_album', data);
|
2020-06-16 08:58:47 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
function select_track(select) {
|
|
|
|
let data = {
|
|
|
|
'artist': document.querySelector('#artistList').value,
|
|
|
|
'album': document.querySelector('#albumList').value,
|
2020-10-05 11:51:43 -04:00
|
|
|
'date': select.selectedOptions[0].dataset['date'],
|
2020-06-16 08:58:47 -04:00
|
|
|
'discnumber': select.selectedOptions[0].dataset['discnumber'],
|
|
|
|
'tracknumber': select.selectedOptions[0].dataset['tracknumber'],
|
|
|
|
};
|
2020-08-18 16:03:56 -04:00
|
|
|
ww_send_event('select_track', data);
|
2020-08-14 22:36:20 -04:00
|
|
|
}
|