feat: restructure client-side code

public/js/audio.js

@@ -0,0 +1,47 @@
+import { $audio, $bufferBadge, $progressFill, $recordDisc } from './dom.js';
+import { state } from './state.js';
+
+export function initAudioUI() {
+  try {
+    if ('preservesPitch' in $audio) $audio.preservesPitch = true;
+    if ('mozPreservesPitch' in $audio) $audio.mozPreservesPitch = true;
+    if ('webkitPreservesPitch' in $audio) $audio.webkitPreservesPitch = true;
+  } catch {}
+  $audio.addEventListener('timeupdate', () => {
+    const dur = $audio.duration || 0; if (!dur || !$progressFill) return;
+    const pct = Math.min(100, Math.max(0, ($audio.currentTime / dur) * 100));
+    $progressFill.style.width = pct + '%';
+  });
+  const showBuffer = (v) => {
+    state.isBuffering = v;
+    if ($bufferBadge) $bufferBadge.classList.toggle('hidden', !v);
+    if ($recordDisc) $recordDisc.classList.toggle('spin-record', !v && !$audio.paused);
+  };
+  $audio.addEventListener('waiting', () => showBuffer(true));
+  $audio.addEventListener('stalled', () => showBuffer(true));
+  $audio.addEventListener('canplay', () => showBuffer(false));
+  $audio.addEventListener('playing', () => showBuffer(false));
+  $audio.addEventListener('ended', () => { if ($recordDisc) $recordDisc.classList.remove('spin-record'); $audio.playbackRate = 1.0; });
+}
+
+export function applySync(startAt, serverNow) {
+  if (!startAt || !serverNow) return;
+  if (state.room?.state?.paused) return;
+  if (state.isBuffering) return;
+  const now = Date.now();
+  const elapsed = (now - startAt) / 1000;
+  const drift = ($audio.currentTime || 0) - elapsed;
+  const abs = Math.abs(drift);
+  if (abs > 1.0) {
+    $audio.currentTime = Math.max(0, elapsed);
+    if ($audio.paused) $audio.play().catch(()=>{});
+    $audio.playbackRate = 1.0;
+  } else if (abs > 0.12) {
+    const maxNudge = 0.03;
+    const sign = drift > 0 ? -1 : 1;
+    const rate = 1 + sign * Math.min(maxNudge, abs * 0.5);
+    $audio.playbackRate = Math.max(0.8, Math.min(1.2, rate));
+  } else {
+    if (Math.abs($audio.playbackRate - 1) > 0.001) { $audio.playbackRate = 1.0; }
+  }
+}