fix(capture): ±90° tilt slider midpoint + two-finger rotate

Clamp tape tilt to [-90, 90] so the slider knob starts centered and
CCW works. PhotoStage pinch now tracks angle as well as zoom.
This commit is contained in:
grokbot_ty
2026-09-26 07:54:36 -07:00
parent ba30a340e6
commit b841b16cc0
5 changed files with 62 additions and 22 deletions
+8 -7
View File
@@ -1,7 +1,7 @@
<script lang="ts">
import type { Capture } from './capture.types';
import type { TapeTransform } from './tapeGeometry';
import { defaultTicks } from './tapeGeometry';
import { clampTiltDeg, defaultTicks } from './tapeGeometry';
import PhotoStage from './PhotoStage.svelte';
import { getCropFill, setCropFill } from '../settings/cropFill';
import { cropMarginFraction } from '../png/crop';
@@ -21,13 +21,14 @@
const onTapeChange = (t: TapeTransform) => setTape(t);
const nudgeTilt = (delta: number) => {
setTape({ ...tape, tiltDeg: tape.tiltDeg + delta });
setTape({ ...tape, tiltDeg: clampTiltDeg(tape.tiltDeg + delta) });
};
const setTilt = (deg: number) => {
setTape({ ...tape, tiltDeg: deg });
const clamped = clampTiltDeg(deg);
setTape({ ...tape, tiltDeg: clamped });
// Keep legacy path warm for any callers still using setAxisAngle.
setAxisAngle(deg);
setAxisAngle(clamped);
};
const nudgeZoom = (dir: number) => {
@@ -67,14 +68,14 @@
<div class="angle">
<button type="button" class="thumb" aria-label="Tilt left" on:click={() => nudgeTilt(-1)}>−</button>
<input
type="range" min="0" max="359" step="0.1"
value={((tiltShown % 360) + 360) % 360}
type="range" min="-90" max="90" step="0.1"
value={clampTiltDeg(tiltShown)}
on:input={(e) => setTilt(Number(e.currentTarget.value))}
/>
<button type="button" class="thumb" aria-label="Tilt right" on:click={() => nudgeTilt(1)}>+</button>
<span class="val">{tiltShown}°</span>
</div>
<p class="nudge">← → tilt 1° · Shift+← → 0.1° · or drag the ↻ handle</p>
<p class="nudge">±90° · ← → tilt 1° · Shift+← → 0.1° · two-finger twist · or drag the ↻ handle</p>
</div>
<div>