45 lines
2 KiB
JavaScript
45 lines
2 KiB
JavaScript
|
'use strict';
|
||
|
|
|
||
|
|
// ---------------------------------------------------------------------------
|
||
|
|
// Radio sidebar (compact player)
|
||
|
|
// ---------------------------------------------------------------------------
|
||
|
|
|
||
|
|
function openRadioSidebar() {
|
||
|
|
const stationName = currentStation ? escapeHtml(currentStation.name) : '— kein Sender —';
|
||
|
|
const track = currentTrack ? escapeHtml(currentTrack) : '';
|
||
|
|
const vol = document.getElementById('volume')?.value ?? 204;
|
||
|
|
|
||
|
|
const rows = [...document.querySelectorAll('#saved-tbody tr[data-id]')];
|
||
|
|
const stationsHtml = rows.length
|
||
|
|
? rows.map(r => `<li><button class="btn btn-sm rsb-play-btn" data-url="${escapeHtml(r.dataset.url || '')}" data-name="${escapeHtml(r.dataset.name || '')}">${escapeHtml(r.dataset.name || '')}</button></li>`).join('')
|
||
|
|
: `<li class="muted">Keine gespeicherten Sender.</li>`;
|
||
|
|
|
||
|
|
const html = `
|
||
|
|
<div class="rsb-nowplaying">
|
||
|
|
<div class="rsb-station-name">${stationName}</div>
|
||
|
|
${track ? `<div class="rsb-track muted">${track}</div>` : ''}
|
||
|
|
</div>
|
||
|
|
<div class="rsb-controls">
|
||
|
|
<button class="btn ${isPlaying ? 'playing' : ''}" id="rsb-playstop">${isPlaying ? '⏹ Stopp' : '▶ Abspielen'}</button>
|
||
|
|
<label class="rsb-vol">Lautst. <input type="range" id="rsb-volume" min="0" max="255" value="${vol}"></label>
|
||
|
|
</div>
|
||
|
|
<ul class="rsb-station-list">${stationsHtml}</ul>
|
||
|
|
`;
|
||
|
|
|
||
|
|
openSidebar('Radio', html);
|
||
|
|
|
||
|
|
const body = $('sidebar-body');
|
||
|
|
body.querySelector('#rsb-playstop').addEventListener('click', togglePlayStop);
|
||
|
|
body.querySelector('#rsb-volume').addEventListener('input', function () {
|
||
|
|
const v = this.value;
|
||
|
|
const mainSlider = document.getElementById('volume');
|
||
|
|
const mainNum = document.getElementById('volume-num');
|
||
|
|
if (mainSlider) mainSlider.value = v;
|
||
|
|
if (mainNum) mainNum.value = v;
|
||
|
|
audio.volume = v / 255;
|
||
|
|
});
|
||
|
|
body.querySelectorAll('.rsb-play-btn').forEach(btn => {
|
||
|
|
btn.addEventListener('click', () => playStation(btn.dataset.url, btn.dataset.name, null));
|
||
|
|
});
|
||
|
|
}
|