mail_kbanc_com
/
nice-gee
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix camera squish: center-crop video to match grid aspect ratio 

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
kbanc85 2026-02-15 13:24:41 -05:00
parent fe3ef6366a
commit 61f52c76b8
1 changed files with 19 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/lib/scenes/camera-scene.ts
View File

@ -201,11 +201,28 @@ export function createCameraScene(opts: CameraSceneOptions = {}): SceneDriver {
const { width, height, spans } = target; const { width, height, spans } = target;
// Draw video frame to canvas at grid resolution (mirrored) // Draw video frame to canvas at grid resolution (mirrored, center-cropped)
const vw = video.videoWidth || 320;
const vh = video.videoHeight || 240;
const gridAspect = width / height;
const videoAspect = vw / vh;
// Center-crop source to match grid aspect ratio (no stretch)
let sx = 0, sy = 0, sw = vw, sh = vh;
if (videoAspect > gridAspect) {
// Video is wider: crop sides
sw = vh * gridAspect;
sx = (vw - sw) / 2;
} else {
// Video is taller: crop top/bottom
sh = vw / gridAspect;
sy = (vh - sh) / 2;
}
ctx.save(); ctx.save();
ctx.translate(width, 0); ctx.translate(width, 0);
ctx.scale(-1, 1); ctx.scale(-1, 1);
ctx.drawImage(video, 0, 0, width, height); ctx.drawImage(video, sx, sy, sw, sh, 0, 0, width, height);
ctx.restore(); ctx.restore();
// Read pixel data // Read pixel data