/* See below for jsfx vertical scroll object */
/******************************************************************* 
* File    : JSFX_Layer.js  © JavaScript-FX.com
* Created : 2001/04/11 
* Author  : Roy Whittle  (Roy@Whittle.com) www.Roy.Whittle.com 
* Purpose : To create a cross browser dynamic layers.
* History 
* Date         Version        Description 
* 2001-03-17	3.0		Completely re-witten for use by javascript-fx
* 2001-09-08	3.1		Added the ability for child layers
* 2001-09-23	3.2		Save a reference so we can use a self referencing timer
* 2001-09-28	3.3		Add a width for Netscape 4.x
* 2001-09-28	3.4		Remove width for Netscape 4.x create layer (Not needed)
* 2002-01-21	3.5		Declare only one instance of variables in createLayer
* 2002-06-12	3.6		Correct a major bug in JSFX.findLayer (Basically the same bug as
*					in JSFX.findImg - must brush up on recursion)
***********************************************************************/ 
var ns4 = (navigator.appName.indexOf("Netscape") != -1 && !document.getElementById);

if(!window.JSFX)
	JSFX=new Object();

JSFX.layerNo=0; 
/**********************************************************************************/
JSFX.createLayer = function(htmlStr, parent)
{
	//Declare all variables first
	var elem = null;
	var xName;
	var txt;

 	if(document.layers) 
	{
		xName="xLayer" + JSFX.layerNo++;
		if(parent == null)
			elem=new Layer(2000);
		else
			elem=new Layer(2000, parent.elem);
 
		elem.document.open(); 
		elem.document.write(htmlStr); 
		elem.document.close(); 
		elem.moveTo(0,0);
		elem.innerHTML = htmlStr;
	}
	else 
	if(document.all) 
	{
		if(parent == null)
			parent=document.body;
		else
			parent=parent.elem;

		xName = "xLayer" + JSFX.layerNo++; 
		txt = '<DIV ID="' + xName + '"'
			+ ' STYLE="position:absolute;left:0;top:0;visibility:hidden">' 
			+ htmlStr 
			+ '</DIV>'; 

			parent.insertAdjacentHTML("BeforeEnd",txt); 

		elem = document.all[xName]; 
	} 
	else 
	if (document.getElementById)
	{
		if(parent == null)
			parent=document.body;
		else
			parent=parent.elem;

		xName="xLayer" + JSFX.layerNo++;
		txt = ""
			+ "position:absolute;left:0px;top:0px;visibility:hidden";

		var newRange = document.createRange();

		elem = document.createElement("DIV");
		elem.setAttribute("style",txt);
		elem.setAttribute("id", xName);

		parent.appendChild(elem);

		newRange.setStartBefore(elem);
		strFrag = newRange.createContextualFragment(htmlStr);	
		elem.appendChild(strFrag);
	}

	return elem;
}
/**********************************************************************************/
JSFX.Layer = function(newLayer, parent) 
{
	if(!newLayer)
		return;

	if(typeof newLayer == "string")
		this.elem = JSFX.createLayer(newLayer, parent);
	else
		this.elem=newLayer;

	if(document.layers)
	{
		this.images		= this.elem.document.images; 
		this.parent		= parent;
		this.style		= this.elem;
		if(parent != null)
			this.style.visibility = "inherit";
 	} 
	else 
	{
		this.images  = document.images; 
		this.parent	 = parent;
		this.style   = this.elem.style; 
	} 
	window[this.elem.id]=this;	//save a reference to this
} 
/**********************************************************************************/
JSFX.getLayer = function(theDiv, d)
{
	var theLayer = d.layers[theDiv];
	for(var i=0 ; i<d.layers.length && theLayer==null ; i++)
		theLayer = JSFX.getLayer(theDiv, d.layers[i].document);

	return theLayer;
}
JSFX.findLayer = function(theDiv, d)
{
	if(document.layers)
		return(JSFX.getLayer(theDiv, document));
	else 
	if(document.all)
		return(document.all[theDiv]);
	else 
	if(document.getElementById)
		return(document.getElementById(theDiv));
	else
		return("Undefined.....");
}

/**********************************************************************************/
/*** 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"; } 
JSFX.Layer.prototype.isVisible	= function()	{ return this.style.visibility == "visible"; } 
if(ns4)
{
	JSFX.Layer.prototype.show		= function() 	{ this.style.visibility = "show"; }
	JSFX.Layer.prototype.hide 		= function() 	{ this.style.visibility = "hide"; }
	JSFX.Layer.prototype.isVisible 	= function() 	{ return this.style.visibility == "show"; }
}
/**********************************************************************************/
/*** zIndex ***/
JSFX.Layer.prototype.setzIndex	= function(z)	{ this.style.zIndex = z; } 
JSFX.Layer.prototype.getzIndex	= function()	{ return this.style.zIndex; }
/**********************************************************************************/
/*** ForeGround (text) Color ***/
JSFX.Layer.prototype.setColor	= function(c){this.style.color=c;}
if(ns4)
	JSFX.Layer.prototype.setColor	= function(c)
	{
		this.elem.document.write("<FONT COLOR='"+c+"'>"+this.elem.innerHTML+"</FONT>");
		this.elem.document.close();
	}
/**********************************************************************************/
/*** BackGround Color ***/
JSFX.Layer.prototype.setBgColor	= function(color) { this.style.backgroundColor = color==null?'transparent':color; } 
if(ns4)
	JSFX.Layer.prototype.setBgColor 	= function(color) { this.elem.bgColor = color; }
/**********************************************************************************/
/*** BackGround Image ***/
JSFX.Layer.prototype.setBgImage	= function(image) { this.style.backgroundImage = "url("+image+")"; }
if(ns4)
	JSFX.Layer.prototype.setBgImage 	= function(image) { this.style.background.src = image; }
/**********************************************************************************/
/*** set Content***/
JSFX.Layer.prototype.setContent   = function(xHtml)	{ this.elem.innerHTML=xHtml; } 
if(ns4)
	JSFX.Layer.prototype.setContent   = function(xHtml)
	{
		this.elem.document.write(xHtml);
		this.elem.document.close();
		this.elem.innerHTML = xHtml;
	}

/**********************************************************************************/
/*** Clipping ***/
JSFX.Layer.prototype.clip = function(x1,y1, x2,y2){ this.style.clip="rect("+y1+" "+x2+" "+y2+" "+x1+")"; }
if(ns4)
	JSFX.Layer.prototype.clip = function(x1,y1, x2,y2)
	{
		this.style.clip.top	=y1;
		this.style.clip.left	=x1;
		this.style.clip.bottom	=y2;
		this.style.clip.right	=x2;
	}
/**********************************************************************************/
/*** Resize ***/
JSFX.Layer.prototype.resizeTo = function(w,h)
{ 
	this.style.width	=w + "px";
	this.style.height	=h + "px";
}
if(ns4)
	JSFX.Layer.prototype.resizeTo = function(w,h)
	{
		this.style.clip.width	=w;
		this.style.clip.height	=h;
	}
/**********************************************************************************/
/*** getX/Y ***/
JSFX.Layer.prototype.getX	= function() 	{ return parseInt(this.style.left); }
JSFX.Layer.prototype.getY	= function() 	{ return parseInt(this.style.top); }
if(ns4)
{
	JSFX.Layer.prototype.getX	= function() 	{ return this.style.left; }
	JSFX.Layer.prototype.getY	= function() 	{ return this.style.top; }
}
/**********************************************************************************/
/*** getWidth/Height ***/
JSFX.Layer.prototype.getWidth		= function() 	{ return this.elem.offsetWidth; }
JSFX.Layer.prototype.getHeight	= function() 	{ return this.elem.offsetHeight; }
if(!document.getElementById)
	JSFX.Layer.prototype.getWidth		= function()
 	{ 
		//Extra processing here for clip
		return this.elem.scrollWidth;
	}

if(ns4)
{
	JSFX.Layer.prototype.getWidth		= function() 	{ return this.style.clip.right; }
	JSFX.Layer.prototype.getHeight	= function() 	{ return this.style.clip.bottom; }
}
/**********************************************************************************/
/*** Opacity ***/
if(ns4)
{
	JSFX.Layer.prototype.setOpacity = function(pc) {return 0;}
}
else 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
{
/*** Assume NS6 ***/
	JSFX.Layer.prototype.setOpacity = function(pc){	this.style.MozOpacity=pc+'%' }
}
/**************************************************************************/
/*** Event Handling - Start ***/
/*** NS4 ***/
if(ns4)
{
	JSFX.eventmasks = {
	      onabort:Event.ABORT, onblur:Event.BLUR, onchange:Event.CHANGE,
	      onclick:Event.CLICK, ondblclick:Event.DBLCLICK, 
	      ondragdrop:Event.DRAGDROP, onerror:Event.ERROR, 
	      onfocus:Event.FOCUS, onkeydown:Event.KEYDOWN,
	      onkeypress:Event.KEYPRESS, onkeyup:Event.KEYUP, onload:Event.LOAD,
	      onmousedown:Event.MOUSEDOWN, onmousemove:Event.MOUSEMOVE, 
	      onmouseout:Event.MOUSEOUT, onmouseover:Event.MOUSEOVER, 
	      onmouseup:Event.MOUSEUP, onmove:Event.MOVE, onreset:Event.RESET,
	      onresize:Event.RESIZE, onselect:Event.SELECT, onsubmit:Event.SUBMIT,
	      onunload:Event.UNLOAD
	};
	JSFX.Layer.prototype.addEventHandler = function(eventname, handler) 
	{
          this.elem.captureEvents(JSFX.eventmasks[eventname]);
          var xl = this;
      	this.elem[eventname] = function(event) { 
		event.clientX	= event.pageX;
		event.clientY	= event.pageY;
		event.button	= event.which;
		event.keyCode	= event.which;
		event.altKey	=((event.modifiers & Event.ALT_MASK) != 0);
		event.ctrlKey	=((event.modifiers & Event.CONTROL_MASK) != 0);
		event.shiftKey	=((event.modifiers & Event.SHIFT_MASK) != 0);
            return handler(xl, event);
        }
	}
	JSFX.Layer.prototype.removeEventHandler = function(eventName) 
	{
		this.elem.releaseEvents(JSFX.eventmasks[eventName]);
		this.elem[eventName] = null;
	}
}
/**************************************************************************/
/** IE 4/5+***/
else
if(document.all)
{
	JSFX.Layer.prototype.addEventHandler = function(eventName, handler) 
	{
		var xl = this;
		this.elem[eventName] = function() 
		{ 
	            var e = window.event;
	            e.cancelBubble = true;
			if(document.getElementById)
			{
				e.layerX = e.offsetX;
				e.layerY = e.offsetY;
			}
			else
			{
				/*** Work around for IE 4 : clone window.event ***/
				ev = new Object();
				for(i in e)
					ev[i] = e[i];
				ev.layerX	= e.offsetX;
				ev.layerY	= e.offsetY;
				e = ev;
			}

	            return handler(xl, e); 
		}
	}
	JSFX.Layer.prototype.removeEventHandler = function(eventName) 
	{
		this.elem[eventName] = null;
	}
}
/**************************************************************************/
/*** Assume NS6 ***/
else
{
	JSFX.Layer.prototype.addEventHandler = function(eventName, handler) 
	{
		var xl = this;
		this.elem[eventName] = function(e) 
		{ 
	            e.cancelBubble = true;
	            return handler(xl, e);
		}
	}
	JSFX.Layer.prototype.removeEventHandler = function(eventName) 
	{
		this.elem[eventName] = null;
	}
}
/*** Event Handling - End ***/
/**************************************************************************/
JSFX.Layer.prototype.setTimeout = function(f, t) 
{
	setTimeout("window."+this.elem.id+"."+f, t);
}


/******************************************************************* 
* File    : JSFX_VerticalScroller.js  © JavaScript-FX.com
* Created : 2001/09/28 
* Author  : Roy Whittle  (Roy@Whittle.com) www.Roy.Whittle.com 
* Purpose : To create a cross browser news scroller
* History 
* Date         Version        Description 
* 2001-09-28	1.0		I have seen hundreds of news scrollers so I thought
*					I would try and write one that  was easy to install.
* 2002-04-04	1.1		Combined the Vertical Svroller and Div scroller code into
*					one complete script. Plus added new "in" and "out"
*					transitions for the news text.
***********************************************************************/ 
/*************************************************************************************/ 
/*** First, extend JSFX.Layer for extra functionality ***/
/*** NOTE: If these ever need to be used in others scripts - move to JSFX_Layer.js ***/
JSFX.Layer.prototype.getPageX		= function(el) 	
{ 
	if(el == null) 
		el = this.elem;
	return el.offsetLeft + (el.offsetParent ? this.getPageX(el.offsetParent) : 0);
}
JSFX.Layer.prototype.getPageY		= function(el) 	
{ 
	if(el == null) 
		el = this.elem;
	return el.offsetTop + (el.offsetParent ? this.getPageY(el.offsetParent) : 0);
}
if(ns4)
{
	JSFX.Layer.prototype.getPageX 	= function() 	{ return this.elem.pageX; }
	JSFX.Layer.prototype.getPageY 	= function() 	{ return this.elem.pageY; }
}
/*************************************************************************************/ 
/*******************************************************************
*
* Function    : VerticalScroller (Constructor)
*
* returns	  : a newly constructed News Scroller object
*
* Description : Constructs and initialises a VerticalScroller object.
*			You can use addMessage() or addDiv BUT NOT BOTH
*
*****************************************************************/
JSFX.VerticalScroller = function()
{
	this.isMessageScroller=true;
	this.sx 		= 0;
	this.sy 		= 0;
	this.w 		= 100;
	this.h 		= 100;
	this.op		= 0;
	this.outerLayer 	= null;
	this.scrollLayer 	= null;
	this.bgColor 	= null;
	this.bgImage	= null;
	this.theStyleStr  = null;
	this.messages 	= new Array();
	this.currMessage 	= -1;
	this.step 		= 2;
	this.id 		= "JSFXScroll" + JSFX.VerticalScroller.no++;
	this.holder 	= this.id + "_h";
	this.content 	= this.id + "_c";
	this.showTime	= 1000;

	this.animateIn	= this.animateIn_StartScrollUp;
	this.animateOut	= this.animateOut_FadeDown;
	this.animate 	= this.animateIn;

	window[this.id]	= this;
}
JSFX.VerticalScroller.no = 0;
JSFX.VerticalScroller.prototype.setAnimation = function(inAni, outAni)
{
	if(inAni == 0)
		this.animateIn	= this.animateIn_StartScrollUp;
	else if (inAni == 1)
		this.animateIn	= this.animateIn_StartScrollDown;
	else
		this.animateIn	= this.animateIn_StartFadeUp;
	
	if(outAni == 0)
		this.animateOut	= this.animateOut_ScrollUp;
	else if (outAni == 1)
		this.animateOut	= this.animateOut_ScrollDown;
	else
		this.animateOut	= this.animateOut_FadeDown;

	this.animate 	= this.animateIn;
}

JSFX.VerticalScroller.prototype.toHtml2 = function(width, height, leftoffset, rightoffset, topoffset, bottomoffset, spacerimg, backgroundimg)
{
	this.w = width - (leftoffset + rightoffset);
	this.h = height - (topoffset + bottomoffset);
	var str = "";
	if(ns4)
	{
		str =    '<ILAYER WIDTH="'+width+'" HEIGHT="'+height+'" NAME="'+this.holder+'">'
			+  '<LAYER  WIDTH="'+width+'" HEIGHT="'+height+'" NAME="'+this.content+'">'
			+  '</LAYER></ILAYER>';
	}
	else
	{
		str =	'<table border=0 width='+width+' height='+height+' cellpadding=0 cellspacing=0 background="'+backgroundimg+'">'
			+	'<tr><td height='+topoffset+' colspan=3><img src="'+spacerimg+'"></td></tr>'
			+	'<tr><td width='+leftoffset+'><img src="'+spacerimg+'" hspace="'+Math.floor(leftoffset/2)+'"></td>'
			+	'<td>'
			+	'<div style="overflow:hidden;   width:'+this.w+';height:'+this.h+';" id="'+this.holder+'">'
			+	'<div style="position:relative; width:'+this.w+';height:'+this.h+'; filter:alpha(opacity=0); -moz-opacity:0%;" id="'+this.content+'">'
			+	'</div></div>'
			+	'</td><td width='+rightoffset+'><img src="'+spacerimg+'" hspace="'+Math.floor(rightoffset/2)+'"></td></tr>'
			+	'<tr><td height='+bottomoffset+' colspan=3><img src="'+spacerimg+'"></td></tr>'
			+	'</table>';
	}

	return str;
}
JSFX.VerticalScroller.prototype.toHtml = function(width, height)
{
	this.w = width;
	this.h = height;
	var str = "";
	if(ns4)
	{
		str =    '<ILAYER WIDTH="'+width+'" HEIGHT="'+height+'" NAME="'+this.holder+'">'
			+  '<LAYER  WIDTH="'+width+'" HEIGHT="'+height+'" NAME="'+this.content+'">'
			+  '</LAYER></ILAYER>';
	}
	else
	{
		str =   '<div style="overflow:hidden;   width:'+width+';height:'+height+';" id="'+this.holder+'">'
			+ '<div style="position:relative; width:'+width+';height:'+height+'; filter:alpha(opacity=0); -moz-opacity:0%;" id="'+this.content+'">'
			+ '</div></div>';
	}

	return str;
}
JSFX.VerticalScroller.prototype.setShowTime = function(theInterval)
{
	this.showTime = theInterval * 1000;
}
JSFX.VerticalScroller.prototype.setBgColor = function(color)
{
	this.bgColor = color;
	if(this.outerLayer != null)
		this.outerLayer.setBgColor(color);
}
JSFX.VerticalScroller.prototype.setBgImage = function(theImage)
{
	this.bgImage = theImage;
	if(this.outerLayer != null)
		this.outerLayer.setBgImage(theImage);
}
JSFX.VerticalScroller.prototype.setStyle = function(theStyleStr)
{
	this.styleStr = theStyleStr;
}
JSFX.VerticalScroller.prototype.addMessage = function(message)
{
	if(!this.isMessageScroller)
	{
		alert("Cannot add messages to a 'Div Scroller'");
		return;
	}
	this.messages[this.messages.length] = message;
}
JSFX.VerticalScroller.prototype.addDiv = function(message)
{
	if(this.isMessageScroller && this.messages.length >0)
	{
		alert("Cannot add Divs to a 'Message Scroller'");
		return;
	}
	this.isMessageScroller = false;
	this.messages[this.messages.length] = message;
}
JSFX.VerticalScroller.prototype.start = function()
{
	//Initialise the DIV/Layer if not already done so
	if(this.scrollLayer == null)
	{
		this.outerLayer  = new JSFX.Layer(JSFX.findLayer(this.holder));
		this.scrollLayer = new JSFX.Layer(JSFX.findLayer(this.content));
		if(this.bgImage != null)
			this.outerLayer.setBgImage(this.bgImage);
		else if(this.bgColor != null)
			this.outerLayer.setBgColor(this.bgColor);
	}
	this.animate();
}
JSFX.VerticalScroller.prototype.moveContent = function(x, y)
{
	var px=0;
	var py=0;
	if(! this.isMessageScroller)
	{
		px=this.outerLayer.getPageX();
		py=this.outerLayer.getPageY();
	}

	this.scrollLayer.moveTo(px + x, py + y);
	if(! this.isMessageScroller)
	{
		if(this.sy > 0)
			this.scrollLayer.clip(0,0,this.w, this.h - this.sy);
		else
			this.scrollLayer.clip(0, -this.sy,this.w, this.h);
	}


}
JSFX.VerticalScroller.prototype.setNextMessage = function(x, y, o)
{
	this.currMessage = (this.currMessage + 1) % this.messages.length;

	this.sx=x;
	this.sy=y;
	this.op=o;

	this.scrollLayer.hide();
	if(this.isMessageScroller)
	{
		var str = "";

		if(this.styleStr != null)
			str += '<span style="'+this.styleStr+'">';

		str += this.messages[this.currMessage];

		if(this.styleStr != null)
			str += '</span>';

		this.scrollLayer.setContent(str);
	}
	else
	{
		this.scrollLayer = new JSFX.Layer(JSFX.findLayer(this.messages[this.currMessage]));
	}
	this.moveContent(this.sx, this.sy);
	this.scrollLayer.setOpacity(this.op);
	this.scrollLayer.show();
}

JSFX.VerticalScroller.prototype.animateIn_StartScrollUp = function()
{
	this.setNextMessage(0, this.h, 100);
	this.animate = this.animateIn_ScrollUp
	this.setTimeout("animate()", 40);
}

JSFX.VerticalScroller.prototype.animateIn_ScrollUp = function()
{
	this.sy -= this.step;
	this.moveContent(this.sx, this.sy);
	if(this.sy <= 0)
	{
		this.animate=this.animateOut;
		this.setTimeout("animate()", this.showTime);
	}
	else
		this.setTimeout("animate()", 40);
}
JSFX.VerticalScroller.prototype.animateIn_StartScrollDown = function()
{
	this.setNextMessage(0, -this.h, 100);
	this.animate = this.animateIn_ScrollDown
	this.setTimeout("animate()", 40);
}
JSFX.VerticalScroller.prototype.animateIn_ScrollDown = function()
{
	this.sy += this.step;
	this.moveContent(this.sx, this.sy);
	if(this.sy >= 0)
	{
		this.animate=this.animateOut;
		this.setTimeout("animate()", this.showTime);
	}
	else
		this.setTimeout("animate()", 40);
}

JSFX.VerticalScroller.prototype.animateIn_StartFadeUp = function()
{
	this.setNextMessage(0, 0, 0);
	this.animate = this.animateIn_FadeUp
	this.setTimeout("animate()", 40);
}
JSFX.VerticalScroller.prototype.animateIn_FadeUp = function()
{
	this.op += 10;
	this.scrollLayer.setOpacity(this.op);
	if(this.op == 100)
	{
		this.animate = this.animateOut;
		this.setTimeout("animate()", this.showTime);
	}
	else
		this.setTimeout("animate()", 40);
}
JSFX.VerticalScroller.prototype.animateOut_ScrollUp = function()
{
	this.sy -= this.step;
	this.moveContent(this.sx, this.sy);

	if(this.sy <= -this.h)
		this.animate=this.animateIn;

	this.setTimeout("animate()", 40);
}

JSFX.VerticalScroller.prototype.animateOut_ScrollDown = function()
{
	this.sy += this.step;
	this.moveContent(this.sx, this.sy);

	if(this.sy >= this.h)
		this.animate=this.animateIn;

	this.setTimeout("animate()", 40);
}

JSFX.VerticalScroller.prototype.animateOut_FadeDown = function()
{
	this.op -= 10;
	this.scrollLayer.setOpacity(this.op);
	this.moveContent(this.sx, this.sy);

	if(this.op == 0)
		this.animate = this.animateIn;

	this.setTimeout("animate()", 40);
}

JSFX.VerticalScroller.prototype.setTimeout = function(f, t) 
{
	setTimeout("window."+this.id+"."+f, t);
}

/*** If no other script has added it yet, add the ns resize fix ***/
if(navigator.appName.indexOf("Netscape") != -1 && !document.getElementById)
{
	if(!JSFX.ns_resize)
	{
		JSFX.ow = outerWidth;
		JSFX.oh = outerHeight;
		JSFX.ns_resize = function()
		{
			if(outerWidth != JSFX.ow || outerHeight != JSFX.oh )
				location.reload();
		}
	}
	window.onresize=JSFX.ns_resize;
}

