fix: float circle releases pointer capture on pointerup/cancel so page stays responsive

This commit is contained in:
root
2026-04-11 23:56:14 +05:00
parent 0c6c3b8c43
commit e5ba00c6ee

View File

@@ -981,7 +981,7 @@
let floatMoved = $state(false); let floatMoved = $state(false);
function onFloatPointerDown(e: PointerEvent) { function onFloatPointerDown(e: PointerEvent) {
e.preventDefault(); e.stopPropagation();
floatDragging = true; floatDragging = true;
floatMoved = false; floatMoved = false;
floatDragStart = { mx: e.clientX, my: e.clientY, ox: audioStore.floatPos.x, oy: audioStore.floatPos.y }; floatDragStart = { mx: e.clientX, my: e.clientY, ox: audioStore.floatPos.x, oy: audioStore.floatPos.y };
@@ -1000,12 +1000,14 @@
}; };
audioStore.floatPos = clampFloatPos(raw.x, raw.y); audioStore.floatPos = clampFloatPos(raw.x, raw.y);
} }
function onFloatPointerUp() { function onFloatPointerUp(e: PointerEvent) {
if (!floatDragging) return;
if (floatDragging && !floatMoved) { if (floatDragging && !floatMoved) {
// Tap: toggle play/pause // Tap: toggle play/pause
audioStore.toggleRequest++; audioStore.toggleRequest++;
} }
floatDragging = false; floatDragging = false;
try { (e.currentTarget as HTMLElement).releasePointerCapture(e.pointerId); } catch { /* ignore */ }
} }
// Clamp saved position to viewport on mount and on resize // Clamp saved position to viewport on mount and on resize
@@ -1525,7 +1527,7 @@
onpointerdown={onFloatPointerDown} onpointerdown={onFloatPointerDown}
onpointermove={onFloatPointerMove} onpointermove={onFloatPointerMove}
onpointerup={onFloatPointerUp} onpointerup={onFloatPointerUp}
onpointercancel={onFloatPointerUp} onpointercancel={(e) => { floatDragging = false; try { (e.currentTarget as HTMLElement).releasePointerCapture(e.pointerId); } catch { /* ignore */ } }}
> >
<!-- Pulsing ring when playing --> <!-- Pulsing ring when playing -->
{#if audioStore.isPlaying} {#if audioStore.isPlaying}