Apparently, you get 640x480 unless you ask for more? Need to constrain
the viewer size, though, otherwise it massively overflows the page and
makes it impossible to see what you're taking a picture of.
I've implemented the UI using TypeScript and Shoelace. I originally
started with Pico CSS, but I didn't really like its visuals. Since
capturing photos using the camera requires JavaScript, and that's
basically the entire point of this application, Shoelace's JavaScript
dependency (for WebComponents), is acceptable.
The photo capture uses the Media Capture Web API, which exposes the
camera directly as a video stream. We capture a frame from this stream
and save it in a canvas, which we then pass to Cropper.js to let the
user select only the relevant portion of the picture containing the
receipt itself.
Dustin