MediaSyncView v3.0

MediaSyncView v2.1 — Bug Fixes & Improvements

Bug Fixes

• isSeeking deadlock — isSeeking now resets on seek slider mouseup when masterVideo is absent or has NaN duration; added 2–3s timeout fallback in stepFrame and doSeek so the flag never gets stuck permanently
• drawSplitLabel argument mutation — function no longer modifies the passed name string in-place
• bestGrid on empty state — drawGrid now returns early when there are no media elements, preventing a redundant render call
• Blob URL leak — URL.revokeObjectURL is now called on remove and clearAll for all media types (video and image); blob URLs from drag-and-drop are also detected and tracked via file.data prefix check
• isSeeking stuck on seek error — both stepFrame and doSeek now have a timeout fallback that releases isSeeking if onseeked never fires (e.g. corrupt file)
• Loupe stays active after second media added — loupeActive is now forcefully reset alongside the button state when updateControls disables the loupe button
• Annotation cleared on auto-deactivation — toggleAnnot now accepts a keepDrawing flag; automatic deactivations (play, split, diff, tile, loupe) pass true so the drawing is preserved; only explicit user action or Escape clears it
• syncAnnotCanvas race condition — skips resize if wrap has no size yet; validates imgData before putImageData; logs warnings instead of silently swallowing errors
• Tile checkerboard pattern — fixed from column-based ti%2 to true chess pattern (row+col)%2
• Keyboard shortcuts not working without mouse click — canvas now gets tabIndex=0 and focus() on load; focus is restored automatically after panel interactions

Localization

• Portuguese (pt) — fixed t_export which was incorrectly set to Spanish 'Guardar pantalla (S)'; corrected to 'Salvar tela (S)'

New Features

• Mobile layout — responsive CSS breakpoints at 640px and 400px: smaller buttons, flex-wrap panel, bottom-anchored popup menus
• Touch support — annotation canvas and split divider now respond to touch events; empty canvas tap opens file picker on mobile

Performance

• buildHelp — HTML string now built in a single pass and assigned once instead of repeated innerHTML += in a loop
• Annotation canvas — all getContext('2d') calls on the annotation canvas now pass {willReadFrequently: true}

Other

• MAX_MEDIA enforced on file input — loop breaks early when the limit is reached, consistent with drag-and-drop behavior
• p5.js loading — clarified that the ERR_FILE_NOT_FOUND console error for p5.min.js is expected when no local file is present; CDN fallback loads automatically

Version 2.0

New features

Loupe — magnifier that follows the cursor, active only with a single image. Key 8.

Difference mode — overlays two images using CSS difference blend. Pixels that match go black; differences glow. Key D.

Tile comparison — splits the shared image zone into a 2×2 / 3×3 / 4×4 checkerboard. Each tile shows either L or R image; hovering a tile fades in the opposite image at 55% opacity so you can see both at once. Key Q, popup for grid size.

Annotation — freehand pencil layer drawn on a separate canvas on top of media. Choose colour and brush size. Clears automatically when deactivated. Key A.

Save screen — exports the current view (all media + annotation if active) as a timestamped PNG. Key S.

Behaviour changes

• Mutual exclusion — Split view, Difference, Tile and Annotation disable each other; only one mode can be active at a time.
• Loupe is restricted to single-media view and is incompatible with Annotation.
• Annotation auto-disables during video playback.
• Zoom via scroll now works even when the annotation canvas overlay is present.
• Tile button — first click activates and opens the grid-size popup; second click deactivates.
• H key toggles Help open and closed (second press closes).
• Media limit capped at 32 files.

Renamed

Old	New	Key
Import	Open	O
Export view	Save screen	S

I18N

• Locales restructured: shared keys (k_playback, k_view, etc.) resolve at runtime so each locale file has no duplicated strings.
• APP_NAME, APP_VERSION, APP_FOOT extracted as constants — one place to update.
• Help modal split into two columns (Playback left, View + New + Other right).
• Help shown automatically on first visit via localStorage.

Bug fixes

• Drag-and-drop onto the canvas now works for all file types (p5 passes MIME strings; normalised to 'video'/'image' before use).
• Seek slider no longer resets isSeeking on mouseup before videos finish seeking; timecode updates correctly when paused.
• windowResized stub removed; canvas resizing is handled entirely by ResizeObserver.
• Dead variables isPanning, lastMX, lastMY removed.
• Export canvas now uses a stable id="p5-canvas" so the annotation canvas is never captured instead of the media canvas.

Version 1.0

Initial release