mirror of
https://github.com/yeicor-3d/yet-another-cad-viewer.git
synced 2026-01-25 23:54:14 +01:00
better networked model loading
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
export class NetworkUpdateEvent extends Event {
|
||||
name: string;
|
||||
url: string;
|
||||
|
||||
constructor(name: string, url: string) {
|
||||
super("update");
|
||||
this.name = name;
|
||||
@@ -27,15 +28,11 @@ export class NetworkManager extends EventTarget {
|
||||
// Get the last part of the URL as the "name" of the model
|
||||
let name = url.split("/").pop();
|
||||
name = name?.split(".")[0] || `unknown-${Math.random()}`;
|
||||
let prevHash = this.knownObjectHashes[name];
|
||||
// Use a head request to get the hash of the file
|
||||
let response = await fetch(url, { method: "HEAD" });
|
||||
let response = await fetch(url, {method: "HEAD"});
|
||||
let hash = response.headers.get("etag");
|
||||
// Only trigger an update if the hash has changed
|
||||
if (hash !== prevHash) {
|
||||
this.knownObjectHashes[name] = hash;
|
||||
this.dispatchEvent(new NetworkUpdateEvent(name, url));
|
||||
}
|
||||
this.foundModel(name, hash, url);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -44,13 +41,7 @@ export class NetworkManager extends EventTarget {
|
||||
ws.onmessage = (event) => {
|
||||
let data = JSON.parse(event.data);
|
||||
console.debug("WebSocket message", data);
|
||||
let name = data.name;
|
||||
let prevHash = this.knownObjectHashes[name];
|
||||
let hash = data.hash;
|
||||
if (hash !== prevHash) {
|
||||
this.knownObjectHashes[name] = hash;
|
||||
this.dispatchEvent(new NetworkUpdateEvent(name, data.url));
|
||||
}
|
||||
this.foundModel(data.name, data.hash, data.url);
|
||||
};
|
||||
ws.onerror = (event) => {
|
||||
console.error("WebSocket error", event);
|
||||
@@ -60,4 +51,12 @@ export class NetworkManager extends EventTarget {
|
||||
setTimeout(() => this.monitorWebSocket(url), 500);
|
||||
}
|
||||
}
|
||||
|
||||
private foundModel(name: string, hash: string, url: string) {
|
||||
let prevHash = this.knownObjectHashes[name];
|
||||
if (hash !== prevHash) {
|
||||
this.knownObjectHashes[name] = hash;
|
||||
this.dispatchEvent(new NetworkUpdateEvent(name, url));
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -3,6 +3,7 @@ import type {ModelScene} from "@google/model-viewer/lib/three-components/ModelSc
|
||||
import {ref, Ref} from 'vue';
|
||||
import {Document} from '@gltf-transform/core';
|
||||
import {ModelViewerInfo} from "./viewer/ModelViewerWrapper.vue";
|
||||
import {splitGlbs} from "../models/glb/glbs";
|
||||
|
||||
type SceneManagerData = {
|
||||
/** When updated, forces the viewer to load a new model replacing the current one */
|
||||
@@ -32,6 +33,22 @@ export class SceneMgr {
|
||||
});
|
||||
}
|
||||
|
||||
/** Loads a GLB/GLBS model from a URL and adds it to the viewer or replaces it if the names match */
|
||||
static async loadModel(data: SceneManagerData, name: string, url: string) {
|
||||
let response = await fetch(url);
|
||||
if (!response.ok) throw new Error("Failed to fetch model: " + response.statusText);
|
||||
let glbsSplitter = splitGlbs(response.body!);
|
||||
let {value: numChunks} = await glbsSplitter.next();
|
||||
console.log("Loading model with", numChunks, "chunks");
|
||||
while (true) {
|
||||
let {value: chunk, done} = await glbsSplitter.next();
|
||||
if (done) break;
|
||||
console.log("Got chunk", chunk);
|
||||
// Override the current model with the new one
|
||||
data.viewerSrc = URL.createObjectURL(new Blob([chunk], {type: 'model/gltf-binary'}));
|
||||
}
|
||||
}
|
||||
|
||||
/** Should be called any model finishes loading successfully (after a viewerSrc update) */
|
||||
static onload(data: SceneManagerData, info: typeof ModelViewerInfo) {
|
||||
console.log("ModelViewer loaded", info);
|
||||
|
||||
Reference in New Issue
Block a user