// Detect browser used.
if (parseInt(navigator.appVersion) >= 4)
 {
     if (navigator.appName == "Netscape") 
          Nav = true
     else 
          IE = true
}

// Set z-level
function setZIndex(sObj, zOrder)
{
     if(Nav)
          sObj.zIndex = zOrder
     else if(IE)              
          SelectedObj.style.zIndex = zOrder    
}

// Move the peg to the desired position on the screen
function shiftTo(obj, x, y)
{
     if(Nav)
          obj.moveTo(x,y)
     else if(IE)
     {
          obj.style.pixelLeft = x
          obj.style.pixelTop = y
     }
}

// Find out which peg was selected
function setSelectedElem(evt)
{   
     if(Nav)
     {
          ClickX = evt.pageX;
          ClickY = evt.pageY;                 
          var TestObj;

          for( I=document.Table.layers.length - 1; I>=0; I-- )
          {
               TableObj = document.Table
               TestObj = TableObj.document.layers[I]    
                                         
                if( (ClickX > ( TestObj.pageX) ) && 
                    (ClickX < (TestObj.pageX + TestObj.clip.width) ) &&  
                    (ClickY > (TestObj.pageY) ) && 
                    (ClickY < (TestObj.pageY + TestObj.clip.height))
                  ) 
               {
                    if(TestObj.zIndex >= 1)                 
                         SelectedObj = TestObj  
                     if (SelectedObj)
                    {         
                         setZIndex(SelectedObj, 100);
                         return;
                    }                                     
               }
          }
           if( (ClickX > ( TableObj.pageX) ) && 
               (ClickX < (TableObj.pageX + TableObj.clip.width) ) &&  
               (ClickY > (TableObj.pageY) ) && 
               (ClickY < (TableObj.pageY + TableObj.clip.height))
             ) 
          {
               SelectedObj = TableObj  
               return;                                                         
          }
     }    
     else if(IE)
     {
          TestObj = window.event.srcElement.parentElement

          if(TestObj.style.zIndex >= 1)                 
               SelectedObj = TestObj  

           if (SelectedObj)
          {         
               setZIndex(SelectedObj.style, 100);
               return;
          }

          if(TestObj.style.zIndex == -1)
          {
               SelectedObj = TestObj;
               return
          }
     }     
     SelectedObj = null;
     return;	
}

// Drag an element
function dragIt(evt) 
{
     if (SelectedObj) 
     {
          if(Nav)
          {
               shiftTo(SelectedObj, (evt.pageX - offsetX), (evt.pageY - offsetY))			
          }
          else if(IE)
          {
               TableObj = document.all["Table"]
               if( TableObj == SelectedObj )
               {
                    shiftTo(SelectedObj, (window.event.clientX-offsetX), (window.event.clientY-offsetY) )
                    return false
               }                    
               shiftTo(SelectedObj, ((window.event.clientX-TableObj.offsetLeft-offsetX)), ((window.event.clientY-TableObj.offsetTop-offsetY) ))
               return false
          }
     }
}

// Turn selected element on
function engage(evt)
 {            
     setSelectedElem(evt)     
     if (SelectedObj)
     {        
          if(Nav)
          {
               homeX = SelectedObj.left  
               homeY = SelectedObj.top 
               offsetX = evt.pageX - SelectedObj.left
               offsetY = evt.pageY - SelectedObj.top

               if( FirstTime && SelectedObj.zIndex >= 1)
               {
                    Find = (SelectedObj.id).lastIndexOf("M");
                    sIndex = (SelectedObj.id).substring(Find+1, 20);
                    FirstTime = false;
                    Placement[parseInt(sIndex)] = false;
                    SelectedObj.visibility = 'hide';
               }
          }
          else if(IE)
          {        
               TableObj = document.all["Table"]       
               homeX = SelectedObj.offsetLeft;
               homeY = SelectedObj.offsetTop;
               offsetX = window.event.offsetX
               offsetY = window.event.offsetY

               if( FirstTime && SelectedObj.style.zIndex > 0 )
               {
                    Find = (SelectedObj.id).lastIndexOf("M");
                    sIndex = (SelectedObj.id).substring(Find+1, 20);
                    FirstTime = false;
                    Placement[parseInt(sIndex)] = false;
                    SelectedObj.style.visibility = 'hidden';
               }
          }               
     }
     return false
}

// Turn selected element off
function release(evt)
{
     if (SelectedObj) 
     {
          if( SelectedObj.zIndex == 100 )
               setZIndex(SelectedObj, 1)
          var tmpObj
     
          for(I=0; I<15; I++) 
          {  
               if(Nav)
                    tmpObj = eval("document.Table.document.ImgPeg"+I)
               else if(IE)
                    tmpObj = document.all[("ImgPeg"+I)]                       
               if (isClose(SelectedObj,tmpObj) )
               {
                    Find = (SelectedObj.id).lastIndexOf("M");
                    sIndex = (SelectedObj.id).substring(Find+1, 20);
                    if( Moves[parseInt(sIndex)][I] != -1 )
                    {
                         if( !Placement[I] && Placement[Moves[parseInt(sIndex)][I]]  )
                         {                                                                         
                              if(Nav)
                              {
                                   tObj = eval("document.Table.document.ImgPegM"+Moves[parseInt(sIndex)][I]);
                                   tObj.visibility = 'hide'
                              }
                              else if(IE)
                              {
                                   tObj = document.all[ ("ImgPegM"+Moves[parseInt(sIndex)][I]) ]
                                   tObj.style.visibility = 'hidden'
                              }                                  
                              Placement[I] = true;
                              Placement[sIndex] = false;
                              Placement[Moves[parseInt(sIndex)][I]] = false;
                              replaceIt(tmpObj,SelectedObj,I)
                         }
                    }
	        break
               }                
          }		
          if(Nav)
          {
               if( SelectedObj.zIndex > 0 )                      
                    shiftTo(SelectedObj,homeX,homeY)
          }         
          else if(IE)
          {       
               if(SelectedObj.style.zIndex == 100)
                    shiftTo(SelectedObj,homeX,homeY)               
          }
          SelectedObj = null                   
     }
}


// Replace the contents of the hole with the dragged object...
function replaceIt(targetObj,sourceObj,index)
{   
     if(Nav)
     {
          TObj = eval("document.Table.document.ImgPegM"+index);
          TObj.visibility = 'show';
          sourceObj.visibility= 'hide';
     }
     else if(IE)
     {
          TObj = document.all[ ("ImgPegM"+index) ]
          TObj.style.visibility = 'visible';
          sourceObj.style.visibility= 'hidden';
     }    
}   

// See how close the peg is to the hole
function isClose(objA, objB)
 {
     if(Nav)
     {
          if( (objA.left-objB.left)*(objA.left-objB.left) + 
              (objA.top-objB.top)*(objA.top-objB.top) <= 100) 
                    return true 
     }
     else if(IE)     
     {        
          if( (objA.offsetLeft-objB.offsetLeft)*(objA.offsetLeft-objB.offsetLeft) + 
             (objA.offsetTop-objB.offsetTop)*(objA.offsetTop-objB.offsetTop) <= 100) 
                    return true 
     }
     return false
}

function resizetrap(evt)
{
     location.reload()
//     FirstTime = true;
//     SelectedObj = null
     return false   
}

// Set up needed stuff
function init()
{
     if(Nav)     
     {
          document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP)
          window.captureEvents(Event.RESIZE)
          window.onresize = resizetrap

          PositionX = (window.innerWidth -  document.Table.clip.width)/2
          PositionY = document.Table.top
          TableObj = document.Table
     }
         
     document.onmousedown = engage
     document.onmousemove = dragIt
     document.onmouseup = release

     // For some reason IE dosen't like my z settings from the css, they are always set to 0. So I declare them here with the correct depth.
     if(IE)
     {
          for( I=0; I<15; I++)
          {
               sObj = document.all[("ImgPegM"+I)];
               sObj.style.zIndex = 1;
         }
          sObj = document.all["Table"];
          sObj.style.zIndex = -1;

          TableObj = sObj
          ScreenX = screen.availWidth
          TableX = TableObj.style.pixelWidth
          PositionX = (ScreenX - TableX)/2
          PositionY = (document.all["Table"]).style.pixelTop
     }
     
     // Center Table  
     shiftTo(TableObj,PositionX,PositionY)

}