hi there i'm looking for a player that has now playing the current track
now i have this code
so i've saved this as wildstyle-radio-widget.html on my server
with a iframe embedded code?
but unfortunately the current track says track unavalible?
wonder if anyone could help
now i have this code
Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Wildstyle Radio Widget</title>
<style>
body {
margin: 0;
background: #000;
font-family: 'Arial', sans-serif;
color: #fff;
}
.widget-container {
background: linear-gradient(135deg, #1a1a1a, #2c2c2c);
border: 2px solid #ff0055;
border-radius: 12px;
padding: 15px;
text-align: center;
box-shadow: 0 0 12px #ff0055;
}
h3 {
margin: 0;
font-size: 18px;
color: #ffcc00;
}
audio {
width: 100%;
margin-top: 10px;
}
.now-playing {
margin-top: 10px;
font-size: 14px;
color: #00ffcc;
}
.now-playing span {
font-weight: bold;
}
</style>
</head>
<body>
<div class="widget-container">
<h3>🎧 Wildstyle Radio</h3>
<audio id="audioPlayer" controls>
<source src="https://streaming.live365.com/a50378" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<div class="now-playing" id="nowPlaying">
Loading track...
</div>
</div>
<script>
async function fetchNowPlaying() {
try {
const proxyUrl = 'https://api.allorigins.win/get?url=' + encodeURIComponent('https://public.api.live365.com/station/a50378');
const response = await fetch(proxyUrl);
const result = await response.json();
const data = JSON.parse(result.contents);
const artist = data?.now_playing?.artist || "Unknown Artist";
const title = data?.now_playing?.title || "Unknown Track";
document.getElementById('nowPlaying').innerHTML = `🎵 <span>${title}</span> by <span>${artist}</span>`;
} catch (error) {
document.getElementById('nowPlaying').textContent = "Track info unavailable.";
console.error("Error fetching track:", error);
}
}
fetchNowPlaying();
setInterval(fetchNowPlaying, 15000); // update every 15 sec
</script>
</body>
</html>
so i've saved this as wildstyle-radio-widget.html on my server
with a iframe embedded code?
Code:
<iframe src="https://wildstyle.vip/widgets/wildstyle-radio-widget.html"
width="100%"
height="200"
style="border:none;overflow:hidden;"
scrolling="no"
allow="autoplay"
title="Wildstyle Radio Widget"></iframe>
but unfortunately the current track says track unavalible?
wonder if anyone could help