var Loop=new Class({loopCount:0,isStopped:true,isLooping:false,loopMethod:$empty,setLoop:function(fn,delay){if(this.isLooping)this.stopLoop();this.loopMethod=fn;this.loopDelay=delay||3000;return this;},stopLoop:function(){this.isStopped=true;this.isLooping=false;$clear(this.periodical);return this;},startLoop:function(delay){if(this.isStopped){var delay=(delay)?delay:this.loopDelay;this.isStopped=false;this.isLooping=true;this.periodical=this.looper.periodical(delay,this);}
return this;},resetLoop:function(){this.loopCount=0;return this;},looper:function(){this.loopCount++;this.loopMethod(this.loopCount);return this;}});


var vCaroussel = new Class({
	
	Implements:  [Options, Loop], 
	
	//variables setup
	slides_container: null,
	images_container: null,
	slides: [],
	images: [],
	slideClass: null,
	imageClass: null,
	isSliding: 0,					//flag for animation/click prevention
	direction: -1,					//flag for direction (down(-1)/up(1))
	itemNum: 0,						//Current item number	
	numItens: 0,
	slide_height: 0,
	transitionTime: 0, 		   		//Transition time (1 second = 1000)	
	scroll_up: null,				// Scroll up div
	scroll_down: null,				// Scroll down div
	isPaused: false,
	isSliding: 0,
	prev_slide_out: null,
	previous_direction: 1,
	active_image: 0,
	transition_type: null,
	numVisibleslides: 0,
	
	//options
	options: {
	direction: 1,					//option for direction (down(-1)/up(1))
	slideTimer: 2000,  			    //Time between slides (1 second = 1000), a.k.a. the interval duration
	scrollTimer: 500,				//Time between slides during scrolling
	transitionTime: 500, 		    //Transition time (1 second = 1000)
	scroll_controls: true,			//Flag for scroll controls
	active_image: 0,
	images_slide: true,
	transition_type: 'linear'
	},	
	
	initialize: function(slides_container,images_container, slideClass, imageClass, numVisibleslides,options){
		
		var self = this;
		
		this.setOptions(options);
		this.numVisibleslides = numVisibleslides;
		this.slides_container = slides_container;
		this.slides_container.setStyle('overflow', "hidden");  
		this.slideClass = slideClass;
		this.slides = this.slides_container.getElements('.'+slideClass);
		this.slides.each(function(child, index){ child.setStyles({ 'overflow': 'hidden', 'float': 'left', 'cursor': 'pointer' }); child.addEvent('click', function(){self.change_image(index); }); });
		this.numItens = this.slides.length;
		this.slide_height = this.slides[0].getSize().y;
		
		this.images_container = images_container;
		this.images_container.setStyle('overflow', "hidden");
		this.imageClass = imageClass;
		this.images = this.images_container.getElements('.'+imageClass);
		this.images.each(function(child,index){ child.setStyles({ 'position': 'absolute', 'overflow': 'hidden'}); if (index != self.options.active_image) { child.setStyle('opacity', 0); }; }  );
		

		this.direction = this.options.direction;
		this.previous_direction	 = this.options.direction;
		this.transitionTime = this.options.transitionTime;	
		this.transition_type = this.options.transition_type;	
		this.setLoop(this.slideIt, this.options.slideTimer);
		this.active_image = this.options.active_image; 
		
		if (this.slides.length > numVisibleslides){
			this.slides_container.addEvents({ 'mouseenter': function(){ self.stop(); }, 'mouseleave': function(){ self.start(); } });
			this.images_container.addEvents({ 'mouseenter': function(){ self.stop(); }, 'mouseleave': function(){ self.start(); } });
			if (this.direction == -1) {	this.increment(); };
			this.startLoop(this.options.slideTimer);
			if (this.options.scroll_controls){
				this.iniciate_scroll_controls();			
			};
		}		
		

	},

	slideIt: function () {
		this.isSliding = 1;
		if (this.prev_slide_out) { this.prev_slide_out.destroy();}
		this.slide_out = this.slides[this.itemNum];
		this.prev_slide_out = this.slide_out;
		if (this.direction == 1) {
			this.move_up(this.itemNum);
		};
		if (this.direction == -1) {
			this.move_down(this.itemNum);
		};		
		this.increment(); 
		this.isSliding = 0;
	},
		
	move_up: function(itemNum){
		var self = this;
		this.slides[itemNum] = this.slide_out.clone().inject(this.slides_container,'bottom');
		this.slides[itemNum].addEvent('click', function(){self.change_image(itemNum); });
		this.slide_out.get('tween', {property: 'margin-top', link: 'cancel', transition: this.transition_type, duration: this.transitionTime }).start(-this.slide_height);	
		if ((!this.isPaused)&&(this.options.images_slide)){ this.change_image(itemNum); };
	},

	move_down: function(itemNum){
		var self= this;
		this.slides[itemNum] = new Element('div', { 'class': this.slideClass, 'styles': { 'float': 'left', 'margin-top': -this.slide_height+'px', 'overflow': 'hidden', 'cursor':'pointer' } });
		this.slides[itemNum].inject(this.slides_container,'top');
		this.slides[itemNum].innerHTML = this.slide_out.innerHTML;
		this.slides[itemNum].addEvent('click', function(){self.change_image(itemNum); });
		this.slides[itemNum].get('tween', {property: 'margin-top', link: 'cancel', transition: this.transition_type, duration: this.transitionTime }).start(0);	
		if ((!this.isPaused)&&(this.options.images_slide)){ 
			b = itemNum-(this.numItens - this.numVisibleslides);
			if ( b < 0 ) { b = this.numItens + b; };
			this.change_image(b);
		};
	},
	
	scroll: function (movement) {
		
		this.isPaused = true;
		this.stopLoop();
		this.resetLoop();
		this.transition_type = 'linear'
		if (this.previous_direction != movement ) {
			this.direction = movement;
			this.previous_direction = this.direction;
			this.increment();
		};
		if (this.direction != movement) {
			this.direction = movement;
			this.previous_direction = this.direction;	
		};
		this.transitionTime = this.options.scrollTimer;
  		this.startLoop(this.options.scrollTimer);
	},	

	change_image: function (itemNum){
		if (itemNum != this.active_image) {
			this.images[this.active_image].get('tween', {property: 'opacity', link: 'cancel', transition: this.transition_type, duration: this.transitionTime }).start(0);	
			this.images[itemNum].get('tween', {property: 'opacity', link: 'cancel', transition: this.transition_type, duration: this.transitionTime }).start(1);	
			this.active_image = itemNum;
		};
	},
	
	increment: function(){
	    this.itemNum = this.itemNum + this.direction;
		if ( this.itemNum >= this.numItens ) { this.itemNum = 0;};
	    if ( this.itemNum < 0 ) { this.itemNum = this.numItens-1; };	
	},

	start: function(){
		this.stopLoop();
		this.resetLoop();
		this.isPaused = false;
		this.transition_type = this.options.transition_type;
		if ((this.previous_direction == this.direction) && (this.options.direction != this.previous_direction ) ) {
			this.direction = this.options.direction;
			this.previous_direction = this.direction;
			this.increment();
		};
		if (this.direction != this.options.direction) {
			this.direction = this.options.direction;
			this.previous_direction = this.direction;	
		};
		this.transitionTime = this.options.transitionTime;
		this.startLoop(this.options.slideTimer);
	},
	
	stop: function(){
		if (!this.isPaused){
			this.stopLoop();
			this.resetLoop();
			this.isPaused = true;
		};
	},
	
	iniciate_scroll_controls: function(){
		var slides_container_size = this.slides_container.getSize();
		scroll_width = slides_container_size.x;
		scroll_height = (this.slide_height)/3;
		scroll_margin = slides_container_size.y - scroll_height;
		var self = this;
		this.scrool_up = new Element('div', {
			 			'class': 'vcaroussel_scroll_button vcaroussel_scroll_up',
					    'styles': { 'width': scroll_width+'px', 'height': scroll_height+'px'},
						'events': { 'mouseenter': function(){self.scroll(-1); }, 'mouseleave': function(){ self.isPaused=false; self.stop(); } }
						});	
		this.scrool_down = new Element('div', {
						'class': 'vcaroussel_scroll_button vcaroussel_scroll_down',
					    'styles': { 'width': scroll_width+'px', 'height': scroll_height+'px', 'margin-top':scroll_margin+'px' },
						'events': { 'mouseenter': function(){ self.scroll(1); }, 'mouseleave': function(){ self.isPaused=false; self.stop(); } }
						});
		this.scrool_up.inject(this.slides_container,'top');				
		this.scrool_down.inject(this.slides_container,'top');
	}	
	
});