/******************************************************************* 
* 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	= 5000;

	//this.animateIn	= this.animateIn_StartScrollUp;
	this.animateIn	= this.animateIn_StartFadeUp;
	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.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;
}
