var maze = {};
var algo = {};

function setup() {
	var canvas = createCanvas(500, 500);
	document.getElementById('canvasWidthTextbox').value = 500;
	document.getElementById('canavasHeightTextbox').value = 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() {
  background(220);

  maze.updateMazeDisplay();
  
  if(!maze.mazeGenDone){
  	maze.buildNextCell();
  }
  else if (maze.mazeGenDone && algo.frontier == undefined){
	maze.resetMazeState();
	
	let selectedAlgo = document.getElementById("searchAlgo").value;
	
	if(selectedAlgo == "depthFirst") 
		algo = new DepthFirstSolver(maze.grid[0], maze.grid[maze.index(7, 7)]);
	else if(selectedAlgo == "breadthFirst")
		algo = new BreadthFirstSolver(maze.grid[0], maze.grid[maze.index(7,7)]);
	//else if(selectedAlgo == "a*")
	
	print("Maze generation done");
	frameRate(Number(document.getElementById("solvingFrameRate").value));
  }
  else if (maze.mazeGenDone && algo.frontier.length > 0){
    algo.solve(maze);
  }
  else{
  	algo.highlightFinalPath(maze);
  	
  	let label = document.getElementById('information').innerHTML = `Maze Finished. Explored ${algo.statesExplored} states to find the answer.`;
  	print("Maze search done");
  	noLoop();
  	toggleForm(true);
  }
}