From c4377aa59d4d9e7c3c73bfbebac2e472fc54f783 Mon Sep 17 00:00:00 2001
From: Robin Krens <robin@robinkrens.nl>
Date: Wed, 24 Jan 2024 12:18:58 +0100
Subject: [PATCH] minor cleanups

---
 src/app.js  | 26 ++++++++++++++------------
 src/menu.js |  8 ++++----
 2 files changed, 18 insertions(+), 16 deletions(-)

diff --git a/src/app.js b/src/app.js
index 08ae6c7..5e79f44 100644
--- a/src/app.js
+++ b/src/app.js
@@ -2,21 +2,19 @@ import {Vec2, Box, World} from "planck";
 import * as MENU from "./menu.js";
 import PIDController from "./pid-controller.js";
 
-// Get the canvas element
 const canvas = document.getElementById("area");
 const ctx = canvas.getContext("2d");
 
 const world = World(Vec2(0, 0));
 
-canvas.width =	window.innerWidth;
+canvas.width = window.innerWidth;
 canvas.height = window.innerHeight;
 
 const PPM = 30;
 
-var targetX = 10;
-var targetY = -2.5;
+let targetX = 10;
+let targetY = -2.5;
 
-// Define the box properties
 const boxWidth = 1;
 const boxHeight = 1;
 
@@ -31,9 +29,9 @@ box.createFixture({
 const pid = new PIDController();
 MENU.initMenu(pid);
 
-canvas.addEventListener("click", function(event) {
+canvas.addEventListener("click", (event) => {
 	targetX = (event.clientX - canvas.getBoundingClientRect().left) / PPM;
-	targetY = -(event.clientY) / PPM
+	targetY = -(event.clientY) / PPM;
 	console.log("Updated target:", targetX, targetY);
 });
 
@@ -45,20 +43,23 @@ function render() {
 	// Clear the canvas
 	ctx.clearRect(0, 0, canvas.width, canvas.height);
 	ctx.fillStyle = "white";
-	ctx.fillRect(targetX * PPM, (-targetY * PPM), 30, 30);
+	ctx.fillRect(targetX * PPM, -targetY * PPM, 30, 30);
 
 	// Draw the box
 	ctx.save();
-	//ctx.translate(position.x * PPM, (-position.y * PPM));
 	ctx.rotate(angle);
 	ctx.fillStyle = "blue";
-	ctx.fillRect(position.x * PPM, (-position.y * PPM), boxWidth * PPM, boxHeight * PPM);
+	ctx.fillRect(
+		position.x * PPM,
+		-position.y * PPM,
+		boxWidth * PPM,
+		boxHeight * PPM
+	);
 	ctx.restore();
-	var force = pid.Update(1/60, {x: position.x, y: position.y}, {x: targetX, y: targetY});
+	const force = pid.Update(1 / 60, {x: position.x, y: position.y}, {x: targetX, y: targetY});
 	box.applyForce(force, box.getWorldCenter());
 }
 
-// Animation loop
 function animate() {
 	world.step(1 / 60);
 	render();
@@ -66,3 +67,4 @@ function animate() {
 }
 
 animate();
+
diff --git a/src/menu.js b/src/menu.js
index df6ec57..ec04d31 100644
--- a/src/menu.js
+++ b/src/menu.js
@@ -22,10 +22,10 @@ function initMenu(pid)
 	);
 	pidSettings.addInput(
 		pid.PIDParams, "derivativeMeasurement", {
-		options: {
-			error: "Error",
-			velocity: "Velocity"
-		}
+			options: {
+				error: "Error",
+				velocity: "Velocity"
+			}
 		});
 	pane.addMonitor(pid.PIDParams, "forceMagnitude", {
 		title: "Force (N)",
-- 
2.7.4