/*
	cyrus,
	06 Jun 2008
	- fixed no looping when over 2 class in using (IE bug)
	
	francis,
	20 Feb 2008
	- fixed css padding problem
*/
var RollSetting={};
RollSetting.speed=80;
var Roll = Class.create(
	{
		
		initialize:function(ele,options){
			this.ele = $(ele);
			this.ele.makeClipping();
			this.options = Object.extend({
				speed:RollSetting.speed,
				direction:"hori",
				width:this.ele.getWidth(),
				height:this.ele.getHeight()
			},options);
			
			//this.ele.setStyle({width:this.options.width,height:this.options.height});
			
			//this.ele.observe("mouseover",function(){this.stop()}.bind(this));
			//this.ele.observe("mouseout",function(){this.play()}.bind(this));
			
			this.content_html = this.ele.innerHTML;
			this.ele.undoClipping();

			if(this.options.direction=="hori"){
				var aw=0;
				this.ele.childElements().each(function(e){if(e.getStyle("display")=="block")e.setStyle({display:"inline"})});
				this.ele.childElements().each(function(e){if(e.tagName!="BR")aw+=e.getWidth()});
				this._offsetwidth=aw;
			}else{
				var ah=0;
				this.ele.childElements().each(function(e){if(e.getStyle("display")=="block")e.setStyle({display:"inline"})});
				this.ele.childElements().each(function(e){if(e.tagName!="BR")ah+=e.getHeight()});
				this._offsetheight=ah;
			}
			this.ele.makeClipping();
			
			if(this.options.direction=="hori"){
				if(this._offsetwidth>this.options.width){
					this.ele.update("<table cellpadding='0' cellspacing='0'><tr><td>"+this.content_html+"</td><td>"+this.content_html+"</td></table>");
				}
			}else{
				if(this._offsetheight>this.options.height){
					this.ele.update("<table cellpadding='0' cellspacing='0'><tr><td>"+this.content_html+"</td></tr><tr><td>"+this.content_html+"</td></tr></table>");
				}
			}
			this.play();
			
		},
		
		play:function(){
			this.stop();
			if(this.options.direction=="hori"){
				this._intarvalID = setInterval(function(){
					this.ele.scrollLeft+=1;
					if(this.ele.scrollLeft>=this._offsetwidth) this.ele.scrollLeft=0;
				}.bind(this),this.options.speed);
			}else{
				this._intarvalID = setInterval(function(){
					this.ele.scrollTop+=1;
					if(this.ele.scrollTop>=this._offsetheight) this.ele.scrollTop=0;
				}.bind(this),this.options.speed);
			}
		},
		
		stop:function(){
			clearInterval(this._intarvalID);
		}
		
	}
);




document.observe(
	"dom:loaded",
	function(){
		(function(){
		$$(".roll_hori").each(
			function(ele){
				var c=new Roll(ele.identify(),{direction:"hori"});
				regcmp(c,ele.identify());
			}
		);
		$$(".roll_vert").each(
			function(ele){
				var c=new Roll(ele.identify(),{direction:"vert"});
				regcmp(c,ele.identify());
			}
		);
		$$(".roll_hori_over").each(
			function(ele){
				var c=new Roll(ele.identify(),{direction:"hori"});
				regcmp(c,ele.identify());
				ele.observe("mouseover",function(){this.stop()}.bind(c));
				ele.observe("mouseout",function(){this.play()}.bind(c));
			}
		);
		$$(".roll_vert_over").each(
			function(ele){
				var c=new Roll(ele.identify(),{direction:"vert"});
				regcmp(c,ele.identify());
				ele.observe("mouseover",function(){this.stop()}.bind(c));
				ele.observe("mouseout",function(){this.play()}.bind(c));
			}
		);
		
		//this.ele.observe("mouseover",function(){this.stop()}.bind(this));
		//this.ele.observe("mouseout",function(){this.play()}.bind(this));
		
		
		}).defer();
	}
);