1<!DOCTYPE html>
2<html lang="en">
3
4<head>
5 <meta charset="UTF-8">
6 <meta name="viewport" content="width=device-width, initial-scale=1.0">
7 <title>005.MiniMax</title>
8 <link rel="stylesheet" href="./style.css">
9 <link rel="stylesheet" href="../assets/common.css">
10 <link rel="shortcut icon" href="../assets/favicon.png" type="image/png">
11 <script src="../assets/common.js"></script>
12</head>
13
14<body>
15 <!-- Modal Section -->
16 <input class="modal-state" id="modal" type="checkbox" />
17 <div class="modal">
18 <label class="modal__bg" for="modal"></label>
19 <div class="modal__inner" style="width: 30%;">
20 <label class="modal__close" for="modal"></label>
21 <h2>005.MiniMax</h2>
22 <p class="modal__p">
23 <ul>
24 <li>An unbeatable Tic-Tac-Toe game which uses the concept of
25 <span style="color:var(--lightGold)">
26 MiniMax Algorithm
27 </span>
28 </li>
29 <li>
30 It is a decision rule used for minimizing the possible loss for a
31 <span style="color:var(--lightGold)">
32 worst case scenario.
33 </span>
34 </li>
35 <li>
36 The algorithm considers
37 <span style="color:var(--lightGold)">
38 all possible moves
39 </span>
40 that can be made by the computer and human (optimal moves).
41 </li>
42 <li>
43 Then it concludes the best move for the computer player by
44 <span style="color:var(--lightGold)">
45 minimizing the maximum loss.
46 </span>
47 </li>
48 <li>
49 Refer to
50 <a href="https://en.wikipedia.org/wiki/Minimax" target="_blank" style="color:var(--lightGold)">
51 MiniMax Algorithm
52 </a>
53 </li>
54 </ul>
55 </p>
56 </div>
57 </div>
58
59 <!-- Main Content -->
60 <h1>MiniMax</h1>
61 <p id="tooltip"></p>
62 <div class="grid">
63 <div id="strikeline" class="strike-line"></div>
64 <div class="cell" data-value="1"></div>
65 <div class="cell" data-value="2"></div>
66 <div class="cell" data-value="3"></div>
67 <div class="cell" data-value="4"></div>
68 <div class="cell" data-value="5"></div>
69 <div class="cell" data-value="6"></div>
70 <div class="cell" data-value="7"></div>
71 <div class="cell" data-value="8"></div>
72 <div class="cell" data-value="9"></div>
73 </div>
74
75
76 <!-- Footer -->
77 <div class="footer">
78 <label for="modal">(i)</label>
79 <a class="arrow" href="../"></a>
80 </div>
81</body>
82<script src="./script.js"></script>
83
84</html>