/*******************************************************************
*
* File    : JSFX_MBs.js © JavaScript-FX.com
*
* Created : 2001/10/16
*
* Author  : Roy Whittle www.Roy.Whittle.com
*           
* Purpose : To create animated Ghosts on the page using any user 
*		supplied image.
*
* History
* Date         Version        Description
*
* 2001-10-16	1.0		Created for javascript-fx
***********************************************************************/
/*** START OF CODE FROM JSFX_Layer.js ***/
if(!window.JSFX)
	JSFX=new Object();
JSFX.layerNo=0; 
/**********************************************************************************/
JSFX.createElem = function(htmlStr)
{
	var elem = null;

 	if(document.layers) 
	{
		elem=new Layer(2000); 
		elem.document.open(); 
		elem.document.write(htmlStr); 
		elem.document.close(); 
		elem.innerHTML = htmlStr;
	}
	else 
	if(document.all) 
	{
		var xName = "xLayer" + JSFX.layerNo++; 
		var txt = "<DIV ID='" + xName 
			+ "' STYLE=\"position:absolute;" 
			+ "visibility:hidden\">" 
			+ htmlStr 
			+ "</DIV>"; 

			document.body.insertAdjacentHTML("BeforeEnd",txt); 

		elem = document.all[xName]; 
	} 
	else 
	if (document.getElementById)
	{
		var xName="xLayer" + JSFX.layerNo++;
		var txt = ""
			+ "position:absolute;"
			+ "visibility:hidden";

		var newRange = document.createRange();

		elem = document.createElement("DIV");
		elem.setAttribute("style",txt);
		elem.setAttribute("id", xName);

		document.body.appendChild(elem);

		newRange.setStartBefore(elem);
		strFrag = newRange.createContextualFragment(htmlStr);	
		elem.appendChild(strFrag);
	}

	return elem;
}
/**********************************************************************************/
JSFX.Layer = function(newLayer) 
{
	if(!newLayer)
		return;

	if(typeof newLayer == "string")
		this.elem = JSFX.createElem(newLayer);
	else
		this.elem=newLayer;

	if(document.layers)
	{
		this.images=this.elem.document.images; 
		this.style = this.elem;
 	} 
	else 
	{
		this.images  = document.images; 
		this.style   = this.elem.style; 
	} 
} 
/**********************************************************************************/
var ns4 = (navigator.appName.indexOf("Netscape") != -1 && !document.getElementById);

/**********************************************************************************/
/*** moveTo (x,y) ***/
JSFX.Layer.prototype.moveTo = function(x,y)
{
	this.style.left = x+"px";
	this.style.top = y+"px";
}
if(ns4)
	JSFX.Layer.prototype.moveTo = function(x,y) { this.elem.moveTo(x,y); }
/**********************************************************************************/
/*** show()/hide() Visibility ***/
JSFX.Layer.prototype.show		= function() 	{ this.style.visibility = "visible"; } 
JSFX.Layer.prototype.hide		= function() 	{ this.style.visibility = "hidden"; } 
if(ns4)
{
	JSFX.Layer.prototype.show		= function() 	{ this.style.visibility = "show"; }
	JSFX.Layer.prototype.hide 		= function() 	{ this.style.visibility = "hide"; }
}
/**********************************************************************************/
/*** Opacity ***/
if(document.all)
{
	JSFX.Layer.prototype.setOpacity = function(pc)
	{
		if(this.style.filter=="")
			this.style.filter="alpha(opacity=100);";
		this.elem.filters.alpha.opacity=pc;
	}
}
else
	JSFX.Layer.prototype.setOpacity = function(pc) {return 0;}
/******* END OF CODE FROM JSFX.Layer.js ***/
/*** START OF CODE FROM JSFX.Browser.js ***/
JSFX.Browser = new Object();

if(navigator.appName.indexOf("Netscape") != -1)
{
	JSFX.Browser.getCanvasWidth	= function() {return innerWidth;}
	JSFX.Browser.getCanvasHeight	= function() {return innerHeight;}
	JSFX.Browser.getMinX		= function() {return(pageXOffset);}
	JSFX.Browser.getMinY		= function() {return(pageYOffset);}
	JSFX.Browser.getMaxX		= function() {return(pageXOffset+innerWidth);}
	JSFX.Browser.getMaxY		= function() {return(pageYOffset+innerHeight);}
}
else 	if(document.all)
{
	JSFX.Browser.getCanvasWidth	= function() {return document.body.clientWidth;}
	JSFX.Browser.getCanvasHeight	= function() {return document.body.clientHeight;}
	JSFX.Browser.getMinX		= function() {return(document.body.scrollLeft);}
	JSFX.Browser.getMinY		= function() {return(document.body.scrollTop);}
	JSFX.Browser.getMaxX		= function() {
		return(document.body.scrollLeft
			+document.body.clientWidth);
	}
	JSFX.Browser.getMaxY		= function() {
			return(document.body.scrollTop
				+document.body.clientHeight);
	}
} 
/*** END OF CODE FROM JSFX.Browser.js ***/
/*** START OF CODE FROM JSFX.Ghosts.js ***/

JSFX.MBs = new Object();
JSFX.MBs.Clasps = new Array();
JSFX.MBs.start = function()
{
	if(JSFX.MBs.theTimer == null)
	{
		JSFX.MBs.theTimer = setTimeout("JSFX.MBs.animateAll()", 40);
	}
}
JSFX.MBs.animateAll = function()
{
	JSFX.MBs.theTimer = setTimeout("JSFX.MBs.animateAll()", 40);
	var sp = JSFX.MBs.Clasps;
	var i;
	for(i=0 ; i<sp.length ; i++)
	{
		sp[i].animate();
	}

}
JSFX.AddClasp = function(img,initial_x,initial_y,idx,idy,delay)
{
	var myClasp = null;
	var htmlStr = "<IMG SRC='"+img+"'>";

	myClasp = new JSFX.Layer(htmlStr);
	myClasp.op = 90;
	myClasp.ix = initial_x;
	myClasp.iy = initial_y;
	myClasp.x = initial_x;
	myClasp.y = initial_y;
	myClasp.dx = idx;
	myClasp.dy = idy;
	myClasp.w = 120;
	myClasp.h = 80;
	myClasp.wait = delay;
	myClasp.targetX = 387;
	myClasp.targetY = 180;
	myClasp.state = "off";
	myClasp.animate = JSFX.animateClasps;
	myClasp.setOpacity(this.op);
	myClasp.show();
	myClasp.moveTo(myClasp.x,myClasp.y);
	JSFX.MBs.Clasps[JSFX.MBs.Clasps.length] = myClasp;
	JSFX.MBs.start();
}
JSFX.animateClasps = function()
{
	if (this.wait == 0)
	{
		if(this.state == "off")
		{
			this.state="up";
			this.op=90;
			this.show();
		}
		else if(this.state == "up")
		{
			if(this.op ==100)
			this.wait=1;
			else
			{
			this.op += 2;
			this.setOpacity(this.op);
			}
		}
		else if(this.state == "down")
		{
			if (this.op == 90)
			this.wait=1;
			else
			{
			this.op -= 2;
			this.setOpacity(this.op)
			}
		}

		m = this;
		var X = (this.targetX - m.x);
		var Y = (this.targetY - m.y);
	
		if(X == 0)
		{
			if (Y == 0)
			{
				this.wait = 50;
				this.dx = -this.dx;
				this.dy = -this.dy;
				this.state = "down";
			}
		}
	
		m.x += this.dx;
		m.y += this.dy;
		m.moveTo(m.x, m.y);

		if (m.x == m.ix)
		{
			if (m.y == m.iy)
			{
				this.wait = 400;
				this.state = "off";
				this.dx = -this.dx;
				this.dy = -this.dy;
			}
		}	
	}
	else this.wait -= 1;	
}
