Hardly an initial commit. The AI can effectively play either X or O. Options for allowing the human player to go first and to switch AI algorithms are supported in the UI.

2020-05-21 17:10:53 -05:00
commit 9b6be3bb7c
4 changed files with 336 additions and 0 deletions
@@ -0,0 +1,64 @@
+<!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>
+		function resetBoard(){
+			gameBoard = [
+			['', '', ''],
+			['', '', ''],
+			['', '', '']
+			];
+			
+			gameOver = false;
+			currentPlayer = 0;
+			fill(220);
+			rect(0,0,width,height);
+			document.getElementById("statusLabel").innerHTML = "";
+			redraw();
+		}
+		
+		function setPruning(){
+			usePruning = document.getElementById("usePruning").checked;
+			print(usePruning);
+		}
+		
+		function update(){
+			humanFirst = document.getElementById("humanFirst").checked;
+		}
+	</script>
+  <script src="p5.min.js"></script>
+  <script src="sketch.js"></script>
+</head>
+
+<body>
+	<div id="sketch-holder" class="column"></div>
+	<div class="column">
+		<label id="statusLabel"></label></br>
+		<input type="checkbox" id="usePruning" onclick="setPruning()" unchecked></input><label for="usePruning">Use Pruning Alogrithm</label>
+		</br><input type="checkbox" id="humanFirst" onclick="update()" unchecked></input><label for="humanFirst">Human makes the first move</label>
+		</br><button id="resetButton" onclick="resetBoard()">Reset Board</button>
+	</div>
+</body>
+
+</html>