-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathtictactoe.html
124 lines (112 loc) · 7.18 KB
/
tictactoe.html
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
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8" />
<title>Tic Tac Toe</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="common.css" />
<link rel="stylesheet" type="text/css" href="tictactoe.css" />
<script src="jquery-3.1.1.min.js"type="text/javascript"></script>
<script src="common.js" type="text/javascript"></script>
<script src="tictactoe.js" type="text/javascript"></script>
</head>
<body>
<div class="settings" data-game-name="tictactoe" data-playerstotal="no">
</div>
<div class="content">
<div class="keyboard">
<div class="btn single" data-x='1' data-pos='0'>12</div>
<div class="btn double" data-x='2' data-pos='0'>D12</div>
<div class="btn triple" data-x='3' data-pos='0'>T12</div>
<div class="btn single" data-x='1' data-pos='1'>20</div>
<div class="btn double" data-x='2' data-pos='1'>D20</div>
<div class="btn triple" data-x='3' data-pos='1'>T20</div>
<div class="btn single" data-x='1' data-pos='2'>18</div>
<div class="btn double" data-x='2' data-pos='2'>D18</div>
<div class="btn triple" data-x='3' data-pos='2'>T18</div><br />
<div class="btn single" data-x='1' data-pos='3'>11</div>
<div class="btn double" data-x='2' data-pos='3'>D11</div>
<div class="btn triple" data-x='3' data-pos='3'>T11</div>
<div class="btn single" data-x='1' data-pos='4'>B</div>
<div class="btn" data-x='1' data-pos='0'>Miss</div>
<div class="btn" id="del"><<</div>
<div class="btn single" data-x='1' data-pos='5'>6</div>
<div class="btn double" data-x='2' data-pos='5'>D6</div>
<div class="btn triple" data-x='3' data-pos='5'>T6</div><br />
<div class="btn single" data-x='1' data-pos='6'>7</div>
<div class="btn double" data-x='2' data-pos='6'>D7</div>
<div class="btn triple" data-x='3' data-pos='6'>T7</div>
<div class="btn single" data-x='1' data-pos='7'>3</div>
<div class="btn double" data-x='2' data-pos='7'>D3</div>
<div class="btn triple" data-x='3' data-pos='7'>T3</div>
<div class="btn single" data-x='1' data-pos='8'>2</div>
<div class="btn double" data-x='2' data-pos='8'>D2</div>
<div class="btn triple" data-x='3' data-pos='8'>T2</div>
</div>
<div class="boards">
<div class="board small player0 active">
<input type="text" name="player0" id="player0" class="playername" />
<div class="player-sign sign-x" data-player="player0" id="player0_sign" title="Click to switch player's sign"> </div>
<table border="1">
<tr> <td>12</td> <td>20</td> <td>18</td> </tr>
<tr> <td>11</td> <td>B</td> <td>6</td> </tr>
<tr> <td>7</td> <td>3</td> <td>2</td> </tr>
</table>
<div class="throws">
<span class="throw tr0"> </span>
<span class="throw tr1"> </span>
<span class="throw tr2"> </span>
</div>
</div>
<div class="board small player1">
<input type="text" name="player1" id="player1" class="playername" />
<div class="player-sign sign-o" data-player="player1" id="player1_sign" title="Click to switch player's sign"> </div>
<table border="1">
<tr> <td>12</td> <td>20</td> <td>18</td> </tr>
<tr> <td>11</td> <td>B</td> <td>6</td> </tr>
<tr> <td>7</td> <td>3</td> <td>2</td> </tr>
</table>
<div class="throws">
<span class="throw tr0"> </span>
<span class="throw tr1"> </span>
<span class="throw tr2"> </span>
</div>
</div>
<div class="board big">
<table border="1">
<tr> <td>12</td> <td>20</td> <td>18</td> </tr>
<tr> <td>11</td> <td>B</td> <td>6</td> </tr>
<tr> <td>7</td> <td>3</td> <td>2</td> </tr>
</table>
</div>
</div>
<div class="send-to-server viewport">
</div>
</div>
<div class="rules">
<p>Tic-Tac-Toe: Tic-Tac-Toe is a fun simple game for 2 players or teams. It combines the standard rules of the pen-and-paper game with darts.</p>
<p>The Object: Getting a tic-tac-toe just like the regular game by having three X's or O's in a row horizontally, vertically or diagonally.</p>
<p>The Scoring: Three tic-tac-toe boards are drawn on the scoreboard, 1 small one in each of the two player/team's columns and one larger one in the center. The small ones are used to mark what each player hits and the big one is used for the actual tic-tac-toe game.</p>
<p>The numbers that are used for the game appear on the dart board with similar placement to the tic-tac-toe box they represent (B means bullseye):</p>
<style>
td {
text-align: center;
padding: 0.3em;
}
</style>
<table border="1">
<tr> <td>12</td> <td>20</td> <td>18</td></tr>
<tr> <td>11</td> <td>B</td> <td>6</td></tr>
<tr> <td>7</td> <td>3</td> <td>2</td></tr>
</table>
<p>In order to place an X or an O in the big game board, a player must "close" the number first in the small game board. To close a number, three of that number must be scored with the thin outer ring counting as two of that number (called a "double") and the thin inner ring counting as three (called a triple). A score of one is indicated with a slash ("/"). A score of two is indicated with an X. And a score of three is indicated with a circle to show it is "closed".</p>
<p>For example, a player hits a single 18, a double 18 and a single 7. In his small board, he would place a circle in the upper left hand box to show he closed 18 and a slash in the lower left hand box to indicate the single 7. Now because he closed 18 first, he claims the upper left hand corner of the big game board by placing his X or O in that box. 18's now no longer count for the other player.</p>
<p>The Play: Players throw one dart each at bullseye, closest dart throws first and that player's name is written above the left small board with the other player's name written above the right small board. This player also chooses to be X's or O's and writes that near the small board too.
The first player will try to close the numbers that count as quickly as possible to place an X or O where desired.</p>
<p>Players alternate until someone wins a tic-tac-toe or the game is a draw.</p>
<p>Strategy: If you do not know the strategy to tic-tac-toe, you should seek professional help.</p>
</div>
<div id="defaultss">
</div>
</body>
</html>