56 lines
1.7 KiB
HTML
56 lines
1.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>p5.js example</title>
|
|
<style>
|
|
body {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.column {
|
|
float: left;
|
|
}
|
|
|
|
/* Clear floats after the columns */
|
|
.row:after {
|
|
content: "";
|
|
display: table;
|
|
clear: both;
|
|
}
|
|
</style>
|
|
<script>
|
|
|
|
|
|
</script>
|
|
<script src="cell.js"></script>
|
|
<script src="../p5.js"></script>
|
|
<script src="../addons/p5.sound.min.js"></script>
|
|
<script src="sketch.js"></script>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="sketch-holder" class="column"></div>
|
|
<div class="column">
|
|
<form action="">
|
|
<label for="canvasWidthTextbox" >Canvas Size Width: </label><input type="number" id="canvasWidthTextbox" value="400"/>
|
|
<label for="canvasHeighTextbox"> Height: </label><input type="number" id="canavasHeightTextbox" value="400"/><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="searchAlgo">Search Algorithm to Find Maze Anwser: </label>
|
|
<select id="searchAlgo">
|
|
<option value="depthFirst">Depth First</option>
|
|
<option value="breadthFirst">Breadth First</option>
|
|
</select><br />
|
|
<label for="solvingFrameRate">Framerate During Maze Solving: </label><input type="number" id="solvingFrameRate" min="1" max="144" step="1" value="30"/><br />
|
|
<input id="reuseMaze" type="checkbox" checked="true"/><label for="reuseMaze">Reuse current maze on next run</label>
|
|
<br /><button type="button" onClick="draw();">Again</button>
|
|
</form>
|
|
|
|
</div>
|
|
</body>
|
|
|
|
</html>
|