started work on debug mode

Author: SizzinSeal

scripts/events.js

@@ -440,7 +440,49 @@ uploadDebugBtn.onchange = function() {
     data = reader.result;
     // split the data into lines
     const lines = data.split('\n');
-    // get path points
+
+    // loop to get path points
+    let i = 0;
+    while (lines[i] != 'debug') {
+      i++;
+      const line = lines[i].split(', ');
+      const x = parseFloat(line[0]);
+      const y = parseFloat(line[1]);
+      const velocity = parseFloat(line[2]);
+      const p = new Point(x, y);
+      p.velocity = velocity;
+      debugPath.push(p);
+    }
+
+
+    /*
+     * Debug Data Format
+     * timestamp, rbtX, rbtY, rbtH, closestX, closestY, lookaheadX, lookaheadY,
+     *     curvature, targetVel, leftTargetVel, rightTargetVel,
+     *     leftVel, rightVel
+     */
+    // loop to get debug data
+    for (i++; i < lines.length; i++) {
+      const line = lines[i].split(', ');
+      const timestamp = parseFloat(line[0]);
+      const rbtX = parseFloat(line[1]);
+      const rbtY = parseFloat(line[2]);
+      const rbtH = parseFloat(line[3]);
+      const closestX = parseFloat(line[4]);
+      const closestY = parseFloat(line[5]);
+      const lookaheadX = parseFloat(line[6]);
+      const lookaheadY = parseFloat(line[7]);
+      const curvature = parseFloat(line[8]);
+      const targetVel = parseFloat(line[9]);
+      const leftTargetVel = parseFloat(line[10]);
+      const rightTargetVel = parseFloat(line[11]);
+      const leftVel = parseFloat(line[12]);
+      const rightVel = parseFloat(line[13]);
+      const debugData = new DebugData(timestamp, rbtX, rbtY, rbtH, closestX,
+          closestY, lookaheadX, lookaheadY, curvature, targetVel,
+          leftTargetVel, rightTargetVel, leftVel, rightVel);
+      debugDataList.push(debugData);
+    }
   };
 };
 
@@ -449,5 +491,16 @@ uploadDebugBtn.onchange = function() {
  * @brief mode button clicked
  */
 modeBtn.onclick = function() {
-
+  const cols = document.getElementsByClassName('sliderContainer');
+  if (cols[0].style.display === 'none') {
+    mode = 0;
+    for (i = 0; i < cols.length; i++) {
+      cols[i].style.display = 'flex';
+    }
+  } else {
+    mode = 1;
+    for (i = 0; i < cols.length; i++) {
+      cols[i].style.display = 'none';
+    }
+  }
 };

scripts/index.js

@@ -2,7 +2,7 @@ const path = new Path(); // robot path
 let debugPath = [];
 
 
-// program mode.
+// program mode
 // 0 = create
 // 1 = debug
 let mode = 0;

scripts/spline.js

@@ -253,3 +253,45 @@ class Path {
     this.genSpacedPoints(spacing);
   };
 };
+
+
+/**
+ * @brief debugDataPoint class
+ */
+class debugDataPoint {
+  /**
+   * @brief constructor for debugDataPoint
+   * @param {number} timestamp - the timestamp of the data point
+   * @param {number} rbtX - the x position of the robot
+   * @param {number} rbtY - the y position of the robot
+   * @param {number} rbtH - the heading of the robot
+   * @param {number} closestX - the x position of the closest point
+   * @param {number} closestY - the y position of the closest point
+   * @param {number} lookaheadX - the x position of the lookahead point
+   * @param {number} lookaheadY - the y position of the lookahead point
+   * @param {number} curvature - the curvature of the robot
+   * @param {number} targetVel - the target velocity of the robot
+   * @param {number} leftTargetVel - the target velocity of the left wheel
+   * @param {number} rightTargetVel - the target velocity of the right wheel
+   * @param {number} leftVel - the velocity of the left wheel
+   * @param {number} rightVel - the velocity of the right wheel
+   */
+  constructor(timestamp, rbtX, rbtY, rbtH, closestX, closestY, lookaheadX,
+      lookaheadY, curvature, targetVel, leftTargetVel, rightTargetVel,
+      leftVel, rightVel) {
+    this.timestamp = timestamp();
+    this.rbtX = rbtX;
+    this.rbtY = rbtY;
+    this.rbtH = rbtH;
+    this.closestX = closestX;
+    this.closestY = closestY;
+    this.lookaheadX = lookaheadX;
+    this.lookaheadY = lookaheadY;
+    this.curvature = curvature;
+    this.targetVel = targetVel;
+    this.leftTargetVel = leftTargetVel;
+    this.rightTargetVel = rightTargetVel;
+    this.leftVel = leftVel;
+    this.rightVel = rightVel;
+  };
+};