var id      = new Array();

var G_px    = new Array();
var G_py    = new Array();
var sx      = new Array();
var sy      = new Array();
var bx      = new Array();
var by      = new Array();

var moves   = new Array();
var time    = new Array();
var timer	= new Array();
var playing = new Array();
var solved  = new Array();


function getImage(nr, x, y) {
  //alert('getImage('+nr+', '+x+', '+y+')');
  return document.getElementById('p' + nr + '_' + x + 'x' + y);
} // getImage


function handleFirstMove(nr) {
  time[nr] = new Date();
  timer[nr] = setTimeout('updateTimeElapsed('+nr+')',333);
  if (-1 != id[nr]) { document.getElementById('puzzleform'+nr).submit(); }
}

function handleSolved(nr) {

  clearTimeout(timer[nr]); 
  var time = timeElapsed(nr);
  if (-1 != id[nr]) { document.getElementById('puzzleform'+nr).submit(); }

  // Make the blank tile visible
  img = getImage(nr, bx[nr], by[nr]);
  img.style.left = -bx[nr] * sx[nr];
  img.style.top  = -by[nr] * sy[nr];
  img.style.display = '';
  alert("\n\n\tCongratulations!\n\tYou've solve this puzzle in "+moves[nr]+" moves and "+time+".\n\n");
  playing[nr] = false;
  solved[nr] = true;
} // handleSolved

function checkSolved(nr) {

  ///alert('checkSolved('+nr+') '+G_px[nr]+' '+G_py[nr]+' '+G_px+' '+G_py);
  var i, j, img;
  for(j = 0; j < G_py[nr]; j++) {
	for(i = 0; i < G_px[nr]; i++) {
	  img = getImage(nr, i, j);
	  // check if this is not the blank
	  if ((i != bx[nr]) || (j != by[nr])) {
		if ((parseInt(img.style.left) != (-i * sx[nr])) ||
            (parseInt(img.style.top)  != (-j * sy[nr]))) {
	      // this tile is not on the right spot
		  // puzzle isn't solved
	      return false;
		}
	  } 
	}
  }
  // Everything is O.K. Puzzle is solved
  handleSolved(nr);
  return true;
} checkSolved

function updateTimeElapsed(nr) {
  document.getElementById('time'+ nr).innerHTML = timeElapsed(nr);
  timer[nr] = setTimeout('updateTimeElapsed('+nr+')',333);
} // 

function timeElapsed(nr) {
  var date = new Date();
  var tm = date.getTime() - time[nr].getTime();;

  document.getElementById('puzzleform'+ nr).time.value = tm;

  ms = tm % 1000; if (ms < 10) { ms = '00' + ms; } else if (ms < 100) { ms = '0' + ms }
  tm = (tm - ms) / 1000;
  sec = tm % 60; if (sec < 10) { sec = '0' + sec; }
  min = (tm - sec) / 60;
  //min = tm;
  return min + ':' + sec; // + '.' + ms;
} // timeElapsed

function slideUp(nr, x, y) {
  var fimg = getImage(nr, bx[nr], by[nr]);
  var j, img;
  for(j = by[nr] + 1; j <= y; j++) {
    // the image from where we move
	img = getImage(nr, x, j);
	fimg.style.top  = img.style.top;
	fimg.style.left = img.style.left;
	fimg = img;
  }
} // slideUp

function slideDown(nr, x, y) {
  var fimg = getImage(nr, bx[nr], by[nr]);
  var j, img;
  for(j = by[nr] - 1; j >= y; j--) {
    // the image from where we move
	img = getImage(nr, x, j);
	fimg.style.top  = img.style.top;
	fimg.style.left = img.style.left;
	fimg = img;
  }
} // slideDown

function slideLeft(nr, x, y) {
  var fimg = getImage(nr, bx[nr], by[nr]);
  var i, img;
  for(i = bx[nr] + 1; i <= x; i++) {
    // the image from where we move
	img = getImage(nr, i, y);
	fimg.style.top  = img.style.top;
	fimg.style.left = img.style.left;
	fimg = img;
  }
} // slideLeft

function slideRight(nr, x, y) {
  var fimg = getImage(nr, bx[nr], by[nr]);
  var i, img;
  for(i = bx[nr] - 1; i >= x; i--) {
    // the image from where we move
	img = getImage(nr, i, y);
	fimg.style.top  = img.style.top;
	fimg.style.left = img.style.left;
	fimg = img;
  }
} // slideRight

function slide(nr, x, y) {
  ///alert('slide('+nr+', '+x+', '+y+')');

  // if the puzzle is solved go to the alternate url
  if (solved[nr]) {
	 if (-1 ==id[nr]) {
       top.location.href = 'http://puzzle.technetium.be';
	 } else {
       top.location.href = 'http://puzzle.technetium.be/detail.php?id=' + id[nr];
	 }
  } else {
	// if we clicked on the trans square... do nothing
	if ((x == bx[nr]) && (y == by[nr])) return;

    //alert('slide'+x+', '+y);
	// we clicked in the row/column where the blank is...
	if ((x == bx[nr]) || (y == by[nr])) {
	  // make the blank block visible
	  getImage(nr, bx[nr], by[nr]).style.display = '';
	  
	  // the next four lines determine where the trans is
	  // in respect to the position we clicked on and then
	  // move the pieces according: either up, down, left or right
	  if (y > by[nr]) slideUp(nr, x, y);
	  if (y < by[nr]) slideDown(nr, x, y);
	  if (x > bx[nr]) slideLeft(nr, x, y);
	  if (x < bx[nr]) slideRight(nr, x, y);

	  // the blank will now be where we clicked to make the move
	  bx[nr] = x; 
	  by[nr] = y;
	  getImage(nr, x, y).style.display = 'none';
	
	  if (playing[nr]) {
	    if (0 == moves[nr]) {
          handleFirstMove(nr);
		}
		moves[nr]++;
        document.getElementById('moves' + nr).innerHTML = moves[nr];
	    document.getElementById('puzzleform'+ nr).moves.value = moves[nr];
        document.getElementById('time'+ nr).innerHTML = timeElapsed(nr);
        //document.getElementById('time').innerHTML = 'bla';
        checkSolved(nr);
	  }
	}
  }
} // slide

function setGlobals(nr, _id, _px, _py, _sx, _sy, _bx, _by) {
  ///alert('setGlobals('+nr+', '+_id+', '+_px+', '+_py+', '+_sx+', '+_sy+', '+_bx+', '+_by+')');

  id[nr] = _id;
  G_px[nr] = _px;
  G_py[nr] = _py;
  sx[nr] = _sx;
  sy[nr] = _sy;
  bx[nr] = _bx;
  by[nr] = _by;
  
  moves[nr]   = 0;
  time[nr]    = 0;
  playing[nr] = false;
  solved[nr]  = false;
} // setGlobals

function showPuzzle(nr, url, title) {
  var i, j;

  document.write('<table border="0"><tr>');
  document.write('<td colspan="3" align="center">');
  if (-1 == id[nr]) {
    document.write('<a href="http://puzzle.technetium.be"><b>');
  } else {
    document.write('<a href="http://puzzle.technetium.be/detail.php?id=' + id[nr] + '"><b>');
  }
  if ('' == title) {
    document.write('puzzle.technetium.be');
  } else {
    document.write(title);
  }
  document.write('</b></a>');
  document.write('</td></tr><tr><td colspan="3" align="center">');
  document.write('<table cellspacing="0" cellpadding="0" border="0">');
  for (j = 0; j < G_py[nr]; j++) {
    document.write('<tr>');
    for (i = 0; i < G_px[nr]; i++) {
      document.write('<td><div style="width: ' + sx[nr] + '; height: ' + sy[nr] + '; overflow:hidden" onclick="slide(' + nr + ',' + i + ',' + j + ')"><img src="http://' + url + '" alt=""  id="p' + nr + '_' + i + 'x' + j + '" style="position: relative; left: '+ (-i * sx[nr]) + '; top:' + (-j * sy[nr]) + '; cursor: pointer" /></div></td>');
    }
    document.write('</tr>');
  }
  document.write('</table>');
  document.write('</td></tr><tr>');
  document.write('<td>Moves: <span id="moves' + nr + '">0</span></td><td>');
  document.write('<form id="puzzleform'+nr+'" name="puzzleform'+nr+'" action="update.php" method="post" target="puzzle_iframe">');
  document.write('<input type="hidden" name="nr" value="'+nr+'"/>');
  document.write('<input type="hidden" name="game" value="'+id[nr]+'"/>');
  document.write('<input type="hidden" name="play" value="0"/>');
  document.write('<input type="hidden" name="code" value="13.59.100.42"/>');
  document.write('<input type="hidden" name="moves" />');
  document.write('<input type="hidden" name="time" />');
  document.write('</form>');
  document.write('<iframe name="puzzle_iframe" width="00" height="00" frameborder="0" scrolling="no"></iframe>');
  document.write('</td><td align="right">');
  document.write('Time: <span id="time' + nr + '">0:00</span></td>');
  document.write('</tr></table>');
} // showPuzzle

function randomSlide(nr, iterations) {

  var x;
  var y;

  // suspend play while we do it
  playing[nr] = false;
  // count down the iterations
  while (iterations--) {
	// initially we set an invalid move because this routine
	// just fakes mouse clicks at randomly selected positions
	// and we want to select a valid move randomly from the start
	x = bx[nr];
    y = by[nr];
	if (iterations % 2) {
      // keep selecting a new X position until we get one
	  // that is neither the trans square nor going to give
	  // us a result the same as the previous move
	  while (x == bx[nr]) { x = Math.floor(Math.random() * G_px[nr]); }
	  // we set the column to be the same as the trans square
	  y = by[nr];
	} else { // fake a move in the same row as the trans
	  while (y == by[nr]) { y = Math.floor(Math.random() * G_py[nr]); }
 	  x = bx[nr];
	}
	slide(nr, x, y);
  }

  // resume playing
  playing[nr] = true;
} // randomSlide

function puzzle(_id, _url, _title, _px, _py, _sx, _sy, _bx, _by) {
  ///alert('puzzle('+_id+', '+_url+', '+_title+', '+_px+', '+_py+', '+_sx+', '+_sy+', '+_bx+', '+_by+')');
  //document.write(_id);
  var nr = id.length+0;
  setGlobals(nr, _id, _px, _py, _sx, _sy, _bx, _by);
  showPuzzle(nr, _url, _title);
  getImage(nr, bx[nr], by[nr]).style.display = 'none';
  randomSlide(nr, Math.round(Math.pow(G_px[nr] * G_py[nr], 1.4)));
} // puzzle