rendered paste body/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////Connect FiveWritten In XHTML 1.0 Strict, JavaScript, Cascading Style SheetsVersion 1.0 2008/4/10 2008/4/12Copyright 2008 HockeyInJuneReleased as Free and Open Source Software Under GNU General Public License Version 3***HockeyInJuneEMAIL: HockeyInJune@gmail.comAIM: HockeyInJuneMSN: HockeyInJune@gmail.comXMPP: HockeyInJune@gmail.comICQ: 220525670 (HockeyInJune)YIM: HockeyInJune////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\Connect Five is Free Software.You can redistribute it and/or modify it under the terms of the GNU General Public License Version 3 as published by the Free Software Foundation.Connect Five is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY;without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.See the GNU General Public License for more details.You should have received a copy of the GNU General Public License along with this program.If not, see http://www.gnu.org/licenses/\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/# index.html:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html> <head> <title>Connect Five</title> <link rel="stylesheet" type="text/css" href="index.css" /> <script type="text/javascript" src="index.js"></script> </head> <body onload="StartGame();"> <h1>Connect Five</h1> <h2 id="turnh">It is <span id="turn">Black</span>'s Turn.</h2> <textarea id="ErrorConsole" rows="1" cols="50">Error Console</textarea> <button onclick="PurgeErrorConsole();">Purge Error Console</button> <table id="buttons"> <!-- One By Ten Table --> <tr> <td><button onclick="Drop(0);">Drop</button></td> <td><button onclick="Drop(1);">Drop</button></td> <td><button onclick="Drop(2);">Drop</button></td> <td><button onclick="Drop(3);">Drop</button></td> <td><button onclick="Drop(4);">Drop</button></td> <td><button onclick="Drop(5);">Drop</button></td> <td><button onclick="Drop(6);">Drop</button></td> <td><button onclick="Drop(7);">Drop</button></td> <td><button onclick="Drop(8);">Drop</button></td> <td><button onclick="Drop(9);">Drop</button></td> </tr> </table> <table id="board"> <!-- Ten By Ten Table --> <tr> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> </tr> <tr> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> </tr> <tr> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> </tr> <tr> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> </tr> <tr> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> </tr> <tr> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> </tr> <tr> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> </tr> <tr> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> </tr> <tr> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> </tr> <tr> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> <td><img src="Blank.png" /></td> </tr> </table> </body></html># EOF# index.js:var Turn = 0;function StartGame() { document.getElementById("ErrorConsole").innerHTML += "\n";}function accessTurn() { if (Turn == 0 || Turn == 1 || Turn == 2) { return Turn; } else { return 2; }}function mutateTurn(MTurn) { if (MTurn == 0 || MTurn == 1 || MTurn == 2) { Turn = MTurn; } else { Turn = Turn; }}function PurgeErrorConsole() { document.getElementById("ErrorConsole").innerHTML = "";}function ChangeTurn() { if (accessTurn() == 0) { mutateTurn(1); document.getElementById("turn").innerHTML = "Red"; document.getElementById("turnh").style.color = "Red"; } else if (accessTurn() == 1) { mutateTurn(0); document.getElementById("turn").innerHTML = "Black"; document.getElementById("turnh").style.color = "Black"; } else if (accessTurn() == 2) { document.getElementById("ErrorConsole").innerHTML += "The Game Is Over.\n"; } else { document.getElementById("ErrorConsole").innerHTML += "accessTurn() returned invalid turn Identifer (This is an impossible Action).\n"; mutateTurn(-1); }}function Drop(y) { for (var i = 9; i >= 0; i--) { if (document.getElementById("board").getElementsByTagName("tr")[i].getElementsByTagName("img")[y].src.indexOf("Blank.png") == -1) { if (i == 0) { document.getElementById("ErrorConsole").innerHTML += "That is an Invalid Move, Please Try Again.\n"; ChangeTurn(); } } else { if (accessTurn() == 0) { document.getElementById("board").getElementsByTagName("tr")[i].getElementsByTagName("img")[y].src = "Black.png"; i = -1; } else if (accessTurn() == 1) { document.getElementById("board").getElementsByTagName("tr")[i].getElementsByTagName("img")[y].src = "Red.png"; i = -1; } else { document.getElementById("ErrorConsole").innerHTML += "accessTurn() returned invalid turn Identifer (This is an impossible Action).\n"; i = -1; } } } CheckWin(); ChangeTurn();}function CheckWin() { if (accessTurn() == 0) { var ColorChecked = "Black"; } else if (accessTurn() == 1) { var ColorChecked = "Red"; } else { document.getElementById("ErrorConsole").innerHTML += "accessTurn() returned invalid turn Identifer (This is an impossible Action).\n"; } for (var j = 0; j <= 9; j++) { for (var k = 0, l = 1, m = 2, n = 3, o = 4; o <= 9; k++, l++, m++, n++, o++) { if (document.getElementById("board").getElementsByTagName("tr")[j].getElementsByTagName("img")[k].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[j].getElementsByTagName("img")[l].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[j].getElementsByTagName("img")[m].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[j].getElementsByTagName("img")[n].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[j].getElementsByTagName("img")[o].src.indexOf(ColorChecked) != -1) { document.getElementById("turnh").innerHTML = ColorChecked + " has Won the Game!"; document.getElementById("turnh").style.color = ColorChecked; EndGame(); return; } } } for (var j = 0; j <= 9; j++) { for (var k = 0, l = 1, m = 2, n = 3, o = 4; o <= 9; k++, l++, m++, n++, o++) { if (document.getElementById("board").getElementsByTagName("tr")[k].getElementsByTagName("img")[j].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[l].getElementsByTagName("img")[j].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[m].getElementsByTagName("img")[j].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[n].getElementsByTagName("img")[j].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[o].getElementsByTagName("img")[j].src.indexOf(ColorChecked) != -1) { document.getElementById("turnh").innerHTML = ColorChecked + " has Won the Game!"; document.getElementById("turnh").style.color = ColorChecked; EndGame(); return; } } } for (var j = 4; j <= 9; j++) { for (var k = 0, l = 1, m = 2, n = 3, o = 4; o <= 9; k++, l++, m++, n++, o++) { if (document.getElementById("board").getElementsByTagName("tr")[j].getElementsByTagName("img")[k].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[j - 1].getElementsByTagName("img")[l].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[j - 2].getElementsByTagName("img")[m].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[j - 3].getElementsByTagName("img")[n].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[j - 4].getElementsByTagName("img")[o].src.indexOf(ColorChecked) != -1) { document.getElementById("turnh").innerHTML = ColorChecked + " has Won the Game!"; document.getElementById("turnh").style.color = ColorChecked; EndGame(); return; } } } for (var j = 0; j <= 5; j++) { for (var k = 0, l = 1, m = 2, n = 3, o = 4; o <= 9; k++, l++, m++, n++, o++) { if (document.getElementById("board").getElementsByTagName("tr")[k].getElementsByTagName("img")[j].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[l].getElementsByTagName("img")[j + 1].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[m].getElementsByTagName("img")[j + 2].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[n].getElementsByTagName("img")[j + 3].src.indexOf(ColorChecked) != -1 && document.getElementById("board").getElementsByTagName("tr")[o].getElementsByTagName("img")[j + 4].src.indexOf(ColorChecked) != -1) { document.getElementById("turnh").innerHTML = ColorChecked + " has Won the Game!"; document.getElementById("turnh").style.color = ColorChecked; EndGame(); return; } } }}function EndGame() { for (var i = 0; i < document.getElementById("buttons").getElementsByTagName("button").length; i++) { document.getElementById("buttons").getElementsByTagName("button")[i].disabled = true; } mutateTurn(2);}# EOF# index.css:body { text-align:center;}table { margin-left:auto; margin-right:auto;}td{ width:64px; text-align:center;}# EOF