Added more user control over the maze generation.

index.html

@@ -41,6 +41,8 @@
   	}
   	
   	function rerun(){
+  		if (!document.getElementById("reuseMaze").checked)
+  			createNewMaze(document.getElementById("cellWidthInput").value);
   		algo = {};
 	  	maze.resetMazeState();
 		maze.updateMazeDisplay();
@@ -65,7 +67,7 @@
 				<label for="canvasWidthTextbox" >Canvas Size Width: </label><input type="number" id="canvasWidthTextbox" value="500" onchange="updateCanvasWidth()"/>
 				<label for="canvasHeightTextbox"> Height: </label><input type="number" id="canavasHeightTextbox" value="500" onchange="updateCanvasHeight()"/><br/>
 				<label for="genFrameRate">Framerate During Maze Generation: </label><input type="number" id="genFrameRate" min="1" max="144" step="1" value="30" /><br />
-				<label for="solvingFrameRate">Framerate During Maze Solving: </label><input type="number" id="solvingFrameRate" min="1" max="144" step="1" value="30" /><br />
+				<label for="solvingFrameRate">Framerate During Maze Solving: </label><input type="number" id="solvingFrameRate" min="1" max="144" step="1" value="15" /><br />
 				<input id="reuseMaze" type="checkbox" checked="true" /><label for="reuseMaze">Reuse current maze on next run (uncheck to generate a new maze)</label>				
 			</fieldset>
 			<fieldset id="algo" name="algo" disabled="disabled">

sketch.js

@@ -1,4 +1,3 @@
-var cellWidth = 50;
 var frontier = [];
 var explored = [];
 var currentNode = {};
@@ -6,10 +5,16 @@ var maze = {};
 var algo = {};
 
 function setup() {
-  var canvas = createCanvas(500, 500);
-  canvas.parent('sketch-holder');
-  maze = new Maze(width, height, cellWidth, "Depth");
-  frameRate(30);
+	var canvas = createCanvas(500, 500);
+	canvas.parent('sketch-holder');
+	
+	createNewMaze(document.getElementById("cellWidthInput").value);
+
+	frameRate(Number(document.getElementById("genFrameRate").value));
+}
+
+function createNewMaze(cellWidth){
+	maze = new Maze(width, height, Number(cellWidth));
 }
 
 function draw() {
@@ -24,6 +29,7 @@ function draw() {
 	maze.resetMazeState();
 	//maze.updateMazeDisplay();
 	let selectedAlgo = document.getElementById("searchAlgo").value;
+	let solvingFramerate = document.getElementById("solvingFrameRate").value;
 	if(selectedAlgo == "depthFirst") 
 		algo = new DepthFirstSolver(maze.grid[0], maze.grid[maze.index(7, 7)]);
 	else if(selectedAlgo == "breadthFirst")
@@ -31,10 +37,9 @@ function draw() {
 	//else if(selectedAlgo == "a*")
 	
 	print("Maze generation done");
-	frameRate(10);
+	frameRate(Number(solvingFramerate));
   }
   else if (maze.mazeGenDone && algo.frontier.length > 0){
-    //algo.breadthFirstNextCell(maze);
     algo.solve(maze);
   }
   else{