var iFontSize = 0;
var FontSizeArray = new Array(9);
FontSizeArray[0] = "8px";
FontSizeArray[1] = "10px";
FontSizeArray[2] = "12px";
FontSizeArray[3] = "16px";
FontSizeArray[4] = "20px";
FontSizeArray[5] = "24px";
FontSizeArray[6] = "36px";
FontSizeArray[7] = "48px";
FontSizeArray[8] = "60px";

document.oncontextmenu = disableRightClick;

function disableRightClick() 
{
  alert('Source code is COPYRIGHTED. Please, do not reproduce.');
  return false;
}

function tick() 
{
  document.all["Cong"].style.fontSize = FontSizeArray[iFontSize];
  if (iFontSize < 8) 
  {
    iFontSize++;
    window.tmr = setTimeout('tick()', 100);
  }
  else
    clearTimeout(window.tmr);
}

var strImgDragging = null;        // the global 'piece being moved' variable
var ImgPos = new Array(24);
var X, Y, Num = 0;
//            X / Y
ImgPos[0] = "0/0";
ImgPos[1] = "166/1";
ImgPos[2] = "249/1";
ImgPos[3] = "84/1";
ImgPos[4] = "332/1";
ImgPos[5] = "1/61";
ImgPos[6] = "148/61";
ImgPos[7] = "84/41";
ImgPos[8] = "249/39";
ImgPos[9] = "314/61";
ImgPos[10] = "1/121";
ImgPos[11] = "249/121";
ImgPos[12] = "62/101";
ImgPos[13] = "145/121";
ImgPos[14] = "332/100";
ImgPos[15] = "1/181";
ImgPos[16] = "62/164";
ImgPos[17] = "249/161";
ImgPos[18] = "148/163";
ImgPos[19] = "315/181";
ImgPos[20] = "1/219";
ImgPos[21] = "65/240";
ImgPos[22] = "249/240";
ImgPos[23] = "167/222";
ImgPos[24] = "332/220";

function mouseDownEvent()         // set the jigsaw piece to be moved
{
  var strID, i, j;
  var posLeft, posTop;

  strID = event.srcElement.id;
  if (strID.indexOf("P") != -1)   // if this is a jigsaw piece
  {
    strImgDragging = strID        // save the ID in a global variable
    i = strID.substring(strID.indexOf("P") + 1);
    j = ImgPos[i - 1].indexOf("/");
    X = ImgPos[i - 1].substring(0, j);
    Y = ImgPos[i - 1].substring(j + 1);
    
    posLeft = Math.abs(document.all[strImgDragging].style.pixelLeft - X);
    posTop = Math.abs(document.all[strImgDragging].style.pixelTop - Y);
    if (posLeft <= 5 && posTop <= 5) 
    {
      document.all[strImgDragging].style.pixelLeft = X;
      document.all[strImgDragging].style.pixelTop = Y;
      document.all[strImgDragging].style.zIndex = -1;
      strImgDragging = null;        // set global variable to null
    }
    else 
    {
      // bring the piece to the top of the z-order
      document.all[strImgDragging].style.zIndex = 1;
      window.status = "Drag this piece onto the grid and release the mouse to position it ...";
    }

    if (window.event.button == 2) 
    {
      document.all[strImgDragging].style.pixelLeft = X;
      document.all[strImgDragging].style.pixelTop = Y;
      document.all[strImgDragging].style.zIndex = -1;
      strImgDragging = null;        // set global variable to null
      Num++;
    }
  }
  else 
  {
    strImgDragging = null;        // set global variable to null
  }
}

function mouseMoveEvent()    // move the jigsaw piece
{
  if (strImgDragging != null) 
  {
    var saveX, saveY;

    saveX = document.all[strImgDragging].style.pixelLeft;
    saveY = document.all[strImgDragging].style.pixelTop;
    // move the image to the new position
    document.all[strImgDragging].style.pixelLeft = event.x - Maindiv.style.posLeft - 30;
    document.all[strImgDragging].style.pixelTop = event.y - Maindiv.style.posTop - 30;

//    window.status = 'X=' + document.all[strImgDragging].style.pixelLeft + ' Y=' + document.all[strImgDragging].style.pixelTop
//     + ' event.x=' + event.x + ' event.y=' + event.y;

    if (document.all[strImgDragging].style.pixelLeft < 0) document.all[strImgDragging].style.pixelleft = saveX;
    if (document.all[strImgDragging].style.pixelTop < 0) document.all[strImgDragging].style.pixeltop = saveY;
  }
  // prevent event being handled elsewhere and the default action
  event.cancelBubble = true;
  event.returnValue = false;
}

function mouseUpEvent()     // place the jigsaw piece on the grid
{
  var posLeft, posTop;

  if (strImgDragging != null) 
  {
    // return the piece to the lower z-order position
    document.all[strImgDragging].style.zIndex = 0;

    // stop dragging, and position the piece in line with grid.    
    posLeft = Math.abs(document.all[strImgDragging].style.pixelLeft - X);
    posTop = Math.abs(document.all[strImgDragging].style.pixelTop - Y);

//    window.status = 'X=' + X + ' Y=' + Y
//    + ' pic.x=' + document.all[strImgDragging].style.pixelLeft + ' pic.y=' + document.all[strImgDragging].style.pixelTop
//    + ' posLeft=' + posLeft + ' posTop=' + posTop; 
    
    if (posLeft <= 5 && posTop <= 5) 
    {
      document.all[strImgDragging].style.pixelLeft = X;
      document.all[strImgDragging].style.pixelTop = Y;
      document.all[strImgDragging].style.zIndex = -1;
      Num++;
    }

    // reset the global 'dragging' variable
    strImgDragging = null;

    // prevent event being handled elsewhere and the default action
    event.cancelBubble = true;
    event.returnValue = false;
    if (Num == 24) 
    {
      document.all["Grid"].style.visibility = "hidden";
      document.all["JisawImg"].style.zIndex = 0;
      document.all["JisawImg"].style.visibility = "visible";
      document.all["Cong"].style.visibility = "visible";
      document.all["Cong"].style.zIndex = 2;
      window.tmr = setTimeout('tick()', 100);
    }
  }
}

document.onmousedown = mouseDownEvent;
document.onmousemove = mouseMoveEvent;
document.onmouseup = mouseUpEvent;