/*  Vertical DHTML Scroller
 *
 *  This script requires Prototype.js 1.6.0, this can be downloaded from http://www.prototypejs.org/
 *
 *  Usage:
 *
 *  new pVscroller(divId,height,width,increment,content);
 *
 *  params:
 * 	divId 		: ID of the HTML container where scrolling content of will shown.
 *  height		: height of the scrolling content , must be numeric
 *  width		: width of the scrolling content , must be numeric
 *  directions	: The direction left or top.
 *  speed	: The speed play.
 *  scroll block	: The block direction left or top.
 *  content		: Raw HTML content will be scroller in side container of ID divId.
 *   			  If you do not provide the content, then the content of divId wil be used to scroll.
 */


var pVscroller=Class.create(Enumerable, {
	initialize :function (divId, height, width, directions ,mRate, sblock, content){
		if(!$(divId)){
			return;
		}
		if(!content){
			content=$(divId).innerHTML;
		}
		this.pe = null;
		this.iHeight = $(divId).childElements()[0].getHeight();
		this.iWidth =  $(divId).childElements()[0].getWidth();
		$(divId).setStyle({width: width + 'px',height: height + 'px', display:'block', overflow:'hidden'})
		if(directions == 'left'){
			this.cUL = $(divId).childElements()[0];
			this.cUL.setStyle({width: (this.cUL.childElements()[0].getWidth() * this.cUL.childElements().length) + 'px'});
			this.iWidth = this.cUL.getWidth();
		}
		//this.scProp={'divId': divId,'height'  : height, 'width' : width,'state':'none','increment':increment};
		this.scProp={'divId': divId,'height': height, 'width': width,'state':'none', 'directions': directions, 'mRate':mRate, 'sblock':sblock};


		this.scTBar=new Element('div',{className : 'scTBar'});
		this.scTBar.setStyle({width: this.scProp.width + 'px'});

		this.scTLink=new Element('a',{className : 'scTLink','href': 'javascript:void(0);' }).update();
		this.scTBar.appendChild(this.scTLink);

		this.scBBar=new Element('div',{className : 'scBBar'});
		this.scBBar.setStyle({width: this.scProp.width + 'px'});

		this.scBLink=new Element('a',{className : 'scBLink','href': 'javascript:void(0);' });
		this.scBBar.appendChild(this.scBLink);


		this._scArea=new Element('div',{'id': this.scProp.divId+this.scProp.directions+'demo', className : 'scArea'});
		this._scArea.makeClipping().setStyle({width: this.scProp.width + 'px',height: this.scProp.height + 'px', 'overflow':'hidden', 'float':'left'});

		//var scAreaContent=new Element('div',{'id': 'demo', 'class' : 'scAreaContent'});
		this.scAreaContent1=new Element('div',{'id': this.scProp.divId+this.scProp.directions+'demo1', className : 'scAreaContent'});
		this.scAreaContent1.setStyle({width: this.iWidth + 'px',height: this.iHeight + 'px', 'display':'block', 'float':'left'});
		this.scAreaContent2=new Element('div',{'id': this.scProp.divId+this.scProp.directions+'demo2', className : 'scAreaContent'});
		this.scAreaContent2.setStyle({width: this.iWidth + 'px',height: this.iHeight + 'px', 'display':'block', 'float':'left'});
		$(this.scProp.divId).update();
		//scAreaContent.update(content);
		this.scAreaContent1.update(content);
		this.scAreaContent2.update(content);
		//content=null
		//scArea.appendChild(scAreaContent);
		this._scArea.appendChild(this.scAreaContent1);
		this._scArea.appendChild(this.scAreaContent2);


		//$(this.scProp.divId).appendChild(scTBar);
		$(this.scProp.divId).appendChild(this._scArea);
		//$(this.scProp.divId).appendChild(scBBar);
		$(this.scProp.divId).show();

		//Event.observe(scTLink,'mouseover'	,function(event){this.scProp.state='up'	;}.bind(this));
		//Event.observe(scBLink,'mouseover'	,function(event){this.scProp.state='down'	;}.bind(this));
		//Event.observe(scTLink,'mouseout'	,function(event){this.scProp.state='none'	;}.bind(this));
		//Event.observe(scBLink,'mouseout'	,function(event){this.scProp.state='none'	;}.bind(this));
		this._scArea.observe('mouseover',function(event){this.pe.stop();}.bind(this));
		this._scArea.observe('mouseout'	,function(event){this.pe.registerCallback();}.bind(this));
		this.scProp.state = this.scProp.directions;
		this.scArea=this._scArea;
		if(this.scProp.directions == 'up'){
			this.pe = new PeriodicalExecuter(function() {this.pscrollUp();}.bind(this), this.scProp.mRate);
		}else if(this.scProp.directions == 'left'){
			this.pe = new PeriodicalExecuter(function() {this.pscrollLeft();}.bind(this), this.scProp.mRate);
		}
	},
	pscrollUp: function(){
			if  (this.scProp.state=='up'){
				if(this.scAreaContent2.offsetHeight-this.scArea.scrollTop <= 0){
					this.scArea.scrollTop -= this.scAreaContent1.offsetHeight;
				}else{
					if(this.scProp.sblock){
						this.scArea.scrollTop=this.scArea.scrollTop+this.scArea.getHeight();
					}else{
						this.scArea.scrollTop++;
					}
				}
			}
	},
	pscrollLeft: function(){
			if  (this.scProp.state=='left'){
				if(this.scAreaContent2.offsetWidth - this.scArea.scrollLeft <= 0){
					this.scArea.scrollLeft -= this.scAreaContent1.offsetWidth;
				}else{
					this.scArea.scrollLeft++;
				}
			}
	}

});