var BottomScroll = Class.create({
	initialize:function(options){
		this.options={
			bottomContainer:'bottom-roll'	
			,slider:'slider'
			,table:'table-logo'
			,move:true
			,duration:0.2
		};
		Object.extend(this.options, options || { });	
		this.initVar();
		if(this.options.move)this.initSecondSlider();
		this.initListener();
		if(this.options.move)this.initMove();
	},
	
	initVar:function(){
		this.slider = $(this.options.slider);
		this.sliderSize = this.slider.getDimensions();
		this.bottomContainer = $(this.options.bottomContainer);
		this.tableLogo = $(this.options.table);
		this.tableLogoSize = this.tableLogo.getDimensions();
		this.real_width = this.tableLogoSize.width;
		this.s1PosX=0;
		this.s2PosX=0;
		this.currentLogo = null;
	},
	
	initSecondSlider:function(){
		this.slider2 = new Element("div",{
			style:"position:absolute;height:86px;width:"+this.real_width+"px;left:-"+this.real_width+"px;"
		});
		
		var logos = this.slider.innerHTML+"";
		this.slider2.update(logos);
		this.slider2.id = "slider2";

		this.bottomContainer.insert({
			top:this.slider2
		});
	},
	
	initListener:function(){
		this.overListener = this.over.bindAsEventListener(this);
		this.bottomContainer.observe("mouseover",this.overListener);	
		
		this.outListener = this.out.bindAsEventListener(this);
		this.bottomContainer.observe("mouseout",this.outListener);		
	},
	
	out:function(event){
		if(this.options.move){
			this.eff1.fxPause(false);
			this.eff2.fxPause(false);
		}
		var _item = Event.findElement(event,'.over-logo');
		if(_item){
			//if(this.effect1)this.effect1.finish();
			//if(this.effect2)this.effect2.finish();
			var _under = _item.next('.under-logo');
			if(!_under)_under = _item.up().next('.under-logo');
			this.effect1 = new S2.FX.Morph(_item,
			{
				style:{"opacity":1},
				duration:this.options.duration,
				position: "parallel",
				after:function(){_item.setStyle({opacity:1});}
			});
			this.effect1.play();
			this.effect2 = new S2.FX.Morph(_under,
			{
				style:{"opacity":0}
				,duration:this.options.duration	
				,position: "parallel"
				,after:function(){_under.setStyle({opacity:0});}
			});
			this.effect2.play();
		}
		Event.stop(event);
	},
	
	over:function(event){
		if(this.options.move){
			this.eff1.fxPause(true);
			this.eff2.fxPause(true);		
		}
		var _item = Event.findElement(event,'.over-logo');
		
		if(_item){
			//if(this.effect1)this.effect1.finish();
			//if(this.effect2)this.effect2.finish();
			var _under = _item.next('.under-logo');
			if(!_under)_under = _item.up().next('.under-logo');
			_under.setStyle({opacity:0});
			_under.show();
			this.effect1 = new S2.FX.Morph(_item,
			{
				style:{"opacity":0}
				,duration:this.options.duration	
				,position: "parallel"
				,after:function(){_item.setStyle({opacity:0});}
			});
			this.effect1.play();
			this.effect2 = new S2.FX.Morph(_under,
			{
				style:{"opacity":1},
				duration:this.options.duration	
				,position: "parallel"
				,after:function(){_under.setStyle({opacity:1});}
			});
			this.effect2.play();
		}
		Event.stop(event);
	},
	
	initMove:function(){
		this.s1PosX=this.real_width;
		this.s2PosX=0;
		this.eff1 = $fx(this.slider).fxAdd({
			type: 'left',  
			to: this.s1PosX, 
			step: 3,
			delay: 50
		});
		
		this.eff2 = $fx(this.slider2).fxAdd({
			type: 'left',  
			to: this.s2PosX, 
			step: 3,
			delay: 50
		});
		
		this.eff1.fxRun(null,-1);
		this.eff2.fxRun(null,-1);
	}	
});