Compare commits
No commits in common. "b70093cc1c49ff06c5e5d94f1b3a9c3499327ebf" and "06f460f6e86af0c2be8dc48c84eade381ef82e05" have entirely different histories.
b70093cc1c
...
06f460f6e8
1
.gitignore
vendored
1
.gitignore
vendored
@ -1 +0,0 @@
|
||||
.DS_Store
|
@ -1,3 +1,4 @@
|
||||
# ultimate-tictactoe
|
||||
|
||||
My take on web-based multiplayer [Ultimate Tic-Tac-Toe](https://en.wikipedia.org/wiki/Ultimate_tic-tac-toe).
|
||||
My take on web-based multiplayer Ultimate Tic-Tac-Toe.
|
||||
|
||||
|
@ -1,14 +0,0 @@
|
||||
export class TTTBoard {
|
||||
constructor() {
|
||||
this.stateArray = [
|
||||
[null, null, null],
|
||||
[null, null, null],
|
||||
[null, null, null]
|
||||
];
|
||||
}
|
||||
|
||||
// This is a fun exploit of JavaScript's loose Typing, player can be a nested TTTBoard!
|
||||
play(row, col, player) {
|
||||
this.stateArray[row][col] = player;
|
||||
}
|
||||
}
|
101
src/index.html
101
src/index.html
@ -1,101 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Ultimate Tic-Tac-Toe</title>
|
||||
</head>
|
||||
<body>
|
||||
<div style="display: grid; grid-template-columns: repeat(9, 1fr); gap: 3px; width: 270px; height: 270px;">
|
||||
<div id="G1-R1-C1" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G1-R1-C1')"></div>
|
||||
<div id="G1-R1-C2" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G1-R1-C2')"></div>
|
||||
<div id="G1-R1-C3" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G1-R1-C3')"></div>
|
||||
<div id="G2-R1-C4" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G2-R1-C4')"></div>
|
||||
<div id="G2-R1-C5" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G2-R1-C5')"></div>
|
||||
<div id="G2-R1-C6" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G2-R1-C6')"></div>
|
||||
<div id="G3-R1-C7" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G3-R1-C7')"></div>
|
||||
<div id="G3-R1-C8" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G3-R1-C8')"></div>
|
||||
<div id="G3-R1-C9" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G3-R1-C9')"></div>
|
||||
|
||||
<div id="G1-R2-C1" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G1-R2-C1')"></div>
|
||||
<div id="G1-R2-C2" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G1-R2-C2')"></div>
|
||||
<div id="G1-R2-C3" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G1-R2-C3')"></div>
|
||||
<div id="G2-R2-C4" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G2-R2-C4')"></div>
|
||||
<div id="G2-R2-C5" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G2-R2-C5')"></div>
|
||||
<div id="G2-R2-C6" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G2-R2-C6')"></div>
|
||||
<div id="G3-R2-C7" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G3-R2-C7')"></div>
|
||||
<div id="G3-R2-C8" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G3-R2-C8')"></div>
|
||||
<div id="G3-R2-C9" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G3-R2-C9')"></div>
|
||||
|
||||
<div id="G1-R3-C1" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G1-R3-C1')"></div>
|
||||
<div id="G1-R3-C2" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G1-R3-C2')"></div>
|
||||
<div id="G1-R3-C3" style="border: 1px solid black;" onclick="alert('You clicked G1-R3-C3')"></div>
|
||||
<div id="G2-R3-C4" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G2-R3-C4')"></div>
|
||||
<div id="G2-R3-C5" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G2-R3-C5')"></div>
|
||||
<div id="G2-R3-C6" style="border: 1px solid black;" onclick="alert('You clicked G2-R3-C6')"></div>
|
||||
<div id="G3-R3-C7" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G3-R3-C7')"></div>
|
||||
<div id="G3-R3-C8" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G3-R3-C8')"></div>
|
||||
<div id="G3-R3-C9" style="border: 1px solid black;" onclick="alert('You clicked G3-R3-C9')"></div>
|
||||
|
||||
<div id="G4-R4-C1" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G4-R4-C1')"></div>
|
||||
<div id="G4-R4-C2" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G4-R4-C2')"></div>
|
||||
<div id="G4-R4-C3" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G4-R4-C3')"></div>
|
||||
<div id="G5-R4-C4" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G5-R4-C4')"></div>
|
||||
<div id="G5-R4-C5" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G5-R4-C5')"></div>
|
||||
<div id="G5-R4-C6" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G5-R4-C6')"></div>
|
||||
<div id="G6-R4-C7" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G6-R4-C7')"></div>
|
||||
<div id="G6-R4-C8" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G6-R4-C8')"></div>
|
||||
<div id="G6-R4-C9" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G6-R4-C9')"></div>
|
||||
|
||||
<div id="G4-R5-C1" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G4-R5-C1')"></div>
|
||||
<div id="G4-R5-C2" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G4-R5-C2')"></div>
|
||||
<div id="G4-R5-C3" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G4-R5-C3')"></div>
|
||||
<div id="G5-R5-C4" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G5-R5-C4')"></div>
|
||||
<div id="G5-R5-C5" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G5-R5-C5')"></div>
|
||||
<div id="G5-R5-C6" style="border: 1px solid black; margin-bottom: -3px;"
|
||||
|
||||
onclick="alert('You clicked G5-R5-C6')"></div>
|
||||
<div id="G6-R5-C7" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G6-R5-C7')"></div>
|
||||
<div id="G6-R5-C8" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G6-R5-C8')"></div>
|
||||
<div id="G6-R5-C9" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G6-R5-C9')"></div>
|
||||
|
||||
<div id="G4-R6-C1" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G4-R6-C1')"></div>
|
||||
<div id="G4-R6-C2" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G4-R6-C2')"></div>
|
||||
<div id="G4-R6-C3" style="border: 1px solid black;" onclick="alert('You clicked G4-R6-C3')"></div>
|
||||
<div id="G5-R6-C4" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G5-R6-C4')"></div>
|
||||
<div id="G5-R6-C5" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G5-R6-C5')"></div>
|
||||
<div id="G5-R6-C6" style="border: 1px solid black;" onclick="alert('You clicked G5-R6-C6')"></div>
|
||||
<div id="G6-R6-C7" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G6-R6-C7')"></div>
|
||||
<div id="G6-R6-C8" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G6-R6-C8')"></div>
|
||||
<div id="G6-R6-C9" style="border: 1px solid black;" onclick="alert('You clicked G6-R6-C9')"></div>
|
||||
|
||||
<div id="G7-R7-C1" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G7-R7-C1')"></div>
|
||||
<div id="G7-R7-C2" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G7-R7-C2')"></div>
|
||||
<div id="G7-R7-C3" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G7-R7-C3')"></div>
|
||||
<div id="G8-R7-C4" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G8-R7-C4')"></div>
|
||||
<div id="G8-R7-C5" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G8-R7-C5')"></div>
|
||||
<div id="G8-R7-C6" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G8-R7-C6')"></div>
|
||||
<div id="G9-R7-C7" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G9-R7-C7')"></div>
|
||||
<div id="G9-R7-C8" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G9-R7-C8')"></div>
|
||||
<div id="G9-R7-C9" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G9-R7-C9')"></div>
|
||||
|
||||
<div id="G7-R8-C1" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G7-R8-C1')"></div>
|
||||
<div id="G7-R8-C2" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G7-R8-C2')"></div>
|
||||
<div id="G7-R8-C3" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G7-R8-C3')"></div>
|
||||
<div id="G8-R8-C4" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G8-R8-C4')"></div>
|
||||
<div id="G8-R8-C5" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G8-R8-C5')"></div>
|
||||
<div id="G8-R8-C6" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G8-R8-C6')"></div>
|
||||
<div id="G9-R8-C7" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G9-R8-C7')"></div>
|
||||
<div id="G9-R8-C8" style="border: 1px solid black; margin-bottom: -3px; margin-right: -3px;" onclick="alert('You clicked G9-R8-C8')"></div>
|
||||
<div id="G9-R8-C9" style="border: 1px solid black; margin-bottom: -3px;" onclick="alert('You clicked G9-R8-C9')"></div>
|
||||
|
||||
<div id="G7-R9-C1" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G7-R9-C1')"></div>
|
||||
<div id="G7-R9-C2" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G7-R9-C2')"></div>
|
||||
<div id="G7-R9-C3" style="border: 1px solid black;" onclick="alert('You clicked G7-R9-C3')"></div>
|
||||
<div id="G8-R9-C4" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G8-R9-C4')"></div>
|
||||
<div id="G8-R9-C5" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G8-R9-C5')"></div>
|
||||
<div id="G8-R9-C6" style="border: 1px solid black;" onclick="alert('You clicked G8-R9-C6')"></div>
|
||||
<div id="G9-R9-C7" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G9-R9-C7')"></div>
|
||||
<div id="G9-R9-C8" style="border: 1px solid black; margin-right: -3px;" onclick="alert('You clicked G9-R9-C8')"></div>
|
||||
<div id="G9-R9-C9" style="border: 1px solid black;" onclick="alert('You clicked G9-R9-C9')"></div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in New Issue
Block a user