Darkages/SpotMicroESP32-Leika
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adds simple data sync

Browse Source
This commit is contained in:
Rune Harlyk
2024-03-30 01:29:08 +01:00
committed by Rune Harlyk
parent 259bc0b5eb
commit 0fb2387e30
8 changed files with 73 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app2/src/lib/components/UpdateIndicator.svelte
+4
View File
@@ -29,6 +29,10 @@
}
);
const results = await response.json();
if (results.message == "Not Found") {
console.error('Error: Could not find releases in the repository');
return;
}
update = false;
firmwareVersion = '';
app2/src/lib/components/Visualization.svelte
+16 -20
View File
@@ -1,7 +1,6 @@
<script lang="ts">
import { onDestroy, onMount } from 'svelte';
import { BufferGeometry, Line, LineBasicMaterial, Vector3, type NormalBufferAttributes } from 'three';
import socketService from '$lib/services/socket-service';
import uzip from 'uzip';
import { model } from '$lib/stores';
import { footColor, isEmbeddedApp, location, toeWorldPositions } from '$lib/utilities';
@@ -19,8 +18,9 @@
let sceneManager = new SceneBuilder();
let canvas: HTMLCanvasElement
let modelAngles: number[] | Int16Array = [0, 45, 45, 0, 45, 45, 0, 45, 45, 0, 45, 45]// new Array(12).fill(0);
let modelTargetAngles: number[] | Int16Array = [0, 45, 45, 0, 45, 45, 0, 45, 45, 0, 45, 45] //new Array(12).fill(0);
let currentModelAngles: number[] = new Array(12).fill(0);
let modelTargetAngles: number[] = new Array(12).fill(0)
let gui_panel: GUI
let feet_trace = new Array(4).fill([]);
let trace_lines: BufferGeometry<NormalBufferAttributes>[] = []
@@ -35,18 +35,22 @@
await cacheModelFiles()
await createScene();
if (!isEmbeddedApp && panel) createPanel();
servoAngles.subscribe(angles => {
modelTargetAngles = angles
})
});
onDestroy(() => {
canvas.remove();
});
canvas.remove()
gui_panel?.destroy()
});
const createPanel = () => {
const panel = new GUI({width: 310});
panel.close();
panel.domElement.id = 'three-gui-panel';
gui_panel = new GUI({width: 310});
gui_panel.close();
gui_panel.domElement.id = 'three-gui-panel';
const visibility = panel.addFolder('Visualization');
const visibility = gui_panel.addFolder('Visualization');
visibility.add(settings, 'Trace feet')
visibility.add(settings, 'Trace points', 1, 1000, 1)
}
@@ -64,13 +68,6 @@
const updateAngles = (name: string, angle: number) => {
modelTargetAngles[$jointNames.indexOf(name)] = angle * (180 / Math.PI);
socketService.send(
JSON.stringify({
type: 'kinematic/angle',
angle: angle * (180 / Math.PI),
id: $jointNames.indexOf(name)
})
);
};
const createScene = async () => {
@@ -85,12 +82,12 @@
// .addArrowHelper({ origin: { x: 0, y: 0, z: 0 }, direction: { x: 0, y: -2, z: 0 } })
.addFogExp2(0xcccccc, 0.015)
.addModel($model)
.addDragControl(updateAngles)
.fillParent()
.addRenderCb(render)
.startRenderLoop();
if (sky) sceneManager.addSky()
if (debug) sceneManager.addDragControl(updateAngles)
for (let i = 0; i < 4; i++) {
const geometry = new BufferGeometry();
@@ -130,15 +127,14 @@
robot.position.y = robot.position.y - Math.min(...toes.map(toe => toe.y));
robot.rotation.z = lerp(robot.rotation.z, degToRad($mpu.heading + 90), 0.1);
modelTargetAngles = $servoAngles;
for (let i = 0; i < $jointNames.length; i++) {
modelAngles[i] = lerp(
currentModelAngles[i] = lerp(
(robot.joints[$jointNames[i]].angle as number) * (180 / Math.PI),
modelTargetAngles[i],
0.1
);
robot.joints[$jointNames[i]].setJointValue(degToRad(modelAngles[i]));
robot.joints[$jointNames[i]].setJointValue(degToRad(currentModelAngles[i]));
}
};
app2/src/lib/stores/socket-store.ts
+2 -8
View File
@@ -2,15 +2,13 @@ import { writable, type Writable } from 'svelte/store';
import { type angles } from '$lib/models';
export const isConnected = writable(false);
export const servoAngles: Writable<angles> = writable([
export const servoAngles: Writable<number[]> = writable([
0, 45, -90, 0, 45, -90, 0, 45, -90, 0, 45, -90
]);
export const logs = writable([] as string[]);
export const battery = writable({});
export const mpu = writable({ heading: 0 });
export const distances = writable({});
export const settings = writable({});
export const systemInfo = writable({} as number);
export interface socketDataCollection {
angles: Writable<angles>;
@@ -18,8 +16,6 @@ export interface socketDataCollection {
battery: Writable<unknown>;
mpu: Writable<unknown>;
distances: Writable<unknown>;
settings: Writable<unknown>;
systemInfo: Writable<unknown>;
}
export const socketData = {
@@ -27,7 +23,5 @@ export const socketData = {
logs,
battery,
mpu,
distances,
settings,
systemInfo
distances
};
app2/src/routes/+layout.svelte
+42 -1
View File
@@ -14,18 +14,57 @@
import Menu from './menu.svelte';
import Statusbar from './statusbar.svelte';
import Login from './login.svelte';
import { mode, outControllerData, servoAngles, socketData } from '$lib/stores';
import { throttler } from '$lib/utilities';
export let data: LayoutData;
type WebsocketOutData = string | ArrayBufferLike | Blob | ArrayBufferView;
onMount(async () => {
if ($user.bearer_token !== '') {
validateUser($user);
}
connectToEventSource();
connectToSocket()
addPublisher(outControllerData)
addPublisher(mode)
});
const connectToSocket = () => {
const ws_token = $page.data.features.security ? '?access_token=' + $user.bearer_token : '';
socket = new WebSocket('ws://' + $page.url.host + '/ws' + ws_token);
socket.onmessage = ((event: MessageEvent) => {
const message = JSON.parse(event.data);
if (message.type === 'log') {
socketData.logs.update((entries) => {
entries.push(message.data);
return entries;
});
} else if (message.data && message.type in socketData) {
const store = socketData[message.type as keyof typeof socketData];
if (JSON.stringify(get(store)) !== JSON.stringify(message.data))
store.set(message.data);
}
});
}
const addPublisher = (store: Writable<WebsocketOutData>, type?: string) => {
const publish = (data: WebsocketOutData) => {
console.log('Got updated', data);
if (socket.readyState === WebSocket.OPEN)
throttle.throttle(
() => socket.send(type ? JSON.stringify({ type, data }) : data),
100);
}
store.subscribe(publish);
}
onDestroy(() => {
NotificationSource?.close();
socket?.close();
});
async function validateUser(userdata: userProfile) {
@@ -47,8 +86,10 @@
}
let menuOpen = false;
let throttle = new throttler();
let NotificationSource: EventSource;
let socket: WebSocket
let reconnectIntervalId: number = 0;
let connectionLost = false;
let unresponsiveTimeout: number;
@@ -155,7 +196,7 @@
function reconnectEventSource() {
if (connectionLost === false) {
NotificationSource.close;
NotificationSource.close();
notifications.error('Connection to device lost', 5000);
if (reconnectIntervalId === 0) {
reconnectIntervalId = setInterval(connectToEventSource, 2000) as unknown as number;
app2/src/routes/+page.svelte
+1 -1
View File
@@ -9,7 +9,7 @@
<div class="hero bg-base-100 h-screen">
<div class="card md:card-side bg-base-200 shadow-2xl flex justify-center items-center">
<div class="w-64 h-64">
<Visualization sky={false} orbit={true} panel={false}/>
<Visualization sky={false} orbit panel={false}/>
</div>
<div class="card-body w-80">
<h2 class="card-title text-center text-2xl">Welcome to {data.app_name}</h2>
app2/src/routes/controller/+page.svelte
+1 -1
View File
@@ -4,6 +4,6 @@
<div class="grow flex">
<div class="absolute h-screen w-full top-0">
<Visualization />
<Visualization debug />
</div>
</div>
app2/src/routes/login.svelte
+1 -1
View File
@@ -78,7 +78,7 @@
<button
class="btn btn-primary inline-flex items-center"
on:click={() => {
signInUser({ username: username, password: password });
signInUser({ username, password });
}}><Login class="mr-2 h-5 w-5" /><span>Login</span></button
>
</div>