diff --git a/index.html b/index.html index fb5235d..8ed9b51 100644 --- a/index.html +++ b/index.html @@ -23,10 +23,6 @@ /* player wrapper */ .player-wrap { position: relative; background: #000; border-radius: 12px; overflow: hidden; } .player-wrap video { display: block; width: 100%; aspect-ratio: 16/9; object-fit: contain; background: #000; } - .empty-state { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 10px; color: #222; background: #f1f1f1; pointer-events: none; } - .empty-state svg { width: 52px; height: 52px; fill: #222; } - .empty-state span { font-size: 14px; } - .player-wrap.has-video .empty-state { display: none; } /* big center play */ .big-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 68px; height: 48px; background: rgba(255,255,255,.92); color: #111; border-radius: 12px; display: grid; place-items: center; pointer-events: none; opacity: 0; transition: opacity .15s; box-shadow: 0 2px 12px rgba(0,0,0,.35); } @@ -124,7 +120,6 @@
-
Select a recording from the timeline
@@ -432,7 +427,7 @@ // load date async function loadDate(date) { - video.pause(); video.removeAttribute("src"); activeClip = null; wrap.classList.remove("has-video"); setPlaying(false); + video.pause(); video.removeAttribute("src"); activeClip = null; setPlaying(false); const r = await fetch(`/api/recordings?date=${encodeURIComponent(date)}`); const d = await r.json(); clips = d.recordings; @@ -450,7 +445,6 @@ function playClip(clip, offset = 0) { activeClip = clip; initialOffset = offset; - wrap.classList.add("has-video"); document.querySelector("#clock").textContent = timeOfDay(clip.start + offset); video.src = `/video?date=${dateSelect.value}&name=${encodeURIComponent(clip.name)}&offset=${offset.toFixed(3)}`; video.play().catch(() => {});