1+ <!DOCTYPE html>
2+ < html lang ="en ">
3+ < head >
4+ < link rel ="stylesheet " href ="style.css ">
5+ < meta charset ="UTF-8 ">
6+ < meta name ="viewport " content ="width=device-width, initial-scale=1.0 ">
7+ < title > Tic_tac_toe</ title >
8+ </ head >
9+ < body >
10+ < html lang ="en ">
11+ < head >
12+ < meta charset ="utf-8 ">
13+ < meta name ="viewport " content ="width=device-width, initial-scale=1.0 ">
14+ < title > Tic-tac-toe</ title >
15+ < link href ="https://fonts.googleapis.com/css?family=Indie+Flower " rel ="stylesheet ">
16+ < link rel ="shortcut icon " href ="" type ="image/x-icon ">
17+ </ head >
18+ < body onload ="initialize() ">
19+ < h1 > ◥◣ Tic-Tac-Toe ◢◤</ h1 >
20+ < table id ="table_game ">
21+ < tr > < td class ="td_game "> < div id ="cell0 " onclick ="cellClicked(this.id) " class ="fixed "> </ div > </ td > < td class ="td_game "> < div id ="cell1 " onclick ="cellClicked(this.id) " class ="fixed "> </ div > </ td > < td class ="td_game "> < div id ="cell2 " onclick ="cellClicked(this.id) " class ="fixed "> </ div > </ td > </ tr >
22+ < tr > < td class ="td_game "> < div id ="cell3 " onclick ="cellClicked(this.id) " class ="fixed "> </ div > </ td > < td class ="td_game "> < div id ="cell4 " onclick ="cellClicked(this.id) " class ="fixed "> </ div > </ td > < td class ="td_game "> < div id ="cell5 " onclick ="cellClicked(this.id) " class ="fixed "> </ div > </ td > </ tr >
23+ < tr > < td class ="td_game "> < div id ="cell6 " onclick ="cellClicked(this.id) " class ="fixed "> </ div > </ td > < td class ="td_game "> < div id ="cell7 " onclick ="cellClicked(this.id) " class ="fixed "> </ div > </ td > < td class ="td_game "> < div id ="cell8 " onclick ="cellClicked(this.id) " class ="fixed "> </ div > </ td > </ tr >
24+ </ table >
25+ < div id ="restart " title ="Start new game " onclick ="restartGame(true) "> < span style ="vertical-align:top;position:relative;top: 10px;font-size: 15px; "> ⚙️</ span > </ div >
26+ < table >
27+ < tr > < th class ="th_list "> Robot </ th > < th class ="th_list " style ="padding-right:10px;padding-left:10px "> Tie</ th > < th class ="th_list "> You</ th > </ tr >
28+ < tr > < td class ="td_list " id ="computer_score "> 0</ td > < td class ="td_list " style ="padding-right:10px;padding-left:10px " id ="tie_score "> 0</ td > < td class ="td_list " id ="player_score "> 0</ td > </ tr >
29+ </ table >
30+ <!-- The modal dialog for announcing the winner -->
31+ < div id ="winAnnounce " class ="modal ">
32+ <!-- Modal content -->
33+ < div class ="modal-content ">
34+ < span class ="close " onclick ="closeModal('winAnnounce') "> ×</ span >
35+ < p id ="winText "> </ p >
36+ </ div >
37+ </ div >
38+ <!-- The dialog for getting feedback from the user -->
39+ < div id ="userFeedback " class ="modal ">
40+ <!-- Modal content -->
41+ < div class ="modal-content ">
42+ < p id ="questionText "> </ p >
43+ < p > < button id ="yesBtn "> Yes</ button > < button id ="noBtn "> No</ button > </ p >
44+ </ div >
45+ </ div >
46+ <!-- The options dialog -->
47+ < div id ="optionsDlg " class ="modal ">
48+ <!-- Modal content -->
49+ < div class ="modal-content ">
50+ < h2 > Configuration ⚙️ </ h2 >
51+ < h3 > Difficulty:</ h3 >
52+ < label > < input type ="radio " name ="difficulty " id ="r0 " value ="0 "> Peaceful🍀 </ label >
53+ < label > < input type ="radio " name ="difficulty " id ="r1 " value ="1 " checked > Extreme😈</ label > < br >
54+ < h3 > Play as:</ h3 >
55+ < label > < input type ="radio " name ="player " id ="rx " value ="x " checked > X (go first) </ label >
56+ < label > < input type ="radio " name ="player " id ="ro " value ="o "> O< br > </ label >
57+ < p > < button id ="okBtn " onclick ="getOptions() "> Play</ button > </ p >
58+ </ div >
59+ </ div >
60+
61+ < script src ="main.js "> </ script >
62+
63+ </ body >
64+ </ html >
65+ </ body >
66+ </ html >
0 commit comments