/*
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
* JsListNewsTicker 2.1
* Tickerize Unordered List-Items
* Dirk Ginader
* www.ginader.de
* dirk@ginader.de
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
* degrades nicely, unbobtrusive
* testet in:
* Windows
* * Firefox 1.5
* * IE 7 Beta 2
* * IE 6
* * IE 5.5
* * IE 5.01
* * Opera 8.02
* MAC OS X
* * Firefox 1.5
* * Firefox 2 Beta
* * Safari 2.03
* * IE 5.02 MAC 
* Linux (Ubuntu)
* * Firefox 1.07
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
* USAGE in the Head of an HTML-Page: 
<script language="JavaScript" type="text/javascript" src="js/listNewsTicker.js"></script>
<script language="JavaScript" type="text/javascript">
window.onload = function(){	
	newsTicker = new JsListNewsTicker('tickerh','newsTicker',5,true,'tick');
	newsTicker2 = new JsListNewsTicker('ticker','newsTicker2',3000,true,'blend');
}
</script>
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
* License:
* This file is entirely BSD licensed.

* Info:
* Include The listNewsTicker.js into the Head of you Document

* Create as many Instances of the Ticker as you want by doing the following:
* * To create a horizontal Ticker
* * newsTicker = new JsListNewsTicker('tickerh','newsTicker',5,true,'tick');
* * To create a rotating Ticker
* * newsTicker2 = new JsListNewsTicker('ticker','newsTicker2',3000,true,'blend');
* * * The 1st Parameter (String) is the Id of the Wrapping Element around the List
* * * The 2nd Parameter (String) is the Name of the Instance (needed for the Object to reference to itself)
* * * The 3rd Parameter (Integer) is the Time of the Interval the Ticker should react (in Miliseconds).
     				    Of course you want a horizontal Ticker to be triggered faster than a rotating Ticker
* * * The 4th Parameter (Boolean) defines if the Ticker should stop if the Mouse hovers over (true or false)
* * * The 5th Parameter (String) defines the Mode the Ticker should run in ("tick", "blend" or "lettertick")
						Tick creates a horizontal Ticker, while Blend rotates the Elements of the List by showing only ony at the time
						
* The Script attaches the CSS-Class "tickerAttached" to the wrapping Element after the behavoris are attached successful, so
  you can style the 2 States of the Ticker (With JavaScript and Without) totally different if you want to

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
* Changelog:
* * 2.1 Added the new Tickermode lettertick
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
* More information:
* http://blog.ginader.de/dev/JsListNewsTicker/JsListNewsTicker_2.1/index.php
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
*/
JsListNewsTicker = function(tickerDivID,objName,interval,pauseOnOver,mode){
	if(document.getElementById){
		this.tickerDivID = document.getElementById(tickerDivID);
		this.objName = objName;
		this.interval = interval;
		this.init();
		if(pauseOnOver){
			this.attachPauseOnOver();
		}
		this[mode]();
	}
}
o = JsListNewsTicker.prototype;
o.init = function(){
	this.tickerItems = this.tickerDivID.getElementsByTagName("li");
	this.allowTick = true;
	this.tickCount=0;
	this.tickerDivID.className = 'tickerAttached';
}
o.attachPauseOnOver = function(){
	this.tickerDivID.obj = this;
	this.tickerDivID.onmouseover=function() {
		this.obj.MouseOver();
    }
	this.tickerDivID.onmouseout=function() {
		this.obj.MouseOut();        
	}
}
o.MouseOver = function(){
	this.allowTick = false;
}
o.MouseOut = function(){
	this.allowTick = true;
}
o.showNextLetter = function(){	
	if(!this.allowTick){
		this.activeLetter = this.activeText.length+1;
	}
	this.tickerItems[this.tickCount].innerHTML = this.activeText.substring(0,this.activeLetter)+"|";
	this.activeLetter++;
	if(this.activeLetter > this.activeText.length){
		this.tickerItems[this.tickCount].innerHTML = this.activeText.substring(0,this.activeLetter);
		this.tickCount++;
		if(this.tickCount>=this.tickerItems.length){
			this.tickCount=0;
		}
		window.setTimeout(""+this.objName+".lettertick()",this.interval);
		return;
	}
	window.setTimeout(""+this.objName+".showNextLetter()",100);
}
o.lettertick = function(){
	if(this.allowTick){
		this.showOnlyItem(this.tickCount);
		this.activeText = this.tickerItems[this.tickCount].innerHTML;
		this.activeLetter = 0;
		this.showNextLetter();
	}else{
		window.setTimeout(""+this.objName+".lettertick()",1000);		
	}
}
o.blend = function(){
		if(this.allowTick){
			if(document.all){
				if(this.tickerDivID.filters && this.tickerDivID.filters.revealTrans){
					this.tickerDivID.filters.revealTrans.Apply();
				}
			}
			this.showOnlyItem(this.tickCount);
			if(document.all){
				if(this.tickerDivID.filters && this.tickerDivID.filters.revealTrans){
					this.tickerDivID.filters.revealTrans.play();
				}
			}
			this.tickCount++;
			if(this.tickCount>=this.tickerItems.length){
				this.tickCount=0;
			}
		}
		window.setTimeout(""+this.objName+".blend()",this.interval);
}
o.setUpTickerElements = function(){
	for(var i=0;i<this.tickerItems.length;i++){
		while(this.getItemHeight(this.tickerItems[i])>30){
			this.enlargeItemWidth(this.tickerItems[i]);
		}
	}
	var newContainerWidth = 0;
	for(var i=0;i<this.tickerItems.length;i++){
		newContainerWidth+=this.getItemWidth(this.tickerItems[i])+15;
	}
	this.tickerListWidth = newContainerWidth;
	this.tickerListPosition = 0;
	this.tickerList = this.tickerItems[0].parentNode;
	this.tickerList.style.width=this.tickerListWidth*2;
	this.tickerList.innerHTML = this.tickerItems[0].parentNode.innerHTML+this.tickerItems[0].parentNode.innerHTML;
	this.tickerElementsSetUp = true;
}
o.tick = function(){
	if(!this.tickerElementsSetUp){
		this.setUpTickerElements();
	}
		if(this.allowTick){
			this.tickerListPosition = this.tickerListPosition-2;
			if(this.tickerListPosition<(this.tickerListWidth*-1)){
				this.tickerListPosition = 0;
			}
			this.tickerList.style.marginLeft = this.tickerListPosition;
		}
		window.setTimeout(""+this.objName+".tick()",this.interval);
}
o.getItemHeight = function(tickerItem){
	return tickerItem.offsetHeight;
}
o.getItemWidth = function(tickerItem){
	return tickerItem.offsetWidth;
}
o.enlargeItemWidth = function(tickerItem){
	tickerItem.style.width = tickerItem.offsetWidth+5;
	return tickerItem.offsetWidth;
}
o.showOnlyItem = function(tickerItem){
	this.hideAllItems();
	this.showItem(this.tickerItems[tickerItem]);
}
o.showItem = function(tickerItem){
	tickerItem.style.display = "list-item";
}
o.hideItem = function(tickerItem){
	tickerItem.style.display = "none";
}
o.hideAllItems = function(){
	for(var i=0;i<this.tickerItems.length;i++){
		this.hideItem(this.tickerItems[i]);
	}
}