ChiShengChen/webcam_gaze_webapp — reverse-engineered prompt

Build me a browser app that lets someone use their webcam to track where they are looking on the screen. It should start with a clear 9 point calibration flow, ask for camera permission, then show a red dot following the user’s gaze and a small heatmap that can be shown, hidden, or cleared.

Add an image labeling mode where the user uploads an image, creates colored label categories, looks at an object, presses Space, and the app segments that object with Segment Anything in the browser if possible. Let them undo masks, change label colors, deselect labels, and export the labels as COCO JSON and YOLO TXT.

Also add a video annotation mode. The user can upload a video, connect a microphone, play and record, see their gaze dot over the video, save gaze points with timestamps and frame numbers, and export gaze JSON plus audio. Include drawing AOI rectangles, fixation and dwell time analysis, scanpath visualization, and CSV export. Use TypeScript, make it easy to run locally, and look up current docs online if needed.