Does anyone have a clue why the hell this won't work in IE when it does in Chrome, Firefox, and Safari?
<html>
<head>
<meta charset = "utf-8" "X-UA-Compatible" >
<title>Game 15</title>
<script type="text/javascript">
var gamePiece = new Array(16); // Keeps track of the pieces on the game board
var moves = 0; // Moves per game
// These are the time functions 'code from class slides used'.
var seconds = 0; // Keeps track of seconds.
var timeReset = ""; // Used to reset the time.
function startTimer()
{
seconds = 0;
timeReset=setInterval("updateTime()", 1000);
}
function updateTime()
{
seconds++;
document.getElementById("timer").innerHTML = seconds;
}
window.addEventListener("load", start, false);
// Board functions start here
function start()
{
for(i=1; i<gamePiece.length+1; i++)
gamePiece[i-1] = document.getElementById("cell"+ i.toString());
reset();
}
function reset()
{
for(count=0; count < gamePiece.length; count++) { gamePiece[count].innerHTML = 20; }
var flag = 0;
var temp = 0;
for(counter=0; counter< gamePiece.length; counter++)
{
while(temp ==0)
{
var value =1;
value=Math.round(Math.random()*15);
var flag =0;
for(count=0; count<counter; count++)
if(gamePiece[count].innerHTML == value) flag = 1;
if(flag==0)
{
gamePiece[counter].innerHTML = value;
temp = 1;
}
}
temp = 0;
}
for(count=0; count<gamePiece.length; count++)
if(gamePiece[count].innerHTML == 0) gamePiece[count].innerHTML = '';
// Reset the timer
seconds = 0;
document.getElementById("timer").innerHTML = seconds;
window.clearInterval(timeReset);
startTimer();
// Reset the move counter
moves = 0;
document.getElementById("movesCount").innerHTML = moves;
}
function resetEasyGame()
{
// Set board so just 1 move is needed to win.
var value=1
for(count=0; count< 14; count++)
{
gamePiece[count].innerHTML = value;
value++;
}
gamePiece[14].innerHTML = '';
gamePiece[15].innerHTML = 15;
// Reset move counter
moves = 0;
document.getElementById("movesCount").innerHTML = moves;
// Reset timer
seconds = 0;
document.getElementById("timer").innerHTML = seconds;
window.clearInterval(timeReset);
startTimer();
}
var piece; // Most recently clicked game piece
function moveCell(number)
{
piece = document.getElementById("cell" + number.toString());
var elementID;
for (var counter = 0; counter < gamePiece.length; counter++)
{
// Find the right cell to move based on Id.
if (piece.id == gamePiece[counter].id)
{
elementID = counter;
break;
}
}
// How to move when the balk space is left, right, below, and above, in that order.
if (elementID > 0 && elementID%4 != 0 && gamePiece[elementID-1].innerHTML == "") swap(elementID, elementID-1, piece);
else if(elementID < 15 && elementID%4 != 3 && gamePiece[elementID+1].innerHTML == "") swap(elementID, elementID+1, piece);
else if(elementID < 12 && gamePiece[elementID+4].innerHTML == "") swap(elementID, elementID+4, piece);
else if(elementID > 3 && gamePiece[elementID-4].innerHTML == "") swap(elementID, elementID-4, piece);
}
function swap(r, c, current)
{
var temp = gamePiece[c].innerHTML;
gamePiece[c].innerHTML = gamePiece[r].innerHTML;
gamePiece[r].innerHTML = temp;
current.innerHTML = gamePiece[r].innerHTML;
// Keep track of the number of moves.
moves++;
document.getElementById("movesCount").innerHTML = moves;
var won = true
for(var counter = 0; counter<15; counter++)
{
if(counter==15 && gamePiece[counter].innerHTML != "") won = false;
else if(gamePiece[counter].innerHTML != counter+1) won = false;
}
// If the user has won
if(won == true)
{
var answer = confirm("You won the game! Click ok to start a new game.")
if (answer)
{
alert("Here's your new game!")
reset();
}
else alert("Hope you enjoyed the game!")
}
}
</script>
<body>
<h1>JavaScript '15' </h1>
<p>
<input type="button" value="Reset" onclick="reset();"/>
<input type="button" value="Easy Game" onclick="resetEasyGame();"/>
</p>
<p>
Time spent on Game: <span id="timer">0</span><br>
Moves this game: <span id="movesCount">0</span>
<br><br>
</p>
<table bordercolor = "blue" cellspacing="0" width="250" height="250" border="1">
<tr>
<td align = center width="20" id="cell1" onclick="moveCell(1)"></td>
<td align = center width="20" id="cell2" onclick="moveCell(2)"></td>
<td align = center width="20" id="cell3" onclick="moveCell(3)"></td>
<td align = center width="20" id="cell4" onclick="moveCell(4)"></td>
</tr>
<tr>
<td align = center width="20" id="cell5" onclick="moveCell(5)"></td>
<td align = center width="20" id="cell6" onclick="moveCell(6)"></td>
<td align = center width="20" id="cell7" onclick="moveCell(7)"></td>
<td align = center width="20" id="cell8" onclick="moveCell(8)"></td>
</tr>
<tr>
<td align = center width="20" id="cell9" onclick="moveCell(9)"></td>
<td align = center width="20" id="cell10" onclick="moveCell(10)"></td>
<td align = center width="20" id="cell11" onclick="moveCell(11)"></td>
<td align = center width="20" id="cell12" onclick="moveCell(12)"></td>
</tr>
<tr>
<td align = center width="20" id="cell13" onclick="moveCell(13)"></td>
<td align = center width="20" id="cell14" onclick="moveCell(14)"></td>
<td align = center width="20" id="cell15" onclick="moveCell(15)"></td>
<td align = center width="20" id="cell16" onclick="moveCell(16)"></td>
</tr>
</table>
</body>
</html>
)
A Diplomacy Game for Literature Lovers?
)
)
)