Skip to content

Instantly share code, notes, and snippets.

@ohmygodwin
Created May 2, 2013 19:04
Show Gist options
  • Save ohmygodwin/5504542 to your computer and use it in GitHub Desktop.
Save ohmygodwin/5504542 to your computer and use it in GitHub Desktop.
tic tac toe
/**
* tic tac toe
*/
.new {
font:30px helvetica,sans-serif;
color: white;
width: 308px;
height: 100px;
border-width: 1px;
border-style: solid;
border-color: #444;
display: block;
margin: 120px auto 0;
padding: 0;
background: #888;
}
#grid {
margin: 0 auto;
}
.new:hover {
border-width: 5px;
border-style: solid;
border-color: #444;
text-shadow: 0 0 0.2em #444;
}
.tile {
font:30px helvetica,sans-serif;
color: white;
width: 100px;
height: 100px;
border-width: 1px;
border-style: solid;
border-color: #777;
margin: 0;
padding: 0;
background: f00;
}
.tile:hover {
border-width: 5px;
border-style: solid;
border-color: #555;
}
<div id="tic">
<input type="button" class="new" value="new game" onclick="restart()" />
<table name="f1" id="grid">
<tr>
<td><input type="button" class="tile" id="b00" value=" " onclick="tileClicked(this);" /></td>
<td><input type="button" class="tile" id="b01" value=" " onclick="tileClicked(this);" /></td>
<td><input type="button" class="tile" id="b02" value=" " onclick="tileClicked(this);" /></td>
</tr>
<tr>
<td><input type="button" class="tile" id="b10" value=" " onclick="tileClicked(this);" /></td>
<td><input type="button" class="tile" id="b11" value=" " onclick="tileClicked(this);" /></td>
<td><input type="button" class="tile" id="b12" value=" " onclick="tileClicked(this);" /></td>
</tr>
<tr>
<td><input type="button" class="tile" id="b20" value=" " onclick="tileClicked(this);" /></td>
<td><input type="button" class="tile" id="b21" value=" " onclick="tileClicked(this);" /></td>
<td><input type="button" class="tile" id="b22" value=" " onclick="tileClicked(this);" /></td>
</tr>
</table>
</div>
window.symbol = "X";
window.count = 0;
window.tileClicked = function(tile) {
if (tile.value == " ") {
window.count++;
tile.value = symbol;
if (symbol == "X") {
symbol = "O";
} else {
symbol = "X";
}
}
if (isWinning("X")) {
alert ("X wins!");
return;
} else if (isWinning("O")) {
alert ("O wins!");
return;
} else if (count == 9) {
alert("Draw!")
}
}
window.isWinning = function(symbol) {
if(document.getElementById('b00').value==symbol && document.getElementById('b01').value==symbol && document.getElementById('b02').value==symbol)
return true;
else if(document.getElementById('b10').value==symbol && document.getElementById('b11').value==symbol && document.getElementById('b12').value==symbol)
return true;
else if(document.getElementById('b20').value==symbol && document.getElementById('b21').value==symbol && document.getElementById('b22').value==symbol)
return true;
else if(document.getElementById('b00').value==symbol && document.getElementById('b10').value==symbol && document.getElementById('b20').value==symbol)
return true;
else if(document.getElementById('b01').value==symbol && document.getElementById('b11').value==symbol && document.getElementById('b21').value==symbol)
return true;
else if(document.getElementById('b02').value==symbol && document.getElementById('b12').value==symbol && document.getElementById('b22').value==symbol)
return true;
else if(document.getElementById('b00').value==symbol && document.getElementById('b11').value==symbol && document.getElementById('b22').value==symbol)
return true;
else if(document.getElementById('b02').value==symbol && document.getElementById('b11').value==symbol && document.getElementById('b20').value==symbol)
return true;
}
window.restart = function() {
window.symbol = "X";
document.getElementById('b00').value=" ";
document.getElementById('b01').value=" ";
document.getElementById('b02').value=" ";
document.getElementById('b10').value=" ";
document.getElementById('b11').value=" ";
document.getElementById('b12').value=" ";
document.getElementById('b20').value=" ";
document.getElementById('b21').value=" ";
document.getElementById('b22').value=" ";
count = 0;
}
{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"html"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment