Jednoduchý HTML přehrávač (volitelně)

Pokud nechcete plugin a preferujete vložit přehrávač ručně, můžete použít tento HTML kód:

<div class=“radio-widget“>
<button id=“radio-play-btn“ type=“button“>▶ Přehrát</button>
<span class=“radio-title“>Radio Zde</span>

<!– SEM vložte svůj stream (HTTPS!) –>
<audio id=“radio-audio“ preload=“none“
src=“https://live.djlinux.cz/stream„>
Váš prohlížeč nepodporuje HTML5 audio.
</audio>
</div>

<style>
.radio-widget {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 6px 10px;
border-radius: 6px;
background: #222;
color: #fff;
font-family: system-ui, -apple-system, BlinkMacSystemFont, „Segoe UI“;
font-size: 14px;
}

.radio-widget button {
border: none;
border-radius: 50%;
width: 36px;
height: 36px;
cursor: pointer;
background: #4caf50;
color: #fff;
font-size: 14px;
font-weight: bold;
}

.radio-widget button:focus {
outline: 2px solid #fff;
outline-offset: 2px;
}
</style>

<script>
(function() {
const audio = document.getElementById(‚radio-audio‘);
const btn = document.getElementById(‚radio-play-btn‘);

if (!audio || !btn) return;

btn.addEventListener(‚click‘, function () {
if (audio.paused) {
audio.play().then(() => {
btn.textContent = ‚⏸ Pauza‘;
}).catch(err => {
console.error(‚Nelze přehrát stream:‘, err);
});
} else {
audio.pause();
btn.textContent = ‚▶ Přehrát‘;
}
});

audio.addEventListener(‚ended‘, function () {
btn.textContent = ‚▶ Přehrát‘;
});
})();
</script>