📦 Moves all model loading to model-utilities

app/src/lib/components/Visualization.svelte

@@ -1,10 +1,8 @@
 <script lang="ts">
 	import { onDestroy, onMount } from 'svelte';
 	import { BufferGeometry, Line, LineBasicMaterial, Mesh, MeshBasicMaterial, Object3D, SphereGeometry, Vector3, type NormalBufferAttributes, type Object3DEventMap } from 'three';
-	import uzip from 'uzip';
 	import { ModesEnum, kinematicData, mode, model, outControllerData, servoAnglesOut, servoAngles, mpu, jointNames } from '$lib/stores';
-	import { footColor, isEmbeddedApp, throttler, toeWorldPositions } from '$lib/utilities';
-	import { fileService } from '$lib/services';
+	import { footColor, isEmbeddedApp, populateModelCache, throttler, toeWorldPositions } from '$lib/utilities';
 	import SceneBuilder from '$lib/sceneBuilder';
 	import { lerp, degToRad } from 'three/src/math/MathUtils';
     import { GUI } from 'three/addons/libs/lil-gui.module.min.js';
@@ -76,7 +74,7 @@
     }
 
 	onMount(async () => {
-        await cacheModelFiles()
+        await populateModelCache();
         await createScene();
         if (!isEmbeddedApp && panel) createPanel();
         servoAngles.subscribe(updateAnglesFromStore)
@@ -130,17 +128,6 @@
         ])
     }
 
-	const cacheModelFiles = async () => {
-		let data = await fetch('/stl.zip').then((data) => data.arrayBuffer());
-
-		var files = uzip.parse(data);
-
-		for (const [path, data] of Object.entries(files) as [path: string, data: Uint8Array][]) {
-			const url = new URL(path, window.location.href);
-			fileService.saveFile(url.toString(), data);
-		}
-	};
-
 	const updateAngles = (name: string, angle: number) => {
 		modelTargetAngles[$jointNames.indexOf(name)] = angle * (180 / Math.PI);
         Throttler.throttle(() => servoAnglesOut.set(modelTargetAngles.map(num => Math.round(num))), 100)

app/src/lib/stores/index.ts

@@ -3,3 +3,6 @@ export * from './logging-store';
 export * from './model-store';
 export * from './socket';
 export * from './fullscreen';
+export * from './telemetry';
+export * from './analytics';
+export * from './user';

app/src/lib/utilities/model-utilities.ts

@@ -2,9 +2,35 @@ import { Color, LoaderUtils, Vector3 } from 'three';
 import URDFLoader, { type URDFRobot } from 'urdf-loader';
 import { XacroLoader } from 'xacro-parser';
 import { Result } from '$lib/utilities';
+import { jointNames, model } from '$lib/stores';
+import uzip from 'uzip';
+import { fileService } from '$lib/services';
 
 let model_xml: XMLDocument;
 
+export const populateModelCache = async () => {
+	await cacheModelFiles();
+	const modelRes = await loadModelAsync('/spot_micro.urdf.xacro');
+	if (modelRes.isOk()) {
+		const [urdf, JOINT_NAME] = modelRes.inner;
+		jointNames.set(JOINT_NAME);
+		model.set(urdf);
+	} else {
+		console.error(modelRes.inner, { exception: modelRes.exception });
+	}
+};
+
+export const cacheModelFiles = async () => {
+	let data = await fetch('/stl.zip');
+
+	var files = uzip.parse(await data.arrayBuffer());
+
+	for (const [path, data] of Object.entries(files) as [path: string, data: Uint8Array][]) {
+		const url = new URL(path, window.location.href);
+		fileService.saveFile(url.toString(), data);
+	}
+};
+
 export const loadModelAsync = async (
 	url: string
 ): Promise<Result<[URDFRobot, string[]], string>> => {