-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathlayout.js
51 lines (43 loc) · 2 KB
/
layout.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
container = document.getElementById("container");
const annouceWinner = () => {
if(checkDraw()){
container.innerHTML += `<div class="winner" id="popUp">
<h2>The game is a tie</h2>
<div class="btn" onclick="resetBoard()">Play Again</div>
</div>`;
} else {
container.innerHTML += `<div class="winner" id="popUp">
<h2>The ${turn.toUpperCase()} won</h2>
<div class="btn" onclick="resetBoard()">Play Again</div>
</div>`;
}
}
const makeMove = (square) => {
let squarePermited = selecteds[parseInt(square.id)].isSelected === false && isGameOver() === false;
let squareId = document.getElementById(square.id);
if (squarePermited) {
squareId.innerHTML = `<div class="player" id="p${squareId.id}">${turn}</div>`;
}
handlePlays(square);
if (isGameOver()) {
annouceWinner();
}
}
const resetBoard = () => {
handleReset();
container.innerHTML = `<div class="board">
<div class="square" id="1" onclick="makeMove(this)">
<!-- <div class="player">X</div> -->
</div>
<div class="square" id="2" onclick="makeMove(this)">
<!-- <div class="player">O</div> -->
</div>
<div class="square" id="3" onclick="makeMove(this)"></div>
<div class="square" id="4" onclick="makeMove(this)"></div>
<div class="square" id="5" onclick="makeMove(this)"></div>
<div class="square" id="6" onclick="makeMove(this)"></div>
<div class="square" id="7" onclick="makeMove(this)"></div>
<div class="square" id="8" onclick="makeMove(this)"></div>
<div class="square" id="9" onclick="makeMove(this)"></div>
</div>`;
}