function animate(elementID, newLeft, newTop, newWidth, newHeight, time, callback)
{
  var el = document.getElementById(elementID);
  if(el == null)
    return;
 
  var cLeft = parseInt(el.style.left);
  var cTop = parseInt(el.style.top);
  var cWidth = parseInt(el.style.width);
  var cHeight = parseInt(el.style.height);
  
  var totalFrames = 1;
  if(time > 0)
    totalFrames = time/40;

  var fLeft = newLeft - cLeft;
  if(fLeft != 0)
    fLeft /= totalFrames;
  
  var fTop = newTop - cTop;
  if(fTop != 0)
    fTop /= totalFrames;
  
  var fWidth = newWidth - cWidth;
  if(fWidth != 0)
    fWidth /= totalFrames;
  
  var fHeight = newHeight - cHeight;
  if(fHeight != 0)
    fHeight /= totalFrames;
    
  doFrame(elementID, cLeft, newLeft, fLeft, cTop, newTop, fTop, cWidth, newWidth, fWidth, cHeight, newHeight, fHeight, callback);
}

function moveSingleVal(currentVal, finalVal, frameAmt)
{
  if(frameAmt == 0 || currentVal == finalVal)
    return finalVal;
  
  currentVal += frameAmt;
  if(frameAmt > 0)
    if(currentVal >= finalVal) 
      return finalVal;
  if(frameAmt < 0)
    if(currentVal <= finalVal)
      return finalVal;
  return currentVal;
}

function doFrame(eID, cLeft, nLeft, fLeft, cTop, nTop, fTop, cWidth, nWidth, fWidth, cHeight, nHeight, fHeight, callback)
{
   var el = document.getElementById(eID);
   if(el == null)
     return;

  cLeft = moveSingleVal(cLeft, nLeft, fLeft);
  cTop = moveSingleVal(cTop, nTop, fTop);
  cWidth = moveSingleVal(cWidth, nWidth, fWidth);
  cHeight = moveSingleVal(cHeight, nHeight, fHeight);

  el.style.left = Math.round(cLeft) + 'px';
  el.style.top = Math.round(cTop) + 'px';
  el.style.width = Math.round(cWidth) + 'px';
  el.style.height = Math.round(cHeight) + 'px';
  
  if(cLeft == nLeft) 
    if(cTop == nTop)
      if(cHeight == nHeight)
        if(cWidth == nWidth)
        {
          if(callback != null)
            callback();
          return;
        }
    
  setTimeout( 'doFrame("'+eID+'",'+cLeft+','+nLeft+','+fLeft+','+cTop+','+nTop+','+fTop+','+cWidth+','+nWidth+','+fWidth+','+cHeight+','+nHeight+','+fHeight+','+callback+')', 40);
}

function fun()
{
  var x = parseInt(document.getElementById("newXBox").value);
  var y = parseInt(document.getElementById("newYBox").value);
  var w = parseInt(document.getElementById("newWBox").value);
  var h = parseInt(document.getElementById("newHBox").value);
  var t = parseInt(document.getElementById("timeBox").value);
  if(x < 0 || x > 531)
  {
    alert("Please enter in an X value between 0 and 520.");
    return;
  }
  if(y < 0 || y > 250)
  {
    alert("Please enter in a y value between 0 and 250.");
    return;
  }
  if(w < 0 || w > 531)
  {
    alert("Please enter in a width value between 0 and 520.");
    return;
  }
  if(h < 0 || h > 250)
  {
    alert("Please enter in a height value between 0 and 250.");
    return;
  }
  if(t < 0)
  {
    alert("Please enter in a time value above 0.");
    return;
  }
  animate("ex1Box",x,y,w,h,t,null);  
}

var running = false;
function AroundAndAround()
{
  if(running) return;
  running = true;
  animate("ex2Box",290,215,535,325,1200,stepone); 
}
function stepone() {animate("ex2Box",10,10,150,45,2000,redirects); }
function steptwo() {animate("ex1Box",10,80,150,200,600,redirects);}

function redirects() {window.location="home.php";}
