• Logo tampil di website<br>
• Mention 1x per hari<br>
• Cocok untuk UMKM
</p>
<a class="wa" href="https://wa.me/6282121785751">Ambil Paket</a>
</div>

<div class="card">
<p><b>🥈 SILVER</b></p>
<p style="font-size:12px;">Mulai dari</p>
<p><b>Rp 350K / minggu</b></p>
<p style="font-size:12px;opacity:0.7;">
• Logo + banner website<br>
• Mention 2-3x per hari<br>
• Promosi di radio + WA
</p>
<a class="wa" href="https://wa.me/6282121785751">Ambil Paket</a>
</div>

<div class="card">
<p><b>🥇 GOLD</b></p>
<p style="font-size:12px;">Mulai dari</p>
<p><b>Rp 750K / minggu</b></p>
<p style="font-size:12px;opacity:0.7;">
• Prioritas iklan<br>
• Adlibs penyiar<br>
• Banner utama website<br>
• Request promo khusus
</p>
<a class="wa" href="https://wa.me/6282121785751">Ambil Paket</a>
</div>

<div class="card">
<p><b>👑 EXCLUSIVE</b></p>
<p style="font-size:12px;">Custom Price</p>
<p><b>Hubungi Kami</b></p>
<p style="font-size:12px;opacity:0.7;">
• Branding full event<br>
• Media partner<br>
• Campaign khusus brand<br>
• Exposure maksimal
</p>
<a class="wa" href="https://wa.me/6282121785751">Diskusi</a>
</div>

</div>
  
<h3>💼 Sponsored UMKM</h3>
<div class="grid">
<div class="card">
<img src="alkukers.jpg" loading="lazy">  
<p>AL-Kukers Food</p>
</div>
</div>
  
<footer>
© 2026 Winhart Radio • All Rights Reserved
</footer>

<script>

// FIREBASE INIT
const firebaseConfig = {
  apiKey: "AIzaSyBCwucuNtJnzFWXSqfwbK0_mti2sFH6ySk",
  authDomain: "winhart-radio.firebaseapp.com",
  databaseURL: "https://winhart-radio-default-rtdb.asia-southeast1.firebasedatabase.app",
  projectId: "winhart-radio",
  storageBucket: "winhart-radio.firebasestorage.app",
  messagingSenderId: "175933549849",
  appId: "1:175933549849:web:5af452f7c6fedea59fa988"
};

firebase.initializeApp(firebaseConfig);
const db = firebase.database();

  db.ref("nowPlaying").on("value", snap => {
  document.getElementById("nowPlaying").innerText = snap.val() || "On Air";
});

function checkDailyReset(){
  const today = new Date().toISOString().split("T")[0]; // format: YYYY-MM-DD

  db.ref("chat_reset").once("value", snapshot => {
    const lastReset = snapshot.val();

    if(lastReset !== today){
      // hapus chat
      db.ref("chat").remove();

      // simpan tanggal baru
      db.ref("chat_reset").set(today);

      console.log("✅ Chat reset harian berhasil");
    }
  });
}

// jalankan saat halaman dibuka
checkDailyReset();

const STREAM = "https://winhartradio.on-air.fm/listen/winhart_radio/radio.mp3";
function checkStream(){
  fetch(STREAM)
    .then(res => {
      if(res.ok){
        document.getElementById("liveStatus").innerHTML = "<span class='live-dot'></span> LIVE ON AIR";
      } else {
        throw new Error();
      }
    })
    .catch(() => {
      document.getElementById("liveStatus").innerHTML = "🔴 OFFLINE (Server)";
    });
}

setInterval(checkStream, 15000);
  
/* REQUEST WA (TIDAK DIUBAH) */
function kirimWA(){

let nama=document.getElementById("nama").value;
let lagu=document.getElementById("lagu").value;

if(nama=="" || lagu==""){
alert("Isi dulu nama & lagu");
return;
}

let text=`Halo Winhart Radio!%0ASaya ${nama}%0ARequest lagu: ${lagu}`;

window.open(`https://wa.me/6282121785751?text=${text}`,"_blank");

}

const listenerRef = db.ref("listeners");

const userId = "user_" + Math.random().toString(36).substr(2,9);

// TAMBAH USER
listenerRef.child(userId).set(true);

// HAPUS SAAT KELUAR
window.addEventListener("beforeunload", () => {
  listenerRef.child(userId).remove();
});

// HITUNG REALTIME
listenerRef.on("value", snapshot => {
  const total = snapshot.numChildren();
  document.getElementById("listeners").innerText = total;
});

// AUTO REMOVE JIKA KONEKSI PUTUS
const connectedRef = db.ref(".info/connected");

connectedRef.on("value", function(snap) {
  if (snap.val() === true) {
    listenerRef.child(userId).onDisconnect().remove();
  }
});
  
// update tiap 8 detik biar terasa live

const banners = [
"Banner3.jpg",

];

let bannerIndex = 0;

function rotateBanner(){
bannerIndex = (bannerIndex + 1) % banners.length;
document.getElementById("bannerSlider").src = banners[bannerIndex];
}

setInterval(rotateBanner,8000);  

const sponsorList = [

  "Banner3.jpg"
];

let sponsorIndex = 0;

function rotateSponsor(){
  sponsorIndex = (sponsorIndex + 1) % sponsorList.length;
  document.getElementById("sponsorSlide").src = sponsorList[sponsorIndex];
}

setInterval(rotateSponsor,8000);

let scrollPos = 0;

function slideCrew(direction){
  const track = document.getElementById("crewTrack");
  const cardWidth = 160; // lebar + gap

  scrollPos += direction * cardWidth;

  if(scrollPos < 0) scrollPos = 0;
  if(scrollPos > track.scrollWidth - 300){
    scrollPos = track.scrollWidth - 300;
  }

  track.style.transform = `translateX(-${scrollPos}px)`;
}

/* AUTO SLIDE */
setInterval(()=>{
  slideCrew(1);
},6000);

let lastSendTime = 0;

function sendChat(){
  const name = document.getElementById("chatName").value.trim();
  const text = document.getElementById("chatText").value.trim();

  // VALIDASI
  if(name === "" || text === "") return alert("Isi nama & pesan dulu");

  // ✅ PINDAHKAN KE SINI
  const lastUserMsg = localStorage.getItem("lastMsg");

  if(lastUserMsg && (Date.now() - lastUserMsg < 10000)){
    return alert("Tunggu 10 detik sebelum kirim lagi");
  }

  localStorage.setItem("lastMsg", Date.now());
  
  // BATAS PANJANG
  if(text.length > 100) return alert("Pesan max 100 karakter");

  // ANTI SPAM DELAY (5 DETIK)
  const now = Date.now();
  if(now - lastSendTime < 5000){
    return alert("Tunggu 5 detik sebelum kirim lagi");
  }
 lastSendTime = now;

  // FILTER KATA KASAR (SIMPLE)
  const banned = ["anjing","babi","kontol","tolol"];
  const lowerText = text.toLowerCase();

  for(let word of banned){
    if(lowerText.includes(word)){
      return alert("Pesan mengandung kata tidak pantas");
    }
  }

  const today = new Date().toISOString().split("T")[0];

  db.ref("chat/" + today).push({
    name: name,
    text: text,
    time: Date.now() 
});

  document.getElementById("chatText").value="";
}
      
function autoPlayVisibleVideo(){
  const cards = document.querySelectorAll(".video-card iframe");

  cards.forEach((iframe)=>{
    const rect = iframe.getBoundingClientRect();

    if(rect.left >= 0 && rect.right <= window.innerWidth){
      iframe.contentWindow.postMessage('{"event":"command","func":"playVideo","args":""}', '*');
    }else{
      iframe.contentWindow.postMessage('{"event":"command","func":"pauseVideo","args":""}', '*');
    }
  });
}

setInterval(autoPlayVisibleVideo,4000);

window.addEventListener("DOMContentLoaded", () => {

  const today = new Date().toISOString().split("T")[0];
  const msgBox = document.getElementById("chatMessages");

  msgBox.innerHTML = "";

  const loadedMessages = new Set();

  db.ref("chat/" + today).limitToLast(50).on("child_added", function(snapshot){

    if(loadedMessages.has(snapshot.key)) return;
    loadedMessages.add(snapshot.key);

    const data = snapshot.val();

    const msg = document.createElement("div");
    msg.className="chat-msg";

    msg.innerHTML = `<b>${data.name}</b>: ${data.text}`;

    msgBox.appendChild(msg);
    msgBox.scrollTop = msgBox.scrollHeight;
  });

});

function playRadio(){
  const player = document.getElementById("player");

  localStorage.setItem("radio_playing","yes");

  player.src = STREAM;
  player.play().catch(() => {
  console.log("Autoplay diblokir browser");
});

  document.getElementById("liveStatus").innerHTML="<span class='live-dot'></span> LIVE ON AIR";
  document.getElementById("miniStatus").innerText="🟢 LIVE";
}

window.onload = () => {
  console.log("Ready");

  if(localStorage.getItem("radio_playing") === "yes"){
    playRadio();
  }
};

const player = document.getElementById("player");

player.addEventListener("error", () => {
  document.getElementById("liveStatus").innerHTML="🔴 OFFLINE (Server)";
});

 function toggleRadio(){
  const player = document.getElementById("player");

  if(player.paused){
    playRadio();
  } else {
    player.pause();
    document.getElementById("miniStatus").innerText="⏸ PAUSED";
  }
} 

function playSong(src, title, el){

  const player = document.getElementById("player");

  // STOP RADIO
  player.pause();

  player.src = src;
  player.play();

  document.getElementById("nowPlaying").innerText = "🎵 " + title;
  document.getElementById("liveStatus").innerHTML = "🎧 PLAYING CHART";

  // RESET ACTIVE
  document.querySelectorAll(".chart-item").forEach(item=>{
    item.classList.remove("active");
  });

  // SET ACTIVE
  el.classList.add("active");

}

const videoJumbo = document.getElementById("videoJumbo");

videoJumbo.addEventListener("play", () => {
  const player = document.getElementById("player");
  player.pause();
  document.getElementById("liveStatus").innerHTML = "🎬 PLAYING VIDEO";
});
  
</script>

<div id="miniPlayer">
  <span id="miniStatus">🔴 OFFLINE</span>
  <button onclick="toggleRadio()">▶</button>
  
</div>

<div id="songMini" style="
position:fixed;
bottom:70px;
left:50%;
transform:translateX(-50%);
background:#111;
padding:10px 15px;
border-radius:20px;
display:none;
gap:10px;
align-items:center;
">
<span id="songTitle">-</span>
<button onclick="toggleSong()">▶</button>
</div>
  
</body>
</html>