Anyone know how to put timer on this code that the higher the level the lower the time given to solve the puzzle..this will run only in IE browser

<HEAD>

<style>

.bigcell {

  background-color:#aa9966;

  border:4px solid #aa9966;

  text-align:center;

}

.cell {

  width:40px;

  height:40px;

  font-family:Verdana, Arial;

  font-size:10pt;

  font-weight:bold;

  background-color:#996633;

  color:#ffff33;

  border-top:2px solid #aa9966;

  border-left:2px solid #aa9966;

  border-right:2px solid #663300;

  border-bottom:2px solid #663300;

  text-align:center;

}

.hole {

  width:40px;

  height:40px;

  background-color:#aa9966;

  text-align:center;

}

body,h1,h2,h3,.msg,capt1,capt2 {font-family:Verdana,Comic Sans MS,Arial;}

body {margin:0px;}

h1 {font-size:28pt; font-weight:bold; margin-bottom:0px;}

h2 {font-size:16pt; margin:0px; font-weight:bold;}

h3 {font-size:8pt; margin:0px; font-weight:bold;}

.msg {font-size:8pt; font-weight:bold;}

.tab {cursor:hand;}

.capt1 {font-size:10pt; font-weight:bold;}

.capt2 {font-size:9pt; font-weight:bold;}

.capt3 {font-size:14pt; font-weight:bold; color:yellow;}

.capt4 {font-size:10pt; font-weight:bold; color:yellow;}

.but {font-size:9pt; font-weight:bold; height:30px;background-color:#aaaa99;}

</style>



</HEAD>


<BODY onLoad="loadBoard(4)">

<script>

var gsize, ghrow, ghcol, gtime, gmoves, gintervalid=-1, gshuffling;



function toggleHelp()

{

  if (butHelp.value == "Hide Help")

  {

    help.style.display = "none";

    butHelp.value = "Show Help";

  }

  else

  {

    help.style.display = "";

    butHelp.value = "Hide Help";

  }  

}



//random number between low and hi

function r(low,hi)

{

  return Math.floor((hi-low)*Math.random()+low); 

}



//random number between 1 and hi

function r1(hi)

{

  return Math.floor((hi-1)*Math.random()+1); 

}



//random number between 0 and hi

function r0(hi)

{

  return Math.floor((hi)*Math.random()); 

}



function startGame()

{

  shuffle();

  gtime = 0;

  gmoves = 0;

  tickTime();

  gintervalid = setInterval("tickTime()",1000);

}



function stopGame()

{

  if (gintervalid==-1) return;

  clearInterval(gintervalid);

  fldStatus.innerHTML = "";

  gintervalid=-1;

}



function tickTime()

{

  showStatus();

  gtime++;

}



function checkWin()

{

  var i, j, s;

  

  if (gintervalid==-1) return; //game not started!

  

  if (!isHole(gsize-1,gsize-1)) return;

  

  for (i=0;i<gsize;i++)

    for (j=0;j<gsize;j++)

    {

      if (!(i==gsize-1 && j==gsize-1)) //ignore last block (ideally a hole)

      {

       if (getValue(i,j)!=(i*gsize+j+1).toString()) return;

      }

    }

  stopGame();



  s = "<table cellpadding=4>";

  s += "<tr><td align=center class=capt3>!! CONGRATS !!</td></tr>";

  s += "<tr class=capt4><td align=center>You have done it in " + gtime + " secs ";

  s += "with " + gmoves + " moves!</td></tr>";

  s += "<tr><td align=center class=capt4>Your speed is " + Math.round(1000*gmoves/gtime)/1000 + " moves/sec</td></tr>";

  s += "</table>";

  fldStatus.innerHTML = s;

//  shuffle();

}



function showStatus()

{

  fldStatus.innerHTML = "Time: " + gtime + " secs   Moves: " + gmoves

}



function showTable()

{

  var i, j, s;

  

  stopGame();

  s = "<table border=3 cellpadding=0 cellspacing=0 bgcolor='#666655'><tr><td class=bigcell>";

  s = s + "<table border=0 cellpadding=0 cellspacing=0>";

  for (i=0; i<gsize; i++)

  {

    s = s + "<tr>";    

    for (j=0; j<gsize; j++)

    {

      s = s + "<td id=a_" + i + "_" + j + " onclick='move(this)' class=cell>" + (i*gsize+j+1) + "</td>";

    }

    s = s + "</tr>";        

  }

  s = s + "</table>";

  s = s + "</td></tr></table>";      

  return s;

}



function getCell(row, col)

{

  return eval("a_" + row + "_" + col);

}



function setValue(row,col,val)

{

  var v = getCell(row, col);

  v.innerHTML = val;

  v.className = "cell";

}



function getValue(row,col)

{

//  alert(row + "," + col);



  var v = getCell(row, col);

  return v.innerHTML;

}



function setHole(row,col)

{ 

  var v = getCell(row, col);

  v.innerHTML = "";

  v.className = "hole";

  ghrow = row;

  ghcol = col;

}



function getRow(obj)

{

  var a = obj.id.split("_");

  return a[1];

}



function getCol(obj)

{

  var a = obj.id.split("_");

  return a[2];

}



function isHole(row, col)

{

  return (row==ghrow && col==ghcol) ? true : false;

}



function getHoleInRow(row)

{

  var i;

  

  return (row==ghrow) ? ghcol : -1;

}



function getHoleInCol(col)

{

  var i;



  return (col==ghcol) ? ghrow : -1;

}



function shiftHoleRow(src,dest,row)

{

  var i;



  //conversion to integer needed in some cases!

  src = parseInt(src);

  dest = parseInt(dest);



  if (src < dest)

  {

    for (i=src;i<dest;i++)

    {

      setValue(row,i,getValue(row,i+1));

      setHole(row,i+1);

    }

  }

  if (dest < src)

  {

    for (i=src;i>dest;i--)

    {

      setValue(row,i,getValue(row,i-1));

      setHole(row,i-1);

    }

  }

}



function shiftHoleCol(src,dest,col)

{

  var i;

  

  //conversion to integer needed in some cases!

  src = parseInt(src);

  dest = parseInt(dest);

    

  if (src < dest)

  {//alert("src=" + src +" dest=" + dest + " col=" + col);

    for (i=src;i<dest;i++)

    {//alert(parseInt(i)+1);

      setValue(i,col,getValue(i+1,col));

      setHole(i+1,col);

    }

  }

  if (dest < src)

  {

    for (i=src;i>dest;i--)

    {

      setValue(i,col,getValue(i-1,col));

      setHole(i-1,col);

    }

  }

}



function move(obj)

{

  var r, c, hr, hc;



  if (gintervalid==-1 && !gshuffling) 

  {

    alert('Please press the "Start Game" button to start.')

    return;

  }

  r = getRow(obj);

  c = getCol(obj);

  if (isHole(r,c)) return;

  

  hc = getHoleInRow(r);

  if (hc != -1)

  {

    shiftHoleRow(hc,c,r);

    gmoves++;

    checkWin();

    return;

  }

  

  hr = getHoleInCol(c);



  if (hr != -1)

  {

    shiftHoleCol(hr,r,c);

    gmoves++;

    checkWin();

    return;

  }

}



function shuffle()

{

  var t,i,j,s,frac;



  gshuffling =  true;

  frac = 100.0/(gsize*(gsize+10));

  s = "% ";

  for (i=0;i<gsize;i++)

  {

    s += "|";

    for (j=0;j<gsize+10;j++)

    {  

      window.status = "Loading " + Math.round((i*(gsize+10) + j)*frac) + s  

      if (j%2==0)

      {

        t = r0(gsize);

        while (t == ghrow) t = r0(gsize); //skip holes

        getCell(t,ghcol).click();

      } 

      else

      {

        t = r0(gsize);

        while (t == ghcol) t = r0(gsize); //skip holes

        getCell(ghrow,t).click();

      }

    }

  }

  window.status = "";

  gshuffling = false;

}



function loadBoard(size)

{

  gsize = size;

  

  board.innerHTML = showTable(gsize);

  setHole(gsize-1,gsize-1);

  //shuffle();

}

</script>

<body bgcolor="#666655" text="white">

<center>

<h1>Jus' Games!</h1>

<span class=msg>Original Games by ©Arun Narayanan, Dec 2002<br> </span>



<table border=6 width="80%" cellpadding=4 cellspacing=0>

<tr><td width="98%"><h2>Arrange</h2></td>

<td align=center><input type=button class=but value="Home Page" onclick="window.location.href='index.html'"></td><td align=center><input type=button id=butHelp value="Hide Help" class="but" onclick="toggleHelp()"></td></tr>

<tr id=help><td colspan=3><h3>

<ol>

<li>Choose a Level (3 to 10).</li>

<li>The game board has blocks with numbers in it. Also there is a single "hole" that can be used for moving the blocks.</li>

<li>The objective of the game is to order the numbers using the "hole" for temporary movement.</li>

<li>Press the "Start Game" button. The timer would be started.</li>

<li>Move blocks in a row by clicking on them. A block can be moved only if it is in the same row or column as the "hole". Make a guess by typing in a number in the box provided.</li>

<li>You can move multiple blocks (in the same row or column as the "hole") by clicking the farthest block that you need to be moved.</li>

</ol>

Order all the numbers in the shortest time possible with a minimum number of moves...

</h3></td></tr>

</table>

<p>

<div id=test></div>

<table cellpadding=4>

<tr><td align=center>

<b>Choose Level: </B>

<select id=level onchange="loadBoard(parseInt(level.value))">

<option value='3'>3</option>

<option value='4' selected>4</option>

<script>

for (var i=5;i<=10;i++)

{

  document.write("<option value='" + i + "'>" + i + "</option>");

}


</script>

</select>

</td></tr>

<tr><td align=center>

<input type=button class=but value="Start Game" onclick="startGame();">

<tr><td align=center id=fldStatus class=capt2>

</td></tr>

</table>

<div id=board></div>

<p> 



<!-- Script Size:  10.06 KB -->

Try this:

<HEAD>

<style>

.bigcell {

  background-color:#aa9966;

  border:4px solid #aa9966;

  text-align:center;

}

.cell {

  width:40px;

  height:40px;

  font-family:Verdana, Arial;

  font-size:10pt;

  font-weight:bold;

  background-color:#996633;

  color:#ffff33;

  border-top:2px solid #aa9966;

  border-left:2px solid #aa9966;

  border-right:2px solid #663300;

  border-bottom:2px solid #663300;

  text-align:center;

}

.hole {

  width:40px;

  height:40px;

  background-color:#aa9966;

  text-align:center;

}

body,h1,h2,h3,.msg,capt1,capt2 {font-family:Verdana,Comic Sans MS,Arial;}

body {margin:0px;}

h1 {font-size:28pt; font-weight:bold; margin-bottom:0px;}

h2 {font-size:16pt; margin:0px; font-weight:bold;}

h3 {font-size:8pt; margin:0px; font-weight:bold;}

.msg {font-size:8pt; font-weight:bold;}

.tab {cursor:hand;}

.capt1 {font-size:10pt; font-weight:bold;}

.capt2 {font-size:9pt; font-weight:bold;}

.capt3 {font-size:14pt; font-weight:bold; color:yellow;}

.capt4 {font-size:10pt; font-weight:bold; color:yellow;}

.but {font-size:9pt; font-weight:bold; height:30px;background-color:#aaaa99;}

</style>



</HEAD>


<BODY onLoad="loadBoard(4)">

<script>

var gsize, ghrow, ghcol, gtime, gmoves, gintervalid=-1, gshuffling;

//Timer handler
var MAX_TIME = (60*1000)*10;
var gameTimer = 0;


function toggleHelp()

{

  if (butHelp.value == "Hide Help")

  {

    help.style.display = "none";

    butHelp.value = "Show Help";

  }

  else

  {

    help.style.display = "";

    butHelp.value = "Hide Help";

  }  

}



//random number between low and hi

function r(low,hi)

{

  return Math.floor((hi-low)*Math.random()+low); 

}



//random number between 1 and hi

function r1(hi)

{

  return Math.floor((hi-1)*Math.random()+1); 

}



//random number between 0 and hi

function r0(hi)

{

  return Math.floor((hi)*Math.random()); 

}



function startGame()

{

  shuffle();

  gtime = 0;

  gmoves = 0;

  // Get level
  var level = document.getElementById('level').value;
  // Calculate game time
  gameTimer = Math.floor(MAX_TIME/(parseInt(level, 10)*1000)); 
  
  tickTime();

  gintervalid = setInterval("tickTime()",1000);

}



function stopGame()

{

  if (gintervalid==-1) return;

  clearInterval(gintervalid);

  fldStatus.innerHTML = "";

  gintervalid=-1;

}



function tickTime()

{
	
  if(gtime == gameTimer) {
	alert("Timer over .... Game over hahahaha!!");
  }
  showStatus();

  gtime++;
  

}



function checkWin()

{

  var i, j, s;

  

  if (gintervalid==-1) return; //game not started!

  

  if (!isHole(gsize-1,gsize-1)) return;

  

  for (i=0;i<gsize;i++)

    for (j=0;j<gsize;j++)

    {

      if (!(i==gsize-1 && j==gsize-1)) //ignore last block (ideally a hole)

      {

       if (getValue(i,j)!=(i*gsize+j+1).toString()) return;

      }

    }

  stopGame();



  s = "<table cellpadding=4>";

  s += "<tr><td align=center class=capt3>!! CONGRATS !!</td></tr>";

  s += "<tr class=capt4><td align=center>You have done it in " + gtime + " secs ";

  s += "with " + gmoves + " moves!</td></tr>";

  s += "<tr><td align=center class=capt4>Your speed is " + Math.round(1000*gmoves/gtime)/1000 + " moves/sec</td></tr>";

  s += "</table>";

  fldStatus.innerHTML = s;

//  shuffle();

}



function showStatus()

{

  fldStatus.innerHTML = "Time: " + gtime + "/" + gameTimer + " secs   Moves: " + gmoves

}



function showTable()

{

  var i, j, s;

  

  stopGame();

  s = "<table border=3 cellpadding=0 cellspacing=0 bgcolor='#666655'><tr><td class=bigcell>";

  s = s + "<table border=0 cellpadding=0 cellspacing=0>";

  for (i=0; i<gsize; i++)

  {

    s = s + "<tr>";    

    for (j=0; j<gsize; j++)

    {

      s = s + "<td id=a_" + i + "_" + j + " onclick='move(this)' class=cell>" + (i*gsize+j+1) + "</td>";

    }

    s = s + "</tr>";        

  }

  s = s + "</table>";

  s = s + "</td></tr></table>";      

  return s;

}



function getCell(row, col)

{

  return eval("a_" + row + "_" + col);

}



function setValue(row,col,val)

{

  var v = getCell(row, col);

  v.innerHTML = val;

  v.className = "cell";

}



function getValue(row,col)

{

//  alert(row + "," + col);



  var v = getCell(row, col);

  return v.innerHTML;

}



function setHole(row,col)

{ 

  var v = getCell(row, col);

  v.innerHTML = "";

  v.className = "hole";

  ghrow = row;

  ghcol = col;

}



function getRow(obj)

{

  var a = obj.id.split("_");

  return a[1];

}



function getCol(obj)

{

  var a = obj.id.split("_");

  return a[2];

}



function isHole(row, col)

{

  return (row==ghrow && col==ghcol) ? true : false;

}



function getHoleInRow(row)

{

  var i;

  

  return (row==ghrow) ? ghcol : -1;

}



function getHoleInCol(col)

{

  var i;



  return (col==ghcol) ? ghrow : -1;

}



function shiftHoleRow(src,dest,row)

{

  var i;



  //conversion to integer needed in some cases!

  src = parseInt(src);

  dest = parseInt(dest);



  if (src < dest)

  {

    for (i=src;i<dest;i++)

    {

      setValue(row,i,getValue(row,i+1));

      setHole(row,i+1);

    }

  }

  if (dest < src)

  {

    for (i=src;i>dest;i--)

    {

      setValue(row,i,getValue(row,i-1));

      setHole(row,i-1);

    }

  }

}



function shiftHoleCol(src,dest,col)

{

  var i;

  

  //conversion to integer needed in some cases!

  src = parseInt(src);

  dest = parseInt(dest);

    

  if (src < dest)

  {//alert("src=" + src +" dest=" + dest + " col=" + col);

    for (i=src;i<dest;i++)

    {//alert(parseInt(i)+1);

      setValue(i,col,getValue(i+1,col));

      setHole(i+1,col);

    }

  }

  if (dest < src)

  {

    for (i=src;i>dest;i--)

    {

      setValue(i,col,getValue(i-1,col));

      setHole(i-1,col);

    }

  }

}



function move(obj)

{

  var r, c, hr, hc;



  if (gintervalid==-1 && !gshuffling) 

  {

    alert('Please press the "Start Game" button to start.')

    return;

  }

  r = getRow(obj);

  c = getCol(obj);

  if (isHole(r,c)) return;

  

  hc = getHoleInRow(r);

  if (hc != -1)

  {

    shiftHoleRow(hc,c,r);

    gmoves++;

    checkWin();

    return;

  }

  

  hr = getHoleInCol(c);



  if (hr != -1)

  {

    shiftHoleCol(hr,r,c);

    gmoves++;

    checkWin();

    return;

  }

}



function shuffle()

{

  var t,i,j,s,frac;



  gshuffling =  true;

  frac = 100.0/(gsize*(gsize+10));

  s = "% ";

  for (i=0;i<gsize;i++)

  {

    s += "|";

    for (j=0;j<gsize+10;j++)

    {  

      window.status = "Loading " + Math.round((i*(gsize+10) + j)*frac) + s  

      if (j%2==0)

      {

        t = r0(gsize);

        while (t == ghrow) t = r0(gsize); //skip holes

        getCell(t,ghcol).click();

      } 

      else

      {

        t = r0(gsize);

        while (t == ghcol) t = r0(gsize); //skip holes

        getCell(ghrow,t).click();

      }

    }

  }

  window.status = "";

  gshuffling = false;

}



function loadBoard(size)

{

  gsize = size;

  

  board.innerHTML = showTable(gsize);

  setHole(gsize-1,gsize-1);

  //shuffle();

}

</script>

<body bgcolor="#666655" text="white">

<center>

<h1>Jus' Games!</h1>

<span class=msg>Original Games by ©Arun Narayanan, Dec 2002<br> </span>



<table border=6 width="80%" cellpadding=4 cellspacing=0>

<tr><td width="98%"><h2>Arrange</h2></td>

<td align=center><input type=button class=but value="Home Page" onclick="window.location.href='index.html'"></td><td align=center><input type=button id=butHelp value="Hide Help" class="but" onclick="toggleHelp()"></td></tr>

<tr id=help><td colspan=3><h3>

<ol>

<li>Choose a Level (3 to 10).</li>

<li>The game board has blocks with numbers in it. Also there is a single "hole" that can be used for moving the blocks.</li>

<li>The objective of the game is to order the numbers using the "hole" for temporary movement.</li>

<li>Press the "Start Game" button. The timer would be started.</li>

<li>Move blocks in a row by clicking on them. A block can be moved only if it is in the same row or column as the "hole". Make a guess by typing in a number in the box provided.</li>

<li>You can move multiple blocks (in the same row or column as the "hole") by clicking the farthest block that you need to be moved.</li>

</ol>

Order all the numbers in the shortest time possible with a minimum number of moves...

</h3></td></tr>

</table>

<p>

<div id=test></div>

<table cellpadding=4>

<tr><td align=center>

<b>Choose Level: </B>

<select id=level onchange="loadBoard(parseInt(level.value))">

<option value='3'>3</option>

<option value='4' selected>4</option>

<script>

for (var i=5;i<=10;i++)

{

  document.write("<option value='" + i + "'>" + i + "</option>");

}


</script>

</select>

</td></tr>

<tr><td align=center>

<input type=button class=but value="Start Game" onclick="startGame();">

<tr><td align=center id=fldStatus class=capt2>

</td></tr>

</table>

<div id=board></div>

<p> 



<!-- Script Size:  10.06 KB -->

Your code was good but why is it the time won't stop after the game is over?..
How could I manage it so it will also work in Mozilla..
Thanks in advance..:D

That was not my code but yours :D
You can stop timer by using 'clearInterval(gintervalid)'.

Run your code on Firefox and use firebug to fix errors. :p

hehehe..lol :D

last question do you know how to add button name shuffle that the player can shuffle it if they what to..

hehehe..lol :D

last question do you know how to add button name shuffle that the player can shuffle it if they what to..

done this game :D here is it! thanks

<HEAD>

<style>

.bigcell {

  background-color:#aa9966;

  border:4px solid #aa9966;

  text-align:center;

}

.cell {

  width:40px;

  height:40px;

  font-family:Verdana, Arial;

  font-size:10pt;

  font-weight:bold;

  background-color:#996633;

  color:#ffff33;

  border-top:2px solid #aa9966;

  border-left:2px solid #aa9966;

  border-right:2px solid #663300;

  border-bottom:2px solid #663300;

  text-align:center;

}

.hole {

  width:40px;

  height:40px;

  background-color:#aa9966;

  text-align:center;

}

body,h1,h2,h3,.msg,capt1,capt2 {font-family:Verdana,Comic Sans MS,Arial;}

body {margin:0px;}

h1 {font-size:28pt; font-weight:bold; margin-bottom:0px;}

h2 {font-size:16pt; margin:0px; font-weight:bold;}

h3 {font-size:8pt; margin:0px; font-weight:bold;}

.msg {font-size:8pt; font-weight:bold;}

.tab {cursor:hand;}

.capt1 {font-size:10pt; font-weight:bold;}

.capt2 {font-size:9pt; font-weight:bold;}

.capt3 {font-size:14pt; font-weight:bold; color:yellow;}

.capt4 {font-size:10pt; font-weight:bold; color:yellow;}

.but {font-size:9pt; font-weight:bold; height:30px;background-color:#aaaa99;}

</style>



</HEAD>


<BODY onLoad="loadBoard(4)">

<script>

var gsize, ghrow, ghcol, gtime, gmoves, gintervalid=-1, gshuffling;

//Timer handler
var MAX_TIME = (60*1000)*10;
var gameTimer = 0;


//random number between low and hi

function r(low,hi)

{

  return Math.floor((hi-low)*Math.random()+low); 

}



//random number between 1 and hi

function r1(hi)

{

  return Math.floor((hi-1)*Math.random()+1); 

}



//random number between 0 and hi

function r0(hi)

{

  return Math.floor((hi)*Math.random()); 

}



function startGame()

{

  shuffle();

  gtime = 0;

  gmoves = 0;

  // Get level
  var level = document.getElementById('level').value;
  // Calculate game time
  gameTimer = Math.floor(MAX_TIME/(parseInt(level, 10)*1000)); 
  
  tickTime();

  gintervalid = setInterval("tickTime()",1000);

}



function stopGame()

{

  if (gintervalid==-1) return;

  clearInterval(gintervalid);

  fldStatus.innerHTML = "";

  gintervalid=-1;

}



function tickTime()

{
	
  if(gtime == gameTimer) {
	alert("Timer over .... Game over!!");
	clearInterval(gintervalid);
  }
  showStatus();

  gtime++;


}



function checkWin()

{

  var i, j, s;

  

  if (gintervalid==-1) return; //game not started!

  

  if (!isHole(gsize-1,gsize-1)) return;

  

  for (i=0;i<gsize;i++)

    for (j=0;j<gsize;j++)

    {

      if (!(i==gsize-1 && j==gsize-1)) //ignore last block (ideally a hole)

      {

       if (getValue(i,j)!=(i*gsize+j+1).toString()) return;

      }

    }

  stopGame();



  s = "<table cellpadding=4>";

  s += "<tr><td align=center class=capt3>!! CONGRATS !!</td></tr>";

  s += "<tr class=capt4><td align=center>You have done it in " + gtime + " secs ";

  s += "with " + gmoves + " moves!</td></tr>";

  s += "<tr><td align=center class=capt4>Your speed is " + Math.round(1000*gmoves/gtime)/1000 + " moves/sec</td></tr>";

  s += "</table>";

  fldStatus.innerHTML = s;

//  shuffle();

}



function showStatus()

{

  fldStatus.innerHTML = "Time: " + gtime + "/" + gameTimer + " secs Moves: " + gmoves 

}



function showTable()

{

  var i, j, s;

  

  stopGame();

  s = "<table border=3 cellpadding=0 cellspacing=0 bgcolor='#666655'><tr><td class=bigcell>";

  s = s + "<table border=0 cellpadding=0 cellspacing=0>";

  for (i=0; i<gsize; i++)

  {

    s = s + "<tr>";    

    for (j=0; j<gsize; j++)

    {

      s = s + "<td id=a_" + i + "_" + j + " onclick='move(this)' class=cell>" + (i*gsize+j+1) + "</td>";

    }

    s = s + "</tr>";        

  }

  s = s + "</table>";

  s = s + "</td></tr></table>";      

  return s;

}



function getCell(row, col)

{

  return eval("a_" + row + "_" + col);

}



function setValue(row,col,val)

{

  var v = getCell(row, col);

  v.innerHTML = val;

  v.className = "cell";

}



function getValue(row,col)

{

//  alert(row + "," + col);



  var v = getCell(row, col);

  return v.innerHTML;

}



function setHole(row,col)

{ 

  var v = getCell(row, col);

  v.innerHTML = "";

  v.className = "hole";

  ghrow = row;

  ghcol = col;

}



function getRow(obj)

{

  var a = obj.id.split("_");

  return a[1];

}



function getCol(obj)

{

  var a = obj.id.split("_");

  return a[2];

}



function isHole(row, col)

{

  return (row==ghrow && col==ghcol) ? true : false;

}



function getHoleInRow(row)

{

  var i;

  

  return (row==ghrow) ? ghcol : -1;

}



function getHoleInCol(col)

{

  var i;



  return (col==ghcol) ? ghrow : -1;

}



function shiftHoleRow(src,dest,row)

{

  var i;



  //conversion to integer needed in some cases!

  src = parseInt(src);

  dest = parseInt(dest);



  if (src < dest)

  {

    for (i=src;i<dest;i++)

    {

      setValue(row,i,getValue(row,i+1));

      setHole(row,i+1);

    }

  }

  if (dest < src)

  {

    for (i=src;i>dest;i--)

    {

      setValue(row,i,getValue(row,i-1));

      setHole(row,i-1);

    }

  }

}



function shiftHoleCol(src,dest,col)

{

  var i;

  

  //conversion to integer needed in some cases!

  src = parseInt(src);

  dest = parseInt(dest);

    

  if (src < dest)

  {//alert("src=" + src +" dest=" + dest + " col=" + col);

    for (i=src;i<dest;i++)

    {//alert(parseInt(i)+1);

      setValue(i,col,getValue(i+1,col));

      setHole(i+1,col);

    }

  }

  if (dest < src)

  {

    for (i=src;i>dest;i--)

    {

      setValue(i,col,getValue(i-1,col));

      setHole(i-1,col);

    }

  }

}



function move(obj)

{

  var r, c, hr, hc;



  if (gintervalid==-1 && !gshuffling) 

  {

    alert('Please press the "Start Game" button to start.')

    return;

  }

  r = getRow(obj);

  c = getCol(obj);

  if (isHole(r,c)) return;

  

  hc = getHoleInRow(r);

  if (hc != -1)

  {

    shiftHoleRow(hc,c,r);

    gmoves++;

    checkWin();

    return;

  }

  

  hr = getHoleInCol(c);



  if (hr != -1)

  {

    shiftHoleCol(hr,r,c);

    gmoves++;

    checkWin();

    return;

  }

}



function shuffle()

{

  var t,i,j,s,frac;



  gshuffling =  true;

  frac = 100.0/(gsize*(gsize+10));

  s = "% ";

  for (i=0;i<gsize;i++)

  {

    s += "|";

    for (j=0;j<gsize+10;j++)

    {  

      window.status = "Loading " + Math.round((i*(gsize+10) + j)*frac) + s  

      if (j%2==0)

      {

        t = r0(gsize);

        while (t == ghrow) t = r0(gsize); //skip holes

        getCell(t,ghcol).click();

      } 

      else

      {

        t = r0(gsize);

        while (t == ghcol) t = r0(gsize); //skip holes

        getCell(ghrow,t).click();

      }

    }

  }

  window.status = "";

  gshuffling = false;

}



function loadBoard(size)

{

  gsize = size;

  

  board.innerHTML = showTable(gsize);

  setHole(gsize-1,gsize-1);

  //shuffle();

}

</script>

<body bgcolor="black" text="white">

<center>
<br/>
<br/>
<br/>
<h1>Number Blocks</h1>
<br/>
<br/>
<br/>
<br/>
<br/>


<table border=6 width="80%" cellpadding=4 cellspacing=0>

<tr><td width="98%"><h2>Arrange</h2></td>

<tr id=help><td colspan=3><h3>

<ol>

<li>Choose a Level (3 to 10).</li>

<li>The game board has blocks with numbers in it. Also there is a single "hole" that can be used for moving the blocks.</li>

<li>The objective of the game is to order the numbers using the "hole" for temporary movement.</li>

<li>Press the "Start Game" button. The timer would be started.</li>

<li>Move blocks in a row by clicking on them. A block can be moved only if it is in the same row or column as the "hole". Make a guess by typing in a number in the box provided.</li>

<li>You can move multiple blocks (in the same row or column as the "hole") by clicking the farthest block that you need to be moved.</li>

<li>You can also click "Shuffle" button if you want to rearrange the blocks. </li>

<li>And if you want to stop the game just click "Stop Game" button. </li>

</ol>

Order all the numbers in the shortest time possible with a minimum number of moves...

</h3></td></tr>

</table>

<p>

<div id=test></div>

<table cellpadding=4>

<tr><td align=center>

<b>Choose Level: </B>

<select id=level onchange="loadBoard(parseInt(level.value))">

<option value='3'>3</option>

<option value='4' selected>4</option>

<script>

for (var i=5;i<=10;i++)

{

  document.write("<option value='" + i + "'>" + i + "</option>");

}


</script>

</select>

</td></tr>

<tr><td align=center>
<br/>
<br/>
<br/>
<br/>

<input type=button class=but value="Start Game" onclick="startGame();">
<input type=button class=but value="Shuffle" onclick="shuffle();">
<input type=button class=but value="Stop Game" onclick="stopGame();">
<br/>
<br/>

<tr><td align=center id=fldStatus class=capt2>
<br/>
</td></tr>

</table>
<br/>
<br/>
<br/>

<div id=board></div>

<p> 

<!-- Script Size:  10.06 KB -->

but i have mistake in time it should be the smaller the level the smaller the time the higher the level the higher should the time given..

anyone can help me to reverse the time..

what u mean by reverse :D

it should be..the higher the level the higher the time given to solve the puzzle..the lower the level the lower the time ...not higher the level the lower the time given to solve the puzzle.

you need to just change the gtime:

// Get level
var level = document.getElementById('level').value;
// Calculate game time
gameTimer = parseInt(level, 10)*5000;

ahh..i see..thanks a lot with your help..it's working..totally done :D

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.