Draw most recent targets on webpage
Draws the most recently received targets from each camera in yellow.
Change-Id: I32b31d1b350cc5579dfdd202adeb661fd16c1332
diff --git a/y2019/vision/server/www/main.ts b/y2019/vision/server/www/main.ts
index a260787..0d88a43 100644
--- a/y2019/vision/server/www/main.ts
+++ b/y2019/vision/server/www/main.ts
@@ -1,6 +1,6 @@
import {FIELD_WIDTH, FT_TO_M} from './constants';
import {drawField, drawTarget} from './field';
-import {drawRobot} from './robot';
+import {drawRobot, Frame} from './robot';
function main(): void {
const vis = new Visualiser();
@@ -16,7 +16,7 @@
private targetX = 0;
private targetY = 0;
private targetTheta = 0;
- private cameraColors = ['red', 'red', 'red', 'red', 'red'];
+ private cameraFrames : Frame[];
constructor() {
const canvas = <HTMLCanvasElement>document.getElementById('field');
@@ -30,6 +30,7 @@
initWebSocket(server: string): void {
const socket = new WebSocket(`ws://${server}/ws`);
const reader = new FileReader();
+ this.cameraFrames = [];
reader.addEventListener('loadend', (e) => {
const text = e.srcElement.result;
const j = JSON.parse(text);
@@ -44,13 +45,7 @@
this.targetY = j.lineFollowDebug.goalTarget.y;
this.targetTheta = j.lineFollowDebug.goalTarget.theta;
}
- for (let ii of [0, 1, 2, 3, 4]) {
- if (j.cameraDebug[ii].timeSinceLastTarget > 0.25) {
- this.cameraColors[ii] = 'red';
- } else {
- this.cameraColors[ii] = 'green';
- }
- }
+ this.cameraFrames = j.cameraDebug;
});
socket.addEventListener('message', (event) => {
reader.readAsText(event.data);
@@ -81,7 +76,7 @@
this.reset(ctx);
drawField(ctx);
- drawRobot(ctx, this.x, this.y, this.theta, this.cameraColors);
+ drawRobot(ctx, this.x, this.y, this.theta, this.cameraFrames);
ctx.save();
ctx.lineWidth = 2.0 * ctx.lineWidth;
if (this.targetLocked) {