/** 
 * @description		Carousel Control
 * @author			Amit Sharma  - amit_sharma@symantec.com or http://www.symantec.com
 * @date			19/01/09
 * @release			2.0
 * @functionality	autoplay,next,back,paging,position 
**/

var ScrollingBar = Class.create();
  
ScrollingBar.prototype = {
  initialize : function(id,size,indicator,options) {
    this.scrollbar = $(id);
    this.length = 0;
    this.lastTab = 0;
    this.tabIndex = [0];
    this.maxLength = size+20;
    this.currentLength;
	this.indiCatorDots="";
	this.objectClicked=false;
	this.divIndicator=$(indicator);
	this.lock=false;
	var indicatorWidth=0;

	if ((options.position==undefined)||(options.position>this.scrollbar.getElementsByClassName("boxHolder").length)){
	this.setIndicator=1;}
	else if(options.position<=this.scrollbar.getElementsByClassName("boxHolder").length){
	this.setIndicator=options.position;}

	if ((options.duration==null)||(options.duration==undefined))	{
	this.duration=0.3;}else{
	this.duration=options.duration;}
	
	if ((options.autoplay==null)||(options.autoplay==undefined)){
	this.autoPlay=false;}else{
	this.autoPlay=options.autoplay;	}

	if ((options.time==null)||(options.time==undefined)){
	this.time=30000;}else{
	this.time=options.time;}

	Element.setStyle(this.scrollbar.up(), { width :(this.maxLength-20) + 'px' });

	if(this.scrollbar.getElementsByClassName("boxHolder").length>1){
	   $A(this.scrollbar.getElementsByClassName("boxHolder")).each( function(div,index) {
			   if(index==0){
				this.divIndicator.innerHTML+="<a href='#' class='scorebar_prevbtn' onclick='return false;' id='"+index+"'>"+"&nbsp;"+"</a>";}
			   index=index+1
			   this.length += Element.getDimensions(div).width;
			   this.tabIndex.push(this.length);
			   if( this.length < this.maxLength )this.lastTab = this.length
			    if(index==this.setIndicator){
					this.divIndicator.innerHTML+="<a href='#' class='clicked' onclick='return false;' id='"+index+"'>"+"&nbsp;"+"</a>";
				}else{
					this.divIndicator.innerHTML+="<a href='#' class='notClicked' onclick='return false;' id='"+index+"'>"+"&nbsp;"+"</a>";
			   }
			   if(index==this.scrollbar.getElementsByClassName("boxHolder").length){
				 this.divIndicator.innerHTML+="<a href='#' class='scorebar_nextbtn' onclick='return false;' id='"+index+"'>"+"&nbsp;"+"</a>";}
			if(this.autoPlay){
			 Event.observe(div, 'mouseover', this.rollOver.bind(this));
			  Event.observe(div, 'mouseout', this.rollOut.bind(this));
			   Event.observe(div, 'click', this.divClicked.bind(this));
			}
			}.bind(this));
	


		Element.setStyle(this.scrollbar, { width : this.length+3+ 'px' });
		this.currentLength = this.lastTab;

		
		this.div = document.createElement('div');
		this.div.className = 'outer_scorebar';
		
		Element.setStyle(this.div, { width : this.currentLength + 'px' });
		this.scrollbar.parentNode.insertBefore(this.div, this.scrollbar);
		this.div.appendChild(this.scrollbar);
		for(i=0;i<=this.divIndicator.getElementsByTagName('a').length;i++){
			if(i==0){
				Event.observe(this.divIndicator.getElementsByTagName('a')[i], 'click', this.previous.bind(this) );
			}else if(i<this.divIndicator.getElementsByTagName('a').length-1){
				Event.observe(this.divIndicator.getElementsByTagName('a')[i], 'click', this.indicators.bind(this) );
			}else if(i==this.divIndicator.getElementsByTagName('a').length-1){
				Event.observe(this.divIndicator.getElementsByTagName('a')[i], 'click', this.next.bind(this) );
			}
		}

		for(i=0;i<this.divIndicator.getElementsByTagName('a').length;i++){
					indicatorWidth += Element.getDimensions(this.divIndicator.getElementsByTagName('a')[i]).width;
		}
		indicatorWidth=Element.getDimensions(this.divIndicator).width-indicatorWidth;
		indicatorWidth=	indicatorWidth/2;
		Element.setStyle(this.divIndicator, { 'margin-left': indicatorWidth+'px'});

	}
//alert("this.lastTab  :"+this.lastTab + "     \n this.tabIndex[this.setIndicator];  " + this.tabIndex[this.setIndicator]);

if ((options.position!=undefined)&&(options.position<this.tabIndex.length)){
//this.setIndicator=this.setIndicator-1;
this.lastTab=this.tabIndex[this.setIndicator];
new Effect.MoveBy(this.scrollbar, 0, -1*this.tabIndex[this.setIndicator-1],{duration:this.duration});	}

if(this.autoPlay)setInterval ( this.autoplay.bind(this),this.time);
},


 autoplay:function(){

	if(!this.autoPlay){return;}
	if(this.objectClicked){return;}
	if(this.lock) {return;}this.lock=true;

	var lastClicked=0;

		for(i=1;i<this.divIndicator.getElementsByTagName('a').length-1;i++){
			if (this.divIndicator.getElementsByTagName('a')[i].className=="clicked"){
					lastClicked=this.divIndicator.getElementsByTagName('a')[i].id;
					this.divIndicator.getElementsByTagName('a')[i].className="notClicked";
				};
		}

		lastClicked++;

		if(lastClicked<this.divIndicator.getElementsByTagName('a').length-1){
			this.divIndicator.getElementsByTagName('a')[lastClicked].className="clicked";
		}else{
			this.divIndicator.getElementsByTagName('a')[1].className="clicked";
		}

		var index = this.lastTab + this.maxLength;


		if(index<=this.length+this.currentLength){
		//	 this.lock = true;
		//	 Element.setOpacity(elem, 1.0);	
			  var nextTab = 0;
			  $A(this.tabIndex).each( function(item) { if(item > index) throw $break; nextTab = item; });
			  new Effect.MoveBy(this.scrollbar, 0, -1*this.currentLength,{duration:this.duration});
			  var size = nextTab - this.lastTab;
			  var percent = (size / this.currentLength) * 100;
			  new Effect.Scale(this.div, 100, {
				scaleY: false,
				scaleContent: false,
				afterFinish : function() { Element.setStyle(this.div, { width :  this.currentLength + 'px' }); this.lock = false;}.bind(this)
				});
			  this.currentLength = size;
			  this.lastTab = nextTab;	 
		   }else{
			new Effect.MoveBy(this.scrollbar, 0, this.lastTab- this.currentLength,{
				duration:this.duration,
				afterFinish : function() {
				this.lock = false;}.bind(this)
				
			});
			this.lastTab=this.currentLength;
		   }
   },
rollOver:function(evnt){
	this.autoPlay=false;
	Event.stop(evnt);
},

rollOut:function(evnt){
	this.autoPlay=true;
	Event.stop(evnt);
},

divClicked:function(evnt){
	this.autoPlay=false;
	this.objectClicked=true;
//	Event.stop(evnt);
},

 indicators:function(evnt){
    if(this.lock) { return; }this.lock = true;
	//this.autoPlay=false;

	Event.stop(evnt);
    var elem = Event.element(evnt);

	var lastClicked=0;
    elem.blur();
    
	if(elem.className=="clicked") { return; }

	for(i=1;i<this.divIndicator.getElementsByTagName('a').length-1;i++){
		if (this.divIndicator.getElementsByTagName('a')[i].className=="clicked"){
			lastClicked=this.divIndicator.getElementsByTagName('a')[i].id;
		};
	}


	for(i=0;i<=this.divIndicator.getElementsByTagName('a').length;i++){
		if(elem.id==i){
			this.lastTab=this.tabIndex[elem.id-1]
		}
	}
  
    var index = this.lastTab + this.maxLength;



   
   	if(index <=this.length+240){

     Element.setOpacity(elem, 1.0);
      
     var nextTab = 0;

	 $A(this.tabIndex).each( function(item) {if(item > index)throw $break; nextTab = item; });

			for(i=1;i<this.divIndicator.getElementsByTagName('a').length-1;i++){
				if(this.divIndicator.getElementsByTagName('a')[i].id==elem.id)
				{
					this.divIndicator.getElementsByTagName('a')[i].className="clicked";
				}else{
					this.divIndicator.getElementsByTagName('a')[i].className="notClicked";
				}
					
			}

			if(elem.id<lastClicked){
					this.currentLength=this.tabIndex[lastClicked]-this.tabIndex[elem.id];
					new Effect.MoveBy(this.scrollbar, 0, this.currentLength ,{duration:this.duration});
				}else{
					this.currentLength=this.tabIndex[elem.id]-this.tabIndex[lastClicked];
					new Effect.MoveBy(this.scrollbar, 0, -1*this.currentLength ,{duration:this.duration});
			}
		
			var size = nextTab - this.lastTab;
							
			this.currentLength = size;
			this.lastTab = nextTab;

			new Effect.Scale(this.div, 100, {
				scaleY: false,
				scaleContent: false,
				afterFinish : function() { Element.setStyle(this.div, { width :  this.currentLength + 'px' }); this.lock = false; }.bind(this)
			});
					
	 } 



	},
next : function(evnt) {
//alert("next - this.lock  : "+this.lock)
	if(this.lock) {return;}this.lock=true;
	
//	this.autoPlay=false;
	Event.stop(evnt);
	var elem = Event.element(evnt);
	elem.blur();
	var lastClicked=0;


	for(i=1;i<this.divIndicator.getElementsByTagName('a').length-1;i++){
		if (this.divIndicator.getElementsByTagName('a')[i].className=="clicked"){
				lastClicked=this.divIndicator.getElementsByTagName('a')[i].id;
				this.divIndicator.getElementsByTagName('a')[i].className="notClicked";
			};
	}

	lastClicked++;

	if(lastClicked<this.divIndicator.getElementsByTagName('a').length-1){
		this.divIndicator.getElementsByTagName('a')[lastClicked].className="clicked";
	}else{
		this.divIndicator.getElementsByTagName('a')[1].className="clicked";
	}

	var index = this.lastTab + this.maxLength;
	if(index <=this.length+this.currentLength){
		  Element.setOpacity(elem, 1.0);	
		  var nextTab = 0;
		  $A(this.tabIndex).each( function(item) { if(item > index) throw $break; nextTab = item; });
		  new Effect.MoveBy(this.scrollbar, 0, -1*this.currentLength,{duration:this.duration});
		  var size = nextTab - this.lastTab;
		  var percent = (size / this.currentLength) * 100;
		  new Effect.Scale(this.div, 100, {
			scaleY: false,
			scaleContent: false,
			afterFinish : function() { Element.setStyle(this.div, { width :  this.currentLength + 'px' }); this.lock = false; }.bind(this)
			});
		  this.currentLength = size;
		  this.lastTab = nextTab;	 
	   }else{
		new Effect.MoveBy(this.scrollbar, 0, this.lastTab- this.currentLength,{duration:this.duration,
		afterFinish : function() {this.lock = false;}.bind(this)
		});
		this.lastTab=this.currentLength;
	   }
	},
previous : function(evnt) {
//alert("back - this.lock  :  "+this.lock);
if(this.lock) {	return; }this.lock = true;
this.autoPlay=false;
	Event.stop(evnt);
	var elem = Event.element(evnt);
	elem.blur();
	var lastClicked=0;
		
	for(i=this.divIndicator.getElementsByTagName('a').length-1;i>-1;i--){
			if (this.divIndicator.getElementsByTagName('a')[i].className=="clicked"){
					lastClicked=this.divIndicator.getElementsByTagName('a')[i].id;
					this.divIndicator.getElementsByTagName('a')[i].className="notClicked";
				}
		}

		if(lastClicked>1){
			lastClicked=lastClicked-1;
			this.divIndicator.getElementsByTagName('a')[lastClicked].className="clicked";}
		else{
			this.divIndicator.getElementsByTagName('a')[this.divIndicator.getElementsByTagName('a').length-2].className="clicked";
		}


	if(this.lastTab>this.currentLength){
		var lastTab = this.lastTab - this.currentLength;
		var index = Math.max( lastTab - this.maxLength, 0 );
		var firstTab = $A(this.tabIndex).find( function(item) { return (item >= index)});

		if(lastTab - firstTab < 1) { this.lock = false; return; }
	 
		new Effect.MoveBy(this.scrollbar, 0, lastTab - firstTab,{duration:this.duration});   
		index = firstTab + this.maxLength;
		var nextTab = 0;
		$A(this.tabIndex).each( function(item) { if(item > index) throw $break; nextTab = item; });
		
		var size = nextTab - firstTab;
		new Effect.Scale(this.div, 100, {
		  scaleY: false,
		  scaleContent: false,
		  afterFinish : function() { Element.setStyle(this.div, { width :  this.currentLength + 'px' }); this.lock = false; }.bind(this)
		});    
		this.currentLength = size;
		this.lastTab = nextTab;
		
		}else{
			var lastLength=this.length-this.currentLength
			new Effect.MoveBy(this.scrollbar, 0, -1*lastLength,{duration:this.duration,
			afterFinish : function() {this.lock = false;}.bind(this)
			});
			this.lastTab=this.length;
			this.lock = false; 
		}
	}

};