diff --git a/script.js b/script.js index a6beadb..364947a 100644 --- a/script.js +++ b/script.js @@ -48,8 +48,13 @@ class SwerveModule { // Swerve drive class to represent the robot as a whole class SwerveDrive { - constructor(modulePositionsAndNames) { + constructor(modulePositionsAndNames, robotName) { this.setModules(modulePositionsAndNames); + this.setName(robotName); + } + + setName(robotName) { + this.name = robotName; } setModules(modulePositionsAndNames) { @@ -216,43 +221,49 @@ resetBtn.addEventListener('click', (e) => { preset2WheelBtn.addEventListener('click', () => { const positions = PresetConfigs.twoWheel(robotSize); robot.setModules(positions); - createModuleDisplays(robot.modules); - updateModuleDisplays(robot.modules); + robot.setName("2-Wheel Differential"); + createModuleDisplays(robot); + updateModuleDisplays(robot); }); preset3WheelBtn.addEventListener('click', () => { const positions = PresetConfigs.threeWheel(robotSize); robot.setModules(positions); - createModuleDisplays(robot.modules); - updateModuleDisplays(robot.modules); + robot.setName("3-Wheel Triangle"); + createModuleDisplays(robot); + updateModuleDisplays(robot); }); preset4WheelBtn.addEventListener('click', () => { const positions = PresetConfigs.fourWheelSquare(robotSize); robot.setModules(positions); - createModuleDisplays(robot.modules); - updateModuleDisplays(robot.modules); + robot.setName("4-Wheel Square"); + createModuleDisplays(robot); + updateModuleDisplays(robot); }); preset4RectBtn.addEventListener('click', () => { const positions = PresetConfigs.fourWheelRectangle(robotSize); robot.setModules(positions); - createModuleDisplays(robot.modules); - updateModuleDisplays(robot.modules); + robot.setName("4-Wheel Rectangle"); + createModuleDisplays(robot); + updateModuleDisplays(robot); }); preset6WheelBtn.addEventListener('click', () => { const positions = PresetConfigs.sixWheel(robotSize); robot.setModules(positions); - createModuleDisplays(robot.modules); - updateModuleDisplays(robot.modules); + robot.setName("6-Wheel Hexagon"); + createModuleDisplays(robot); + updateModuleDisplays(robot); }); preset8WheelBtn.addEventListener('click', () => { const positions = PresetConfigs.eightWheel(robotSize); robot.setModules(positions); - createModuleDisplays(robot.modules); - updateModuleDisplays(robot.modules); + robot.setName("8-Wheel Octogon"); + createModuleDisplays(robot); + updateModuleDisplays(robot); }); /* @@ -260,10 +271,11 @@ preset8WheelBtn.addEventListener('click', () => { * BEGIN DYNAMIC DOM FUNCTIONS */ -function createModuleDisplays(modules) { +function createModuleDisplays(robot) { const grid = document.getElementById('module-grid'); grid.innerHTML = ''; // Delete any pre-existing elements before creating new ones + const modules = robot.modules; modules.forEach((module, i) => { const article = document.createElement('article'); article.className = 'module-display'; @@ -284,7 +296,13 @@ function createModuleDisplays(modules) { }); } -function updateModuleDisplays(modules) { +function updateModuleDisplays(robot) { + const configName = document.getElementById('config-name'); + configName.textContent = robot.name; + const moduleCount = document.getElementById('module-count-display'); + moduleCount.textContent = robot.modules.length; + + const modules = robot.modules; modules.forEach((module, i) => { const angleElement = document.getElementById(`module-${i}-angle`); const speedElement = document.getElementById(`module-${i}-speed`); @@ -401,8 +419,8 @@ function drawRobot(ctx, robot) { // Initialize Variables const robotSize = 200; const defaultModulePositions = PresetConfigs.fourWheelSquare(robotSize); -const robot = new SwerveDrive(defaultModulePositions); -createModuleDisplays(defaultModulePositions); +const robot = new SwerveDrive(defaultModulePositions, "4-Wheel Square"); +createModuleDisplays(robot); let xSpeed = 0; let ySpeed = 0; let turnSpeed = -1; @@ -440,7 +458,7 @@ function animate() { // Update module states before drawing the robot robot.drive(xSpeed, ySpeed, turnSpeed, parseFloat(maxSpeedSlider.value)); - updateModuleDisplays(robot.modules); + updateModuleDisplays(robot); // Draw the robot and it's movement. Grid should be oversized so movement // doesn't find the edge of the grid