//determine the browser type
if(document.getElementById) browser = "dom";
else if(document.all) browser = "ie4";
else if(document.layers) browser = "n4";

//universal function to get an element via a DOM reference
function getElementByName(el, parent, parentParent) {
	//IE4
	if(browser == "ie4") obj = document.all(el);
	//N4 - must reference via parent objects if they exist
	else if(browser == "n4") {
		if(parent && parentParent) {
			obj = document.layers[parentParent].layers[parent].layers[el];
		}
		else if(parent) {
			obj = document.layers[parent].layers[el];
		}
		else obj = document.layers[el];
	}
	//DOM browsers
	else if(browser == "dom") obj = document.getElementById(el);
	
	//return the object
	return obj;
}

function uslLayer(name, parent, parentParent) {
	//assign the layer object to this.layer
	this.layer = getElementByName(name, parent, parentParent);
	this.name = name;
	//public properties
	this.x = 0;
	this.y = 0;
	this.xExact = 0;
	this.yExact = 0;
	this.width = 0;
	this.height = 0;
	this.visibility = true;
	//private properties
	this.speedX = 0;
	this.speedY = 0;
	//property to enable string references to the uslLayer
	this.obj = name + "Object"; 	
	eval(this.obj + "=this");
	//debug
	this.debug = false;
	
	//public functions
	//update all of the attributes for this layer
	this.update = function update() {
		//assign the correct values for x,y,width,height
		if(browser == "dom") {
			this.x = this.layer.offsetLeft;
			this.y = this.layer.offsetTop;
			this.width = this.layer.offsetWidth;
			this.height = this.layer.offsetHeight;
		}
		else if(browser == "n4") {
			this.x = this.layer.x;
			this.y = this.layer.y;
			this.width = this.layer.clip.right;
			this.height = this.layer.clip.bottom;
		}
		//assign the exact x,y values for motion
		if(!this.xExact && !this.yExact) {
			this.xExact = this.x;
			this.yExact = this.y;
		}
		//debug
		if(this.debug) {
			window.status = "x:" + this.xExact + " y:" + this.yExact;
		}
	}
	
	//move the block to (x,y)
	this.moveTo = function moveTo(x,y) {
		if(browser == "dom") {
			this.layer.style.left = x;
			this.layer.style.top = y;
		}
		else if(browser == "n4") {
			this.layer.x = x;
			this.layer.y = y;
		}
		//update the layer
		this.update();
	}
	
	//glide the block to (x,y)
	this.glideTo = function glideTo(x,y,speed) {
		//work out distances
		distanceX = x - this.xExact;
		distanceY = y - this.yExact;
		//work out the speed
		acceleration = 1/speed;
		this.speedX = ((distanceX) / acceleration);
		this.speedY = ((distanceY) / acceleration);
		//move the layer
		if(this.speedX > 0.2 || this.speedY > 0.2 || this.speedX < -0.2 || this.speedY < -0.2) {
			//work out destination
			destX = this.xExact + this.speedX;
			destY = this.yExact + this.speedY;
			//do the animation
			this.xExact = destX;
			this.yExact = destY;
			//move the layer
			this.moveTo(destX,destY);
			//clear any current timeouts - to avoid duplicates - hence the layer 'looping'
			clearTimeout(this.timeout);
			//set the timeout for the next step of movement
			this.timeout = setTimeout(this.obj + ".glideTo(" + x + "," + y + "," + speed + ");", 5);
		}
		else {
			//end the movement in the exact correct location
			clearTimeout(this.timeout);
			this.timeout = null;
			//move to the exact location
			this.moveTo(x,y);
			//set the exact coords
			this.xExact = x;
			this.yExact = y;
		}
	}
	
	//hide this layer
	this.hide = function hide() {
		if(browser == "dom") {
			this.layer.style.visibility = "hidden";
		}
		else if(browser == "n4") {
			this.layer.visibility = "hidden";
		}
		this.visibility = false;
	}
	
	//show the layer
	this.show = function show() {
		if(browser == "dom") {
			this.layer.style.visibility = "visible";
		}
		else if(browser == "n4") {
			this.layer.visibility = "visible";
		}
		this.visibility = true;
	}
	
	this.update();
}