Create script.js

script.js

@@ -0,0 +1,90 @@
+// ------- Simple marquee for ticker -------
+(function(){
+  function initTicker(){
+    const el = document.getElementById("zenTicker");
+    if(!el) return;
+    let speed = parseFloat(el.dataset.speed || "38"); // px/sec
+    let x = el.offsetWidth;
+    const step = () => {
+      const dt = 1/60; // 60fps
+      x -= speed*dt;
+      if(x < -el.scrollWidth) x = el.offsetWidth;
+      el.style.transform = `translateX(${x}px)`;
+      requestAnimationFrame(step);
+    };
+    step();
+  }
+  // Run after mount
+  setTimeout(initTicker, 100);
+})();
+
+// ------- Teleprompter controls -------
+(function(){
+  let raf = null;
+  let y = 0;
+
+  function getScrollEl(){
+    return document.getElementById("prompterScroll");
+  }
+  function getSpeedEl(){
+    return document.getElementById("pSpeed");
+  }
+
+  function loop(){
+    const el = getScrollEl();
+    if(!el) return;
+    const playing = (el.dataset.playing === "true");
+    const speed = parseFloat(el.dataset.speed || "40"); // px/s
+    const dt = 1/60;
+    if(playing){
+      y -= speed*dt; // scroll up
+      el.style.transform = `translateY(${y}px)`;
+    }
+    raf = requestAnimationFrame(loop);
+  }
+
+  function togglePlay(){
+    const el = getScrollEl(); if(!el) return;
+    const playing = (el.dataset.playing === "true");
+    el.dataset.playing = (!playing).toString();
+  }
+  function speedDelta(d){
+    const el = getScrollEl(); if(!el) return;
+    let s = parseFloat(el.dataset.speed || "40");
+    s = Math.max(5, Math.min(200, s + d));
+    el.dataset.speed = String(s);
+    const sp = getSpeedEl(); if(sp) sp.textContent = `${Math.round(s)}px/s`;
+  }
+  function fullScreen(){
+    const vp = document.querySelector(".prompter__viewport");
+    if(!vp) return;
+    if(!document.fullscreenElement){
+      vp.requestFullscreen().catch(()=>{});
+    }else{
+      document.exitFullscreen().catch(()=>{});
+    }
+  }
+
+  function keyHandler(e){
+    if(e.key === " "){ e.preventDefault(); togglePlay(); }
+    if(e.key === "ArrowUp"){ e.preventDefault(); speedDelta(+5); }
+    if(e.key === "ArrowDown"){ e.preventDefault(); speedDelta(-5); }
+  }
+
+  function clickBind(){
+    const play = document.getElementById("pPlayPause");
+    const slow = document.getElementById("pSlower");
+    const fast = document.getElementById("pFaster");
+    const full = document.getElementById("pFullscreen");
+    if(play) play.onclick = togglePlay;
+    if(slow) slow.onclick = ()=>speedDelta(-5);
+    if(fast) fast.onclick = ()=>speedDelta(+5);
+    if(full) full.onclick = fullScreen;
+    document.addEventListener("keydown", keyHandler);
+  }
+
+  setTimeout(()=>{
+    clickBind();
+    if(!raf) loop();
+  }, 120);
+})();