fixed preloading and integrated vis

src/app/assetPreloaderService.ts

@@ -29,13 +29,36 @@ export class AssetPreloaderService {
 				const url = URL.createObjectURL(blob);
 				if (entry.type === 'image') {
 					const img = new Image();
+					const loadedPromise = new Promise<void>((resolve, reject) => {
+						img.onload = () => {
+							URL.revokeObjectURL(url);
+							resolve();
+						};
+						img.onerror = (e) => {
+							console.error(`Failed to load image: ${entry.path}`, e);
+							URL.revokeObjectURL(url);
+							reject(e);
+						};
+					});
 					img.src = url;
-					this.images.set(entry.path, img);
+					return loadedPromise.then(() => {
+						this.images.set(entry.path, img);
+					});
 				} else if (entry.type === 'audio') {
 					const audio = new Audio();
+					const loadedPromise = new Promise<void>((resolve, reject) => {
+						audio.oncanplaythrough = () => resolve();
+						audio.onerror = (e) => {
+							console.error(`Failed to load audio: ${entry.path}`, e);
+							resolve(); // Don't reject to avoid blocking all
+						};
+					});
 					audio.src = url;
-					this.audio.set(entry.path, audio);
+					return loadedPromise.then(() => {
+						this.audio.set(entry.path, audio);
+					});
 				}
+				return Promise.resolve();
 			})
 		);
 
@@ -44,21 +67,24 @@ export class AssetPreloaderService {
 
 	private async loadAsset(entry: AssetEntry): Promise<Blob> {
 		const response = await fetch(`/assets/${entry.path}`);
+		if (!response.ok) {
+			throw new Error(`Failed to fetch asset: ${entry.path}`);
+		}
+		const contentType = response.headers.get('Content-Type') || undefined;
 		const reader = response.body?.getReader();
 		let loaded = 0;
 		const chunks = [];
 
 		while (true) {
 			const { done, value } = await reader!.read();
-			if (done) 
-                break;
+			if (done) break;
 			chunks.push(value);
 			loaded += value.length;
 			this.loadedBytes += value.length;
 			this._progress.next(this.loadedBytes / this.totalBytes);
 		}
 
-		return new Blob(chunks);
+		return new Blob(chunks, contentType ? { type: contentType } : undefined);
 	}
 
 	getImage(name: string): HTMLImageElement {