@needle-tools/engine 4.5.2 → 4.5.4

package/src/engine-components/DropListener.ts

@@ -1,5 +1,4 @@
 import { AxesHelper, Box3, Cache, Object3D, Vector2, Vector3 } from "three";
-import type { GLTF } from "three/examples/jsm/loaders/GLTFLoader.js";
 
 import { isDevEnvironment } from "../engine/debug/index.js";
 import { AnimationUtils } from "../engine/engine_animation.js";
@@ -15,6 +14,7 @@ import { serializable } from "../engine/engine_serialization_decorator.js";
 import { fitObjectIntoVolume, getBoundingBox, placeOnSurface } from "../engine/engine_three_utils.js";
 import { IGameObject, Model, Vec3 } from "../engine/engine_types.js";
 import { getParam, setParamWithoutReload } from "../engine/engine_utils.js";
+import { determineMimeTypeFromExtension } from "../engine/engine_utils_format.js";
 import { Animation } from "./Animation.js";
 import { Behaviour } from "./Component.js";
 import { EventList } from "./EventList.js";
@@ -398,6 +398,7 @@ export class DropListener extends Behaviour {
         if (!Array.isArray(fileList)) return;
         if (!fileList.length) return;
 
+
         this.deleteDropEvent();
         this.removePreviouslyAddedObjects();
         setParamWithoutReload(blobKeyName, null);
@@ -408,7 +409,20 @@ export class DropListener extends Behaviour {
 
         for (const file of fileList) {
             if (!file) continue;
-            console.debug("Load file " + file.name);
+
+            if (file.type.startsWith("image/")) {
+                // Ignore dropped images
+                if (debug) console.warn("Ignoring dropped image file", file.name, file.type);
+                continue;
+            }
+            else if (file.name.endsWith(".bin")) {
+                // Ignore dropped binary files
+                if (debug) console.warn("Ignoring dropped binary file", file.name, file.type);
+                continue;
+            }
+
+
+            console.debug("Load file " + file.name + " + " + file.type);
             const res = await FileHelper.loadFile(file, this.context, { guid: this.guid });
             if (res) {
                 this.dispatchEvent(new CustomEvent(DropListenerEvents.FileDropped, { detail: file }));
@@ -625,38 +639,39 @@ namespace FileHelper {
      * @returns Promise containing the loaded model and its content hash, or null if loading failed
      */
     export async function loadFile(file: File, context: Context, args: { guid: string }): Promise<{ model: Model, contentMD5: string } | null> {
-        const name = file.name.toLowerCase();
-        if (name.endsWith(".gltf") ||
-            name.endsWith(".glb") ||
-            name.endsWith(".fbx") ||
-            name.endsWith(".obj") ||
-            name.endsWith(".usdz") ||
-            name.endsWith(".vrm") ||
-            file.type === "model/gltf+json" ||
-            file.type === "model/gltf-binary"
-        ) {
+        // first load it locally
+        const seed = args.guid;
+        const prov = new InstantiateIdProvider(seed);
+
+        const blob = new Blob([file], { type: file.type || determineMimeTypeFromExtension(file.name) || undefined });
+        const objectUrl = URL.createObjectURL(blob);
+
+        const model = await getLoader().loadSync(context, objectUrl, file.name, prov).catch(err => {
+            console.error(`Failed to load file "${file.name}" (${file.type}):`, err);
+            return null;
+        })
+
+        URL.revokeObjectURL(objectUrl); // clean up the object URL
+
+        if (model) {
             return new Promise((resolve, _reject) => {
                 const reader = new FileReader()
                 reader.readAsArrayBuffer(file);
                 reader.onloadend = async (_ev: ProgressEvent<FileReader>) => {
                     const content = reader.result as ArrayBuffer;
-                    // first load it locally
-                    const seed = args.guid;
-                    const prov = new InstantiateIdProvider(seed);
-                    const model = await getLoader().parseSync(context, content, file.name, prov);
-                    if (model) {
-                        const hash = BlobStorage.hashMD5(content);
-                        resolve({ model, contentMD5: hash });
-                    }
+                    const hash = BlobStorage.hashMD5(content);
+                    return resolve({ model, contentMD5: hash });
                 };
             });
         }
         else {
-            console.warn("Unsupported file type: " + name, file.type)
+            console.warn(`Failed to load "${file.name}" (${file.type})`);
+            return null;
         }
-
-        return null;
     }
+    //     return new Promise((resolve, _reject) => {
+    //     });
+    // }
 
     /**
      * Loads a 3D model from a URL with progress visualization