Tune BIM zoom and modal layering

frontend/src/ui/controls/slider.js

@@ -60,6 +60,57 @@ export function createSliderControl({
     onChange?.(v);
   });
 
+  const clampValue = (next) => Math.min(Number(input.max), Math.max(Number(input.min), next));
+
+  const valueFromClientX = (clientX) => {
+    const rect = input.getBoundingClientRect();
+    const minValue = Number(input.min);
+    const maxValue = Number(input.max);
+    const range = maxValue - minValue;
+    if (!rect.width || !range) return Number(input.value);
+    const ratio = Math.max(0, Math.min(1, (clientX - rect.left) / rect.width));
+    const raw = minValue + (ratio * range);
+    if (input.step === "any") return clampValue(raw);
+    const stepValue = Number(input.step) || 1;
+    return clampValue(minValue + (Math.round((raw - minValue) / stepValue) * stepValue));
+  };
+
+  const commitValue = (nextValue) => {
+    input.value = nextValue;
+    updateFill();
+    onChange?.(Number(input.value));
+  };
+
+  let activeTouchPointerId = null;
+
+  const isTouchLikePointer = (event) => event.pointerType === "touch" || event.pointerType === "pen";
+
+  row.addEventListener("pointerdown", (event) => {
+    if (!isTouchLikePointer(event) || (event.button !== undefined && event.button !== 0)) return;
+    activeTouchPointerId = event.pointerId;
+    event.preventDefault();
+    row.setPointerCapture?.(event.pointerId);
+    input.focus?.({ preventScroll: true });
+    commitValue(valueFromClientX(event.clientX));
+  });
+
+  row.addEventListener("pointermove", (event) => {
+    if (activeTouchPointerId !== event.pointerId) return;
+    event.preventDefault();
+    commitValue(valueFromClientX(event.clientX));
+  });
+
+  const finishTouchPointer = (event) => {
+    if (activeTouchPointerId !== event.pointerId) return;
+    activeTouchPointerId = null;
+    if (row.hasPointerCapture?.(event.pointerId)) {
+      row.releasePointerCapture?.(event.pointerId);
+    }
+  };
+
+  row.addEventListener("pointerup", finishTouchPointer);
+  row.addEventListener("pointercancel", finishTouchPointer);
+
   updateFill();
 
   row.appendChild(lbl);