Category: Blog

Loading video...

let player; let isMuted = true; function onYouTubeIframeAPIReady() { player = new YT.Player('player', { height: '390', width: '640', playerVars: { listType: 'playlist', list: 'PL4F_kKUfCSwINXRCOUDbbJWi5AXkPlYLJ', autoplay: 1, mute: 1, rel: 0 }, events: { 'onReady': onPlayerReady, 'onStateChange': onPlayerStateChange } }); } function onPlayerReady(event) { updateVideoTitle(); const soundBtn = document.getElementById("sound-btn"); soundBtn.addEventListener("click", () => { if (isMuted) { player.unMute(); isMuted = false; soundBtn.innerHTML = "🔊 Mute"; soundBtn.style.background = "rgba(0,128,0,0.85)"; } else { player.mute(); isMuted = true; soundBtn.innerHTML = "🔇 Unmute"; soundBtn.style.background = "rgba(255,0,0,0.85)"; } }); } function onPlayerStateChange(event) { if (event.data === YT.PlayerState.PLAYING) { updateVideoTitle(); } } function updateVideoTitle() { const videoData = player.getVideoData(); document.getElementById("video-title").innerText = videoData.title; }