Update index.js

index.js

@@ -0,0 +1,35 @@
+import { pipeline, env } from "https://cdn.jsdelivr.net/npm/@huggingface/transformers"; // import Transformers.js
+
+env.allowLocalModels = false; // skip the local model check
+
+// create references to DOM elements
+const fileUpload = document.getElementById("file-upload");
+const imageContainer = document.getElementById("image-container");
+const status = document.getElementById("status");
+
+status.textContent = "Loading model..."; // status message for user
+
+// create object detection pipeline
+const detector = await pipeline("object-detection", "Xenova/detr-resnet-50");
+
+status.textContent = "Ready"; // status message for user
+
+// create image uploader
+fileUpload.addEventListener("change", function (e) {
+  const file = e.target.files[0];
+  if (!file) {
+    return;
+  }
+
+  const reader = new FileReader();
+
+  // Set up a callback when the file is loaded
+  reader.onload = function (e2) {
+    imageContainer.innerHTML = "";
+    const image = document.createElement("img");
+    image.src = e2.target.result;
+    imageContainer.appendChild(image);
+    // detect(image); // Uncomment this line to run the model
+  };
+  reader.readAsDataURL(file);
+});