aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorkaotisk <kaotisk@arching-kaos.org>2024-10-14 01:59:45 +0300
committerkaotisk <kaotisk@arching-kaos.org>2024-10-14 01:59:45 +0300
commitc75a2a2212381767c253203edea7637380823d59 (patch)
treed183d29cd4dd562208c34422de667e1e4c22f15b
parent59d1058100be53832170c6ed8d17723202a80cfa (diff)
downloadarching-kaos-radio-c75a2a2212381767c253203edea7637380823d59.tar.gz
arching-kaos-radio-c75a2a2212381767c253203edea7637380823d59.tar.bz2
arching-kaos-radio-c75a2a2212381767c253203edea7637380823d59.zip
Clean up, bug fixes
-rw-r--r--client/js/radio_emulator.js194
1 files changed, 111 insertions, 83 deletions
diff --git a/client/js/radio_emulator.js b/client/js/radio_emulator.js
index 4e0a885..ed6c58d 100644
--- a/client/js/radio_emulator.js
+++ b/client/js/radio_emulator.js
@@ -33,29 +33,37 @@ const listRequest = `${apiURL}${version}/list`
const jsonRequest = `${apiURL}${version}/application/json/`
const audioRequest = `${apiURL}${version}/audio/ogg/`
-
-
function debugLog(message)
{
if ( debugMode ) console.log(message);
}
var audioElement = document.querySelector('audio');
-// var sourceElement = document.querySelector('source');
-var currentTimeP = document.querySelector('.current-time');
-var listStartedP = document.querySelector('.started-on');
-var currentShowHash = document.querySelector('.current-show-hash');
-var listHash = document.querySelector('.list-hash');
-var artistP = document.querySelector('.artist');
-var titleP = document.querySelector('.title');
-var radioPlayerDiv = document.querySelector('.radio-player');
-var youAreHere = document.querySelector('.you-are-here');
-var ProgressBar = document.querySelector('.play-progress');
-var startsOnP = document.querySelector('.starts-on');
-var showDurationP = document.querySelector('.show-duration');
-var relativeTime = document.querySelector('.relative-time');
-var listeningAt = document.querySelector('.listening-at');
-var dlProgressBar = document.querySelector('.dl-progress');
+
+var placeholders = {
+ currentTime: document.querySelector('.current-time'),
+ listStarted: document.querySelector('.started-on'),
+ currentShowHash : document.querySelector('.current-show-hash'),
+ listHash : document.querySelector('.list-hash'),
+ artist: document.querySelector('.artist'),
+ title: document.querySelector('.title'),
+ radioPlayer: document.querySelector('.radio-player'),
+ youAreHere : document.querySelector('.you-are-here'),
+ playProgress: document.querySelector('.play-progress'),
+ startsOn: document.querySelector('.starts-on'),
+ showDuration: document.querySelectorAll('.show-duration'),
+ relativeTime: document.querySelector('.relative-time'),
+ listeningAt: document.querySelector('.listening-at'),
+ dlProgress: document.querySelector('.dl-progress'),
+ minTimesPlayed: document.querySelector('.min-played'),
+ maxTimesPlayed: document.querySelector('.max-played'),
+ listDuration: document.querySelector('.list-duration'),
+ previouslyPlayed: document.querySelector('.previously-played'),
+ showInfo: document.querySelector('.show-info'),
+ listInfo: document.querySelector('.list-info'),
+ dt: document.querySelector('.d-t'),
+ deltaTime: document.querySelector('.delta-time'),
+}
const documentTitle = "Radio Station Emulator";
const separator = " :: ";
@@ -72,12 +80,11 @@ var seconds_here = 0;
function increaseSeconds()
{
seconds_here = seconds_here+1;
- youAreHere.innerText = seconds_here;
- var progressbarValue = isNaN(parseInt(currentTimeP.innerText)) ? 0 : parseInt(currentTimeP.innerText) + parseInt(seconds_here);
+ placeholders.youAreHere.innerText = seconds_here;
// debugLog(`${typeof(progressbarValue)} progressbarValue = ${progressbarValue}`)
- ProgressBar.value = progressbarValue;
- relativeTime.innerText = parseInt(currentTimeP.innerText) + seconds_here;
- listeningAt.innerText = Math.floor(audioElement.currentTime);
+ placeholders.playProgress.value = isNaN(parseInt(placeholders.currentTime.innerText)) ? 0 : parseInt(placeholders.currentTime.innerText) + parseInt(seconds_here);
+ placeholders.relativeTime.innerText = parseInt(placeholders.currentTime.innerText) + seconds_here;
+ placeholders.listeningAt.innerText = Math.floor(audioElement.currentTime);
return seconds_here;
}
function getSecondsHere()
@@ -117,7 +124,7 @@ function FetchAudio(url)
request.addEventListener("load", ()=>{
if(request.status === 200){
debugLog("Got it... trying!")
- dlProgressBar.value = 100;
+ placeholders.dlProgress.value = 100;
audioElement.src = URL.createObjectURL(request.response);
audioElement.play();
debugLog("Tried... did it work?");
@@ -132,10 +139,10 @@ function FetchAudio(url)
}
});
request.addEventListener("error", ()=>{
- debugLog("An error occured. While loading: "+url+" for "+callback+".");
+ debugLog("An error occured. While loading: "+url);
});
request.addEventListener("abort", ()=>{
- debugLog("Request aborted: "+url+" for "+callback+".");
+ debugLog("Request aborted: "+url);
});
request.open("GET", url);
request.send();
@@ -161,74 +168,65 @@ function loadShowCallback(json, params)
debugLog('loadShowCallback');
debugLog(json);
debugLog(element);
- debugLog(params);
- listStartedP.innerText = list.started_on;
- listHash.innerText = hash_of_list;
- currentShowHash.innerText = json.hash;
- artistP.innerText = json.artist;
- titleP.innerText = json.title;
+ //debugLog(params);
+ placeholders.currentShowHash.innerText = element.hash;
+ placeholders.artist.innerText = json.artist;
+ placeholders.title.innerText = json.title;
setTitleMessage ( "▶️ " + json.artist + " - " + json.title );
- showDurationP.innerText = Math.floor(element.duration/1000);
- startsOnP.innerText = element.starts_on;
- ProgressBar.max = Math.floor(element.duration/1000);
- // sourceElement.src = "http://z.kaotisk-hund.com:8010/v0/audio/ogg/" + json.hash + "#t=" + Math.floor((now_on_sequence - element.starts_on)/1000);
+ debugLog('----------');
+ placeholders.showDuration.forEach((elem)=>{elem.innerText = Math.floor(element.duration/1000)});
+ placeholders.startsOn.innerText = element.starts_on;
+ placeholders.playProgress.max = Math.floor(element.duration/1000);
+ placeholders.showInfo.innerText = JSON.stringify(json, null, 2);
audioElement.load();
FetchAudio(`${audioRequest}${json.hash}`);
audioElement.type = json.mimetype;
- // debugLog('plays here: '+(now_on_sequence - element.starts_on)/1000);
- // audioElement.addEventListener('canplaythrough', function(){
- // debugLog('CAN PLAY THROUGH');
- // if ( calledLoadShowCallback < 100 )
- // {
- // calledLoadShowCallback++;
- currentTimeP.innerText = ((now_on_sequence - element.starts_on)/1000);
- // audioElement.currentTime = ((now_on_sequence - element.starts_on)/1000);
- // audioElement.play();
- // }
- // }, {passive: true});
+ placeholders.currentTime.innerText = Math.floor((now_on_sequence - element.starts_on)/1000);
audioElement.addEventListener('ended', function(){
FetchJSON(`${listRequest}`, hashCallback, [ new Date().getTime() ]);
- // location.reload();
+ setTimeout(sync_radio, 10000);
});
- // audioElement.addEventListener('complete', ()=>{
- // debugLog("Download completed!")
- // var synced_at = sync_radio();
- // debugLog("Synced initially at : "+synced_at);
- // if ( synced_at === 0 )
- // {
- // if ( synced_at > audioElement.currentTime )
- // {
- // debugLog('Good sync!');
- // }
- // else
- // {
- setTimeout(sync_radio, 10000);
- // }
- // }
- // }, {passive: true});
+ setTimeout(sync_radio, 10000);
+}
+
+function slowIncreaseVolume()
+{
+ if (audioElement.volume < 0.91)
+ {
+ audioElement.volume += 0.05;
+ }
+ else
+ {
+ audioElement.volume = 1;
+ }
+}
+
+function fadeInAudio()
+{
+ setTimeout( slowIncreaseVolume, 250);
+ setTimeout( slowIncreaseVolume, 500);
+ setTimeout( slowIncreaseVolume, 750);
+ setTimeout( slowIncreaseVolume, 1000);
+ setTimeout( slowIncreaseVolume, 1250);
+ setTimeout( slowIncreaseVolume, 1500);
+ setTimeout( slowIncreaseVolume, 1750);
+ setTimeout( slowIncreaseVolume, 2050);
+ setTimeout( slowIncreaseVolume, 2350);
+ setTimeout( slowIncreaseVolume, 2700);
}
function sync_radio()
{
- var value = currentTimeP.innerText;
+ var value = placeholders.currentTime.innerText;
if ( value !== "" )
{
var new_now = parseFloat(value) + getSecondsHere();
- debugLog("Trying to sync @ "+ value + " + " +getSecondsHere() + " = " + new_now);
+ debugLog("Trying to sync @ "+ value + " + " + getSecondsHere() + " = " + new_now);
audioElement.currentTime = new_now;
audioElement.play();
audioElement.muted = false;
audioElement.volume = 0;
- debugLog(Date.now())
- debugLog(Date.now())
- debugLog(Date.now())
- debugLog(Date.now())
- debugLog(Date.now())
- setTimeout( audioElement.volume += 0.2, 500);
- setTimeout( audioElement.volume += 0.2, 1000);
- setTimeout( audioElement.volume += 0.2, 1500);
- setTimeout( audioElement.volume += 0.2, 2000);
- setTimeout( audioElement.volume += 0.2, 2500);
+ fadeInAudio();
return new_now;
}
return 0;
@@ -237,24 +235,54 @@ function sync_radio()
function listCallback(json, params)
{
debugLog('listCallback');
+ debugLog(json);
+ debugLog(params);
var [ now, hash_of_list ] = params;
var delta_time = now - json.started_on;
var min_times_played = Math.floor( delta_time / json.duration );
var max_times_to_be_played = delta_time / json.duration;
var Dt = max_times_to_be_played - min_times_played;
var now_on_sequence = Dt * json.duration;
+ placeholders.listStarted.innerText = json.started_on;
+ placeholders.listHash.innerText = hash_of_list;
+ placeholders.deltaTime.innerText = delta_time;
+ placeholders.dt.innerText = Dt;
+ placeholders.currentTime.innerText = now_on_sequence;
+ placeholders.listDuration.innerText = json.duration;
+ placeholders.minTimesPlayed.innerText = min_times_played;
+ placeholders.maxTimesPlayed.innerText = max_times_to_be_played;
+ placeholders.listInfo.innerText = JSON.stringify(json, null, 2);
debugLog(`now_on_sequence: ${now_on_sequence}, Dt: ${Dt}`)
- previous = { starts_on: 0 };
- json.list.forEach((element)=>{
- if ( now_on_sequence < element.starts_on && now_on_sequence > previous.starts_on){
- } else {
+ previous = { starts_on: -1 };
+ if ( json.list.length === 1 )
+ {
+ FetchJSON(`${jsonRequest}${previous.hash}`, loadShowCallback, [json, now_on_sequence, json.list[0], hash_of_list]);
+ }
+ for ( var i = 1; i < json.list.length; i++)
+ {
+ debugLog("getting there")
+ if ( now_on_sequence < json.list[i].starts_on && now_on_sequence > json.list[i-1].starts_on){
+
+ var tmp = document.createElement('pre');
+ tmp.innerText = JSON.stringify(json.list[i-1], null, 2);
+ placeholders.previouslyPlayed.append(tmp);
now_on_sequence = now_on_sequence - previous.starts_on;
+ debugLog(`now_on_sequence (1updated): ${now_on_sequence}`);
+ previous = json.list[i-1];
+ FetchJSON(`${jsonRequest}${previous.hash}`, loadShowCallback, [json, now_on_sequence, previous, hash_of_list]);
+ break;
+ }
+ else
+ {
+ var tmp = document.createElement('pre');
+ tmp.innerText = JSON.stringify(json.list[i-1], null, 2);
+ placeholders.previouslyPlayed.append(tmp);
debugLog(now_on_sequence);
- previous = element;
- debugLog(element);
- FetchJSON(`${jsonRequest}${element.hash}`, loadShowCallback, [json, now_on_sequence, element, hash_of_list]);
+ debugLog(json.list[i].starts_on);
+ FetchJSON(`${jsonRequest}${json.list[i].hash}`, loadShowCallback, [json, now_on_sequence, json.list[i], hash_of_list]);
+ debugLog(json.list[i-1].starts_on);
}
- });
+ }
}
function hashCallback(json, params)