Upload 51 files

README.md

@@ -1,13 +1,13 @@
----
-title: FastVLMBoxes (Use File Upload, Not Webcam)
-emoji: 📈
-colorFrom: purple
-colorTo: pink
-sdk: static
-pinned: false
-app_build_command: npm run build
-app_file: dist/index.html
-short_description: Real-time video boxing powered by FastVLM
----
-
+---
+title: FastVLM WebGPU
+emoji: 🍎
+colorFrom: blue
+colorTo: green
+sdk: static
+pinned: false
+app_build_command: npm run build
+app_file: dist/index.html
+short_description: Real-time video captioning powered by FastVLM
+---
+
 Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

src/components/MultiSourceCaptioningView.tsx

@@ -2,11 +2,11 @@ import { useState, useRef, useEffect } from "react";
 import { useVLMContext } from "../context/useVLMContext";
 import { drawBoundingBoxesOnCanvas } from "./BoxAnnotator";
 
-const MODES = ["Webcam", "File"] as const;
+const MODES = ["File"] as const;
 type Mode = typeof MODES[number];
 
 const EXAMPLE_VIDEO_URL = "/space/videos/1.mp4";
-const EXAMPLE_PROMPT = "Detect each individual bird in the image. The birds are moving. For each object, output a JSON array of objects with fields. Each bird should have its own ([x1, y1, x2, y2]) where coordinates are in pixel values. This should be used to draw a box using the points around the bird. Follow the format of this Example: [x1, y1, x2, y2], [x1, y1, x2, y2]";
+const EXAMPLE_PROMPT = "Detect each individual animated characters in the image. The characters are moving. For each character, output a JSON array of objects with fields. Each character should have its own ([x1, y1, x2, y2]) where coordinates are in pixel values. No coordinates should be the same. This should be used to draw a box using the points around the character. This is an example of two boxes, the format of this : [x1, y1, x2, y2], [x1, y1, x2, y2]";
 
 function isImageFile(file: File) {
   return file.type.startsWith("image/");