var JVVmScroller= new Class({
	options:{
		duration: 1000,
	    interval: 3000,
		tmpDuration:1000,
		tmpInterval: 3000,
	    auto: 0,
		running: false
	},
	initialize:function(options){
		this.setOptions(options);
		this.scrollerWrap = $(this.options.scrollerWrap);
		this.scrollerItem = $ES('div.scroll-item',this.scrollerWrap);
		this.aryEffect = {};
		this.elements = $ES('div.scroll-item',this.scrollerWrap);
		this.current = 0;
		this.left = $('jv-scroller-left'+this.options.moduleId);
		this.right = $('jv-scroller-right'+this.options.moduleId);
		if(this.options.auto) this.nextRun();
		
		this.left.addEvent('mouseover',function(){
			this.left.addClass('left_active');
			this.excuteClick('left',0);		
			this.options.dir = 'left';			
		}.bind(this));
		this.left.addEvent('mouseleave',function(){
			this.options.dir = 'left';	
			this.excuteClick('left',1);
			this.left.removeClass('left_active');
		}.bind(this));
		this.right.addEvent('mouseover',function(){
			this.options.dir = 'right';	
			this.right.addClass('right_active');
			this.excuteClick('right',0);			
		}.bind(this));
		this.right.addEvent('mouseleave',function(){
			this.options.dir = 'right';							
			this.right.removeClass('right_active');
			this.excuteClick('right',1);
		}.bind(this));
		this.constructElement();
	},
	excuteClick:function(dir,mouseleave){
		if(this.options.auto){
			if(mouseleave){
				this.options.interval = this.options.tmpInterval;
				this.options.duration  = this.options.tmpDuration;
			} else {
				this.options.interval = 900;			
				this.options.duration = 500;
				this.nextRun();
			}
		} else {
			if(mouseleave){
				this.options.auto = 1;
			} else {
				this.options.interval = 500;			
				this.options.duration = 500;
				this.options.auto = 1;				
				this.nextRun();
			}
		}
	},
	nextCurr: function () {	
		if(this.options.dir == 'left') next = (this.current+1) % this.elements.length;		
		else next = (this.current+this.elements.length-1) % this.elements.length;
		return next;
	},
	constructElement:function(){
		for(i=0;i<this.scrollerItem.length;i++){
			this.scrollerItem[i].setStyle('top','0');
			this.scrollerItem[i].setStyle('left',this.options.itemWidth*i);
		}
	},
	getEffect:function(){
		if(this.options.dir == 'left'){
			for(i=0;i<=this.options.noItemDisplay;i++){
				this.aryEffect[i] =	{ 'left': [ i*this.options.itemWidth, (i-1)*this.options.itemWidth] };
			}
		} else {
			for(i=0;i<=this.options.noItemDisplay;i++){
				this.aryEffect[i] =	{ 'left': [ (i-1)*this.options.itemWidth, i*this.options.itemWidth] };
			}
		}
	},
	nextRun: function (isClick) {		
    	if (this.running) return;
		clearTimeout(this.timeOut);
		if (this.options.totalItem <= this.options.noItemDisplay) return;
		if (this.options.auto){
			this.timeOut = setTimeout(this.startEffect.bind(this),this.options.interval);
			this.fetchNext();
		}		
    },
	next: function () {
		if(this.options.dir =='left') next = (this.current+this.options.noItemDisplay) % this.elements.length;	
		else next = (this.current+this.elements.length-1) % this.elements.length;
		return next;
	},	
	setPosition: function (elems) {
		if (!elems) elems = this.getRunPropertyElems();
        for(i=0;i<elems.length;i++) {
			el = elems[i];
			if (el){
				if(this.options.dir == 'left') {
					el.setStyle('left', this.options.itemWidth*i);
				} else {
					el.setStyle('left', this.options.itemWidth*(i-1));
				}					
				}
			}
	},
	startEffect: function () {
		//clearTimeout(this.timeOut);
		if (!this.elements[this.next()]) {
			this.nextRun();
			return;
		}
        var objs = this.getRunPropertyElems();	
		this.setPosition(objs);
		if (this.x) this.x.stop();
		this.running = 1;		
        this.x = new Fx.Elements(objs, {duration: this.options.duration, onComplete:this.runcomplete.bind(this)});
		this.getEffect();
		this.x.start(this.aryEffect);
		this.current = this.nextCurr();
    },
	getRunPropertyElems:function(){
		var objEffects = new Array();
		if(this.options.dir == 'left') tmp = 0;
		else tmp = this.elements.length-1;
		for(i=0;i<=this.options.noItemDisplay;i++) {
            objEffects[i] = this.elements[(this.current+i+tmp) % this.elements.length];			
        }
		return objEffects;
	},
	fetchNext: function(){
		this.next();
	},
    runcomplete: function() {		
    	this.running = 0;
    	this.nextRun();
    }  
});
JVVmScroller.implement(new Events);
JVVmScroller.implement(new Options);