🪄 Major refactoring to use ESP32 template

This includes the change to use https://github.com/runeharlyk/ESP32-rapid-development-template.git as a freeRTos template

app/src/components/Model/ModelView.svelte

@@ -18,12 +18,14 @@ import {
 	FogExp2,
 	MeshBasicMaterial,
 	CanvasTexture,
-	CircleGeometry
+	CircleGeometry,
+	Object3D,
+	type Event
 } from 'three';
 import { XacroLoader } from 'xacro-parser';
 import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
 import URDFLoader from 'urdf-loader';
-import { servoBuffer } from '../../lib/socket'
+import { dataBuffer, servoBuffer } from '../../lib/socket'
 import { lerp } from '../../lib/utils';
 import uzip from 'uzip';
 import { outControllerData } from '../../lib/store';
@@ -31,7 +33,7 @@ import Kinematic from '../../lib/kinematic';
 import location from '../../lib/location';
 import FileCache from '../../lib/cache';
 
-let canvas: HTMLCanvasElement, streamCanvas: HTMLCanvasElement, stream: HTMLImageElement, scene: Scene, camera: Camera, renderer: WebGLRenderer, controls: OrbitControls, robot, isLoaded = false;
+let canvas: HTMLCanvasElement, streamCanvas: HTMLCanvasElement, stream: HTMLImageElement, scene: Scene, camera: Camera, renderer: WebGLRenderer, controls: OrbitControls, robot: Object3D<Event>, isLoaded = false;
 
 let context: CanvasRenderingContext2D, texture: CanvasTexture
 
@@ -45,7 +47,7 @@ let modelBodyPoint:Point = {x: 0, y: 0, z: 0 }
 let modelTargetBodyPoint:Point = {x: 0, y: 0, z: 0 }
 
 const dir = [ -1, -1, -1, 1, -1, -1, -1, -1, -1, 1, -1, -1]
-const videoStream = `//${location}/stream`;
+const videoStream = `//${location}/api/stream`;
 
 let showModel = true, showStream = false
 
@@ -223,6 +225,8 @@ const render = () => {
 
     if(!robot) return
 
+    robot.rotation.z = lerp(robot.rotation.z, MathUtils.degToRad($dataBuffer[1]), 0.1)
+
     if(!isLoaded){
         const intervalId = setInterval(() => {
             robot.traverse(c => c.castShadow = true);

app/src/components/Topbar.svelte

@@ -31,7 +31,10 @@
                 <Icon src={Bars3} size="32" />
             </button>
         </div>
-        <div class="w-20 p-4 text-right">{Math.floor($dataBuffer[5])}°🌡️</div>
+        <div class="w-20 p-4 text-right">{Math.floor($dataBuffer[0])}°🌡️<br>
+            {Math.floor($dataBuffer[9]*10)/10}V<br>
+            {Math.floor($dataBuffer[8]*1000)/1000}A
+        </div>
     </div>
     <div class="absolute flex justify-center w-full">
         <div>