1
0

A page layout was changed.

This commit is contained in:
Alexander Andreev 2024-05-12 03:58:35 +04:00
parent d2db23be5d
commit 154682ea4f
Signed by: Arav
GPG Key ID: 25969B23DCB5CA34
3 changed files with 16 additions and 22 deletions

View File

@ -140,7 +140,7 @@ input#radio-volume {
appearance: slider-vertical; appearance: slider-vertical;
-webkit-appearance: slider-vertical; -webkit-appearance: slider-vertical;
accent-color: var(--primary-color); accent-color: var(--primary-color);
height: 5rem; height: 4rem;
margin-left: .5rem; } margin-left: .5rem; }
#player div:first-child { #player div:first-child {

View File

@ -11,11 +11,9 @@ async function updateStatus() {
if (!resp.ok || 200 != resp.status) { if (!resp.ok || 200 != resp.status) {
$("radio-song").textContent = $("radio-song").textContent =
$("radio-song-listeners").textContent =
$("radio-duration-estimate").textContent = $("radio-duration-estimate").textContent =
$("radio-duration").textContent = ""; $("radio-duration").textContent = "";
$("radio-listeners").textContent = $("radio-listeners").textContent = "0";
$("radio-listener-peak").textContent = "0";
$("last-songs").lastChild.remove(); $("last-songs").lastChild.remove();
return [-1, null]; return [-1, null];
} }
@ -28,7 +26,7 @@ async function updateStatus() {
for (let i = 0; i < s.last_songs.length; ++i) { for (let i = 0; i < s.last_songs.length; ++i) {
let row = $("last-songs").lastChild.insertRow(); let row = $("last-songs").lastChild.insertRow();
row.insertCell().appendChild(document.createTextNode(formatStartAt(new Date(s.last_songs[i].start_at)))); row.insertCell().appendChild(document.createTextNode(formatStartAt(new Date(s.last_songs[i].start_at))));
row.insertCell().appendChild(document.createTextNode((s.last_songs[i].listeners == 0 ? "" : s.last_songs[i].listeners + "/") + (s.last_songs[i].peak_listeners == 0 ? "" : s.last_songs[i].peak_listeners))); row.insertCell().appendChild(document.createTextNode((s.last_songs[i].listeners == undefined ? "" : s.last_songs[i].listeners + "/") + (s.last_songs[i].peak_listeners == undefined ? "" : s.last_songs[i].peak_listeners)));
row.insertCell().appendChild(document.createTextNode(`${s.last_songs[i].artist} - ${s.last_songs[i].title}`)); row.insertCell().appendChild(document.createTextNode(`${s.last_songs[i].artist} - ${s.last_songs[i].title}`));
} }
} }
@ -37,10 +35,8 @@ async function updateStatus() {
return [-1, null]; return [-1, null];
$("radio-song").textContent = `${s.current_song.artist} - ${s.current_song.title}`; $("radio-song").textContent = `${s.current_song.artist} - ${s.current_song.title}`;
$("radio-song-listeners").textContent = `${s.listeners.overall} / ${s.listeners.current_peak}`; $("radio-listeners").textContent = s.listeners;
$("radio-duration").textContent = formatDuration(new Date(s.current_song.duration_msec)); $("radio-duration").textContent = formatDuration(new Date(s.current_song.duration_msec));
$("radio-listeners").textContent = s.listeners.current;
$("radio-listener-peak").textContent = s.listeners.peak;
return [s.current_song.duration_msec, new Date(s.current_song.start_at)]; return [s.current_song.duration_msec, new Date(s.current_song.start_at)];
} }
@ -58,10 +54,6 @@ async function update() {
return 0; return 0;
} }
$("radio-update").addEventListener("click", async () =>
[cursong_duration_msec, cursong_startat] = await updateStatus());
let update_interval_id = null; let update_interval_id = null;
async function interval() { async function interval() {
switch (await update()) { switch (await update()) {

View File

@ -67,20 +67,22 @@ templ Index(curSong *radio.Song, sl []radio.Song, slLen int64, lstnrs *radio.Lis
</audio> </audio>
<div> <div>
if curSong != nil && curSong.Artist != "" { if curSong != nil && curSong.Artist != "" {
<p>Now playing: <span id="radio-song">{ curSong.Artist } - { curSong.Title }</span></p>
<p> <p>
<abbr title="Overall and peak numbers of listeners for a currently playing song">O/P</abbr>: <span id="radio-song-listeners">{ strconv.FormatInt(lstnrs.Overall(), 10) } / { strconv.FormatInt(lstnrs.CurrentPeak(), 10) }</span> <b>Listeners:</b> <span id="radio-listeners">{ strconv.FormatInt(lstnrs.Current(), 10) }</span>
Time: <span id="radio-duration-estimate"></span><span id="radio-duration">{ curSong.DurationString() }</span> <b>Duration:</b> <span id="radio-duration-estimate"></span><span id="radio-duration">{ curSong.DurationString() }</span>
</p>
<p>
<b>Song:</b> <span id="radio-song">{ curSong.Artist } - { curSong.Title }</span>
</p> </p>
} else { } else {
<p>Now playing: <span id="radio-song"></span></p>
<p> <p>
<abbr title="Overall and peak numbers of listeners for a currently playing song">O/P</abbr>: <span id="radio-song-listeners"></span> <b>Listeners:</b> <span id="radio-listeners">{ strconv.FormatInt(lstnrs.Current(), 10) }</span>
Time: <span id="radio-duration-estimate"></span><span id="radio-duration"></span> <b>Duration:</b> <span id="radio-duration-estimate"></span><span id="radio-duration">0:00</span>
</p>
<p>
<b>Song:</b> <span id="radio-song">-</span>
</p> </p>
} }
<p>Current/peak listeners: <span id="radio-listeners">{ strconv.FormatInt(lstnrs.Current(), 10) }</span> / <span id="radio-listener-peak">{ strconv.FormatInt(lstnrs.Peak(), 10) }</span></p>
<p class="small">Notice: information updates every new song. But you can <button id="radio-update">update</button> it forcibly.</p>
</div> </div>
</div> </div>
</section> </section>