// JustRadio - Countdown Based Video Trigger (met debug-overlay en nieuws/ticker/Danny D)
(function () {
const API_URL = 'https://just.radio/api/proxy-nowplaying-justradio.php';
const JSON_URL = 'https://just.radio/youtube-cache/all-tracks-youtube.json';
const UPDATE_URL = 'https://just.radio/youtube-cache/update-track.php';
const BUMPER_URL = 'https://just.radio/wp-content/uploads/2025/05/JustRadio_Fade_Bumper_short.mp4';
const NEWS_VIDEO_URL = 'https://just.radio/wp-content/uploads/2025/06/NwsBckgrndFnl36MB-720WebShareName.mov';
const DANNY_D_VIDEO_URL = 'https://just.radio/wp-content/uploads/2025/05/Danny-D.mov';
const FALLBACK_VIDEOS = [
'https://just.radio/wp-content/uploads/2025/05/Top100_01.mp4',
'https://just.radio/wp-content/uploads/2025/05/Top100_02.mp4'
];
const BUMPER_DURATION = 10;
const VIDEO_START_OFFSET = 2;
let localCache = {};
let lastTrackId = "";
let startTime = 0;
let secondsLeft = 0;
let countdownInterval = null;
const container = document.getElementById('live-video-container');
const bumper = document.getElementById('bumper-video');
const ticker = document.getElementById('news-ticker');
const tickerContent = document.getElementById('news-ticker-content');
const debugBox = document.createElement('div');
debugBox.style = 'position: absolute; bottom: 10px; left: 10px; font-size: 11px; color: white; background: rgba(0,0,0,0.6); padding: 4px 6px; border-radius: 4px; z-index: 9999; font-family: monospace';
document.body.appendChild(debugBox);
function updateDebug(info) {
debugBox.innerHTML = info;
}
async function loadCache() {
try {
const res = await fetch(JSON_URL);
const rawCache = await res.json();
localCache = Object.fromEntries(Object.entries(rawCache).map(([k, v]) => [k.toLowerCase(), v]));
} catch (e) {
console.warn("⚠️ Cache niet geladen:", e);
}
}
async function fetchNowPlaying() {
try {
const res = await fetch(API_URL);
const data = await res.json();
const track = data?.now_playing;
if (!track || !track.song) return;
const trackId = track.sh_id;
const artist = track.song.artist;
const title = track.song.title;
secondsLeft = track.remaining ?? 210;
startTime = Date.now();
document.getElementById('track-info').textContent = `Now Playing ${artist} - ${title}`;
updateDebug(`🎵 ${artist} - ${title}
⏱ ${secondsLeft}s remaining`); if (trackId === lastTrackId) return; lastTrackId = trackId; startCountdown(artist, title); } catch (e) { console.error("🔴 Error bij ophalen nowplaying:", e); } } function startCountdown(artist, title) { if (countdownInterval) clearInterval(countdownInterval); countdownInterval = setInterval(() => { const elapsed = (Date.now() - startTime) / 1000; const remaining = secondsLeft - elapsed; updateDebug(`🎵 ${artist} - ${title}
⏱ ${Math.max(0, remaining.toFixed(1))}s remaining`); if (remaining <= (BUMPER_DURATION + VIDEO_START_OFFSET)) { clearInterval(countdownInterval); triggerVideo(artist, title); } }, 500); } async function triggerVideo(artist, title) { container.style.opacity = 0; // NEWS DETECTIE if (title.toLowerCase().includes("news")) { ticker.style.display = 'none'; tickerContent.style.animation = 'none'; bumper.src = NEWS_VIDEO_URL; bumper.style.display = 'block'; bumper.currentTime = 0; bumper.play(); setTimeout(() => { ticker.style.display = 'block'; void tickerContent.offsetWidth; tickerContent.style.animation = 'scroll-left 40s linear infinite'; }, 11000); bumper.onended = () => { bumper.style.display = 'none'; container.innerHTML = ''; container.style.opacity = 1; }; return; } // DANNY D if (artist.toLowerCase().includes("danny d")) { bumper.src = BUMPER_URL; bumper.style.display = 'block'; bumper.currentTime = 0; bumper.play(); bumper.onended = () => { bumper.style.display = 'none'; container.innerHTML = ``; container.style.opacity = 1; }; return; } // REGULIERE TRACK bumper.src = BUMPER_URL; bumper.style.display = 'block'; bumper.currentTime = 0; bumper.play(); bumper.onended = async () => { bumper.style.display = 'none'; container.style.opacity = 1; await playVideo(artist, title); }; } async function playVideo(artist, title) { const key = `${artist} - ${title}`.toLowerCase(); let videoId = localCache[key]; if (!videoId) { videoId = await fetchYouTubeVideoId(artist, title); if (videoId) { localCache[key] = videoId; await fetch(UPDATE_URL, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ key, youtube_id: videoId }) }); } } if (!videoId) { const fallback = FALLBACK_VIDEOS[Math.floor(Math.random() * FALLBACK_VIDEOS.length)]; container.innerHTML = ``; return; } const iframe = document.createElement('iframe'); iframe.src = `https://www.youtube.com/embed/${videoId}?rel=0&autoplay=1&mute=1&controls=0&modestbranding=1`; iframe.allow = 'autoplay; encrypted-media'; iframe.frameBorder = '0'; iframe.allowFullscreen = true; iframe.style = 'width: 100%; height: 100%; border: none;'; container.innerHTML = ''; container.appendChild(iframe); } async function fetchYouTubeVideoId(artist, title) { try { const query = encodeURIComponent(`${artist} ${title}`); const url = `https://www.googleapis.com/youtube/v3/search?part=snippet&type=video&maxResults=1&q=${query}&key=AIzaSyA2-wYz3dLa3QGiZHvHMcMqWYpocLx9Dzk`; const res = await fetch(url); const data = await res.json(); return data.items?.[0]?.id?.videoId ?? null; } catch (e) { console.warn("❌ YouTube lookup mislukt:", e); return null; } } loadCache(); fetchNowPlaying(); setInterval(fetchNowPlaying, 500); })();
⏱ ${secondsLeft}s remaining`); if (trackId === lastTrackId) return; lastTrackId = trackId; startCountdown(artist, title); } catch (e) { console.error("🔴 Error bij ophalen nowplaying:", e); } } function startCountdown(artist, title) { if (countdownInterval) clearInterval(countdownInterval); countdownInterval = setInterval(() => { const elapsed = (Date.now() - startTime) / 1000; const remaining = secondsLeft - elapsed; updateDebug(`🎵 ${artist} - ${title}
⏱ ${Math.max(0, remaining.toFixed(1))}s remaining`); if (remaining <= (BUMPER_DURATION + VIDEO_START_OFFSET)) { clearInterval(countdownInterval); triggerVideo(artist, title); } }, 500); } async function triggerVideo(artist, title) { container.style.opacity = 0; // NEWS DETECTIE if (title.toLowerCase().includes("news")) { ticker.style.display = 'none'; tickerContent.style.animation = 'none'; bumper.src = NEWS_VIDEO_URL; bumper.style.display = 'block'; bumper.currentTime = 0; bumper.play(); setTimeout(() => { ticker.style.display = 'block'; void tickerContent.offsetWidth; tickerContent.style.animation = 'scroll-left 40s linear infinite'; }, 11000); bumper.onended = () => { bumper.style.display = 'none'; container.innerHTML = ''; container.style.opacity = 1; }; return; } // DANNY D if (artist.toLowerCase().includes("danny d")) { bumper.src = BUMPER_URL; bumper.style.display = 'block'; bumper.currentTime = 0; bumper.play(); bumper.onended = () => { bumper.style.display = 'none'; container.innerHTML = ``; container.style.opacity = 1; }; return; } // REGULIERE TRACK bumper.src = BUMPER_URL; bumper.style.display = 'block'; bumper.currentTime = 0; bumper.play(); bumper.onended = async () => { bumper.style.display = 'none'; container.style.opacity = 1; await playVideo(artist, title); }; } async function playVideo(artist, title) { const key = `${artist} - ${title}`.toLowerCase(); let videoId = localCache[key]; if (!videoId) { videoId = await fetchYouTubeVideoId(artist, title); if (videoId) { localCache[key] = videoId; await fetch(UPDATE_URL, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ key, youtube_id: videoId }) }); } } if (!videoId) { const fallback = FALLBACK_VIDEOS[Math.floor(Math.random() * FALLBACK_VIDEOS.length)]; container.innerHTML = ``; return; } const iframe = document.createElement('iframe'); iframe.src = `https://www.youtube.com/embed/${videoId}?rel=0&autoplay=1&mute=1&controls=0&modestbranding=1`; iframe.allow = 'autoplay; encrypted-media'; iframe.frameBorder = '0'; iframe.allowFullscreen = true; iframe.style = 'width: 100%; height: 100%; border: none;'; container.innerHTML = ''; container.appendChild(iframe); } async function fetchYouTubeVideoId(artist, title) { try { const query = encodeURIComponent(`${artist} ${title}`); const url = `https://www.googleapis.com/youtube/v3/search?part=snippet&type=video&maxResults=1&q=${query}&key=AIzaSyA2-wYz3dLa3QGiZHvHMcMqWYpocLx9Dzk`; const res = await fetch(url); const data = await res.json(); return data.items?.[0]?.id?.videoId ?? null; } catch (e) { console.warn("❌ YouTube lookup mislukt:", e); return null; } } loadCache(); fetchNowPlaying(); setInterval(fetchNowPlaying, 500); })();
Loading...
Do you want to listen to JustRadio