/*
	scrollingFunctions: various scrolling functions
	version 1.0 written by: Andy Faraclas @2008


	copy and paste the following code to configure and activate scroller

	var obj = {
		id:"bar1",
		width:150,
		height:130,
		mode:1,
		limit:false,
		dir:'r',		
		speed:5,
		interval:15000,
		layers:layers // set you value here 
	};

	// @initScroller: activates scroller
	scrollingFunctions.initScroller(obj);



/////
	params: obj
		@id: the main panel holding the layers
		@width: width of main panel and layers
		@height: height of main panel and layers
		@mode: determines contiuous 1-2-3-4.....
			or random 1-4-3-1 flow of layers
			set 1 = contiuous | 2 = random - 1 is the default
		@limit: true = stop when array completes | false = repeat forever, default false
		@dir: direction layer is scrolling 'r' = left to right : 'l' right to left 
						   'u' bottom to top : 'd' top to bottom 'r' is default
		@layers:source of the layers.
		@speed: the speed of the layer, default 10
		@interval: pause between scrolls, default 10000
/////

*/


var scrollingFunctions = {
	id:'',
	width:0,
	height:0,
	timer:null
};

scrollingFunctions.set = function(id,width,height){

	this.id = id;
	this.width = width;
	this.height = height;

	$styles($ele(id),{width:width+'px',height:height+'px'});

};

scrollingFunctions.setLayers = function(layers){
	// set the width and the height of all the layers
	var w = this.width+'px',h = this.height+'px';
	layers.reduce(function(layer){
			var s = {width:w,
			         height:h,
			         display:"block",
				 position:"absolute"};
			$styles($ele(layer),s);	
		});	
};

scrollingFunctions.Scroller = function(l1,l2){

	this.scroll = function(dir,speed){
		
		// dir scrolling direction left or right, up or down 
		// set scrolling direction 
		var h = (dir==='r'||dir==='l'), v = (dir==='d'||dir==='u');
		// set len1 and len2
		var dim = h ? this.width : this.height;
		var rd = (dir==='r'||dir==='d');
		var len1 = rd ? -dim : dim, len2 = 0;

		// start scrolling
		for(var i = 0;i<=dim;i++){
			(function(){
				var n = i;
				var m1 = rd ? len1++ : len1--;
				var m2 = rd ? len2++ : len2--;
				setTimeout(function(){
					var s1 = h ? {left:m1+'px',top:0} : {top:m1+'px',left:0};
					var s2 = h ? {left:m2+'px',top:0} : {top:m2+'px',left:0};
					$styles(l1,s1);
					$styles(l2,s2);
				},speed*n);
			})();
		}

	};

	return this;
};

scrollingFunctions.properties = function(obj){

	// set width and height
	this.set(obj.id,obj.width,obj.height);
	this.layers = obj.layers;
	this.setLayers(this.layers);
	// set speed and interval
	this.speed = (obj.speed<1)||(typeof obj.speed!=='number') ? 10 : obj.speed;
	this.interval = (obj.interval<1)||(typeof obj.interval!=='number') ? 10000 : obj.interval;
	// set dir
	this.dir = (['r','l','d','u'].indexOf(obj.dir) < 0) ? 'r' : obj.dir;
	// reverse direction
	var d = {'r':'l','l':'r','d':'u','u':'d'};
	this.reversedir = d[this.dir];
	// mode
	this.mode = (obj.mode < 1 || obj.mode > 2)||(typeof obj.mode !== 'number') ? 1 : obj.mode;
	// limit
	this.limit = (obj.limit !==false && obj.limit !==true) ? false : obj.limit;

	// return properties
	return this;
};

scrollingFunctions.scrollerPanel = function(obj){


	var p = scrollingFunctions.properties(obj);


	var stopScroll = false;
	var max = p.layers.length-1;
	var scrollerstarted = false;
	// set num
	var num = 0;
	var lastnum = max;

	// starts scroller
	this.start = function(){


		if(stopScroll){stopScroll=false;}
	
		this.timer = setTimeout(function(){scrollLayer();},p.interval);
		scrollerstarted = true;
		

		var scrollLayer = function(){
			if(!stopScroll){
				lastnum = num;
				num++;
				num = num > max ? 0 : num;
				isSrolling = true;
				var l1 = $ele(p.layers[num]),l2 = $ele(p.layers[lastnum]);
			
				if(isSrolling){
					clearTimeout(this.timer);this.timer=null;
					// start scrolling
					scrollingFunctions.Scroller(l1,l2).scroll(p.dir,p.speed);
				}
				isSrolling = false;
			
 				this.timer = setTimeout(function(){scrollLayer();},p.interval);
			
			}
		};
	};

	this.stop = function(){
		if(stopScroll){alert("scroller is currently stopped");return;}
		stopScroll = true;
		scrollerstarted = false;;
	};

	this.prev = function(){
		if(!stopScroll && scrollerstarted){alert("scroller must be stopped first");return;}

		lastnum = num;
		num--;
		num = num < 0 ? max : num;
		var l1 = $ele(p.layers[num]),l2 = $ele(p.layers[lastnum]);
		// scroll in reverse direction
		scrollingFunctions.Scroller(l1,l2).scroll(p.reversedir,p.speed);
	};

	this.next = function(){
		if(!stopScroll && scrollerstarted){alert("scroller must be stopped first");return;}

		lastnum = num;
		num++;
		num = num > max ? 0 : num;
		var l1 = $ele(p.layers[num]),l2 = $ele(p.layers[lastnum]);
		scrollingFunctions.Scroller(l1,l2).scroll(p.dir,p.speed);
	};

	this.setButtons = function(arr){
		var f = [this.start,this.stop,this.prev,this.next];
		// set buttons 20px below scroller

		for(var i = 0;i<arr.length;i++)
		{addEvent($ele(arr[i]),'click',f[i],false);}
	};


	return this;

};

scrollingFunctions.initScroller = function(obj){

	var p = scrollingFunctions.properties(obj);

	// flag isSrolling
	var isSrolling = false;
	// set max
	var max = p.layers.length-1;
	// set num
	var num = 0;

	this.timer = setTimeout(function(){scrollLayer();},100);
	
	var scrollLayer = function(){
			var lastnum = num;
			num++;
			num = (p.mode===1 && num > max) ? 0 : p.mode===2  ? newRandom(lastnum,max) : num;
			isSrolling = true;
			var l1 = $ele(p.layers[num]),l2 = $ele(p.layers[lastnum]);
			
			if(isSrolling){
				clearTimeout(this.timer);this.timer=null;
				// start scrolling
				scrollingFunctions.Scroller(l1,l2).scroll(p.dir,p.speed);
			}
			var stopAtLast = ((p.limit && num===max) && p.mode===1);
			isSrolling = false;
			if(!stopAtLast){
				this.timer = setTimeout(function(){scrollLayer();},p.interval);
			}
			
		}
};

var fadingFunctions = {};

fadingFunctions.setOpacity = function(ele,value){

	// opacity is for Mozilla and Safari 
	ele.style.opacity = value * .01;
	// for Explorer. value ranges from 0 to 100.
	ele.style.filter = 'alpha(opacity=' + value + ')';	

}

fadingFunctions.initFader = function(obj){
	
	var ele = $ele(obj.ele);
	var images = obj.images;
	var mode = obj.mode;
	// set speed and interval
	var speed = (obj.speed<1)||(typeof obj.speed!=='number') ? 10 : obj.speed;
	var interval = (obj.interval<1)||(typeof obj.interval!=='number') ? 10000 : obj.interval;
	var limit = obj.limit;
	// set max
	var max = images.length-1;
	// flag isFading
	var isFading = false;
	// set num
	var num = 0;
	var timer = null;

	timer = setTimeout(function(){fade();},interval);

	
	var fade = function(){
			var lastnum = num;
			num++;
			num = (mode===1 && num > max) ? 0 : mode===2  ? newRandom(lastnum,max) : num;
			isFading = true;
			clearTimeout(timer);timer=null;
			
			if(isFading){
				// start fading
				fader(images[num].src).fadeOutIn(ele,speed);
			}
			
	};

	var fader = function(img){

		this.fadeOutIn = function(ele,speed){
	
			var timeout = null;
			var i = 0;

			timeout = setInterval(function(){
				if(i === 100){ele.src = img;}
				var val = i < 100 ? 100 - i : i - 100;
				fadingFunctions.setOpacity(ele,val);
				i+=2;
				if(i>200){
					clearInterval(timeout);
					timeout=null;
					isFading = false;
					var stopAtLast = ((limit && num===max) && mode===1);
					if(!stopAtLast){
						timer = setTimeout(function(){fade();},interval);
					}
				}
		    	
			},speed);

		};

		return this;
	};


};