// JavaScript Sliding Layer

/*  This animation is thanks to the work at http://youngpup.net 
for the idea that the motion can ease out and the many tutorials
at http://jennifermadden.com that make browser compatable layers
understandable. */ 

// Global Variables for Browser Sniffing
var ie  = document.all ? 1 : 0
var ns4 = document.layers ? 1 : 0
var w3c = document.getElementById ? 1 : 0
// cross-browser functionality so that the layer addressing can be fixed for the old copies
// of IE and Netscape and all new browsers now support the getElementById method
function dom(id){
  var d = document;
  var path = ns4 ? d.layers[id] : ie ? d.all[id] : d.getElementById(id) 
  return path  //return the path to the css layer depending on which browser is looking at the page
}
// turns visibility on for the layer based on the id
function show(id) {
  var cheshire = dom(id)
  if (ns4) { cheshire.visibility = "visible" } else { cheshire.style.visibility = "visible" }
}
// provide the layer ID and this will turn visibility off
function hide(id) {
  var cheshire = dom(id)
  if (ns4) { cheshire.visibility = "hidden" } else { cheshire.style.visibility = "hidden" }
}
/* Wow, it really works.
Bryan Varner stayed up all night for the parabolic curve to calculate the motion
the rest is inspired by the youngpup.net slideout menu.

Call it with a setInterval method and it just needs to loop untill time runs out 
and it skids to a stop. it also needs the current time so be sure to grab that just 
before calling the function

example:
nice = 10 // set your nice level 
startTime = (new Date()).getTime()
brakes = window.setInterval('slide([LAYER ID],startTime,[end time],[horizontal start position],[vertical start position],[horizontal end position],[vertical end position],brakes)',nice) */

function slide(scene,startTime,endTime,leftStart,topStart,leftEnd,topEnd,intervalID,next) {
	var elapsedTime = (new Date()).getTime() - startTime
	var rate = Math.sqrt(endTime)
	if (elapsedTime>endTime) {
	  skid(scene,leftEnd,topEnd,intervalID,next)
	} else {
	   elapsedSqrt = Math.sqrt(elapsedTime)
	   leftPos   = Math.round((elapsedSqrt/rate)*(leftEnd-leftStart))+leftStart
	   topPos  = Math.round((elapsedSqrt/rate)*(topEnd-topStart))+topStart
	  if (ns4) {
	  	scene.left = leftPos
		scene.top = topPos 
	  } else {
	    scene.style.left = leftPos + "px"
		scene.style.top = topPos + "px"
	  }
   }	
}	
// When the time has elapsed go ahead and call skid to stop the slide
// skid is just called by the slide function so it really doesn't 
// need any user documentation.
function skid(scene,leftPos,topPos,intervalID,next) {
	  if (ns4) {
	  	scene.left = leftPos
		scene.top = topPos 
	  } else {
	    scene.style.left = leftPos + "px"
		scene.style.top = topPos + "px"
	  }	
	  clearTimeout(intervalID)
	  eval(next)
}
/* example function

function yourFuction() {
  // hide a layer
  hide([layerId])
  // show a layer
  show([layerId])
  layerToMove = dom(layerId)
  // set a horizontal position directly
  if ns4 layerToMove.left=[position] else layerToMove.style.left=[position]+"px"
  // set a vertical position directly
  if ns4 layerToMove.top=[position] else layerToMove.style.top=[position]+"px"
  // slide from one position to another
  startTime = (new Date()).getTime()
  duration = 1000 // make the move in one second
  xStart = [horizontal start position]
  yStart = [vertical start position]
  xEnd = [horizontal end position]
  yEnd = [vertical end position]
  nice = 10 // set your nice level 
  brakes = window.setInterval('slide(layerToMove,startTime,duration,xStart,yStart,xEnd,yEnd,brakes,"next function to perform")',nice) 
} 

End example function */