/*
Script: 	
	JVSlider - The JV Slider Module allows to display the images with effects.

License:
	Proprietary - JoomlaVi Club members only

Copyright:
	Copyright (C) JoomlaVi. All rights reserved.
*/

var JVSlider = new Class({
	
	options:{
		arrows: 1,
		autoHideArrows: 0,
		keyboard: 1,
		width: false,
		height: false,
		cssProperty: 'marginLeft',
		itemsperclick: 1,
		duration: 750,		
		transition: Fx.Transitions.Sine.easeInOut,
		contentClass: '.jv-slider-content',		
		itemsClass: '.jv-slider-items',		
		arrowsClass: '.jv-slider-arrows'		
	},
	
	initialize: function(selector, options){
		var isRTL = $$('body')[0].hasClass('rtl');
		if(isRTL){
			this.options.cssProperty = 'marginRight';
		}
		this.setOptions(options);
		this.selector = $(selector);
		if(!this.selector) return;		
		this.setup();		
	},	
	
	setup: function(data){
		var that = this;
		if(!this.selector) return;
		this.contentElement = this.selector.getElement(that.options.contentClass);
		this.itemElement = this.selector.getElement(that.options.itemsClass);		
		var itemsSize = this.selector.getSize();
		this.options.width = this.options.width || itemsSize.x;
		this.options.height = this.options.height || itemsSize.y;
		this.selector.setStyles({
			'width': that.options.width,
			'height': that.options.height
		});
		this.items = this.itemElement.getChildren();
		this.len = this.items.length;
		if(!this.len) return;
		var itemWidth = 0;		
		this.items.each(function(item, index){
			itemWidth += item.getCoordinates().width + item.getStyle('margin-left').toInt() + item.getStyle('margin-right').toInt();
			if(index == 0){
				that.itemsshow = Math.ceil(that.options.width / itemWidth);
			}
		});
		this.itemElement.setStyle('width', itemWidth);
		if(this.len == this.itemsshow) return;
		this.items[0].addClass('first');
		this.items[this.len - 1].addClass('last');
		this.current = 0;		
		this.slider = new Fx.JVScroll(this.itemElement, {
			'duration': that.options.duration,
			'transition': that.options.transition,
			'link': false			
		}).toLeft(this.options.cssProperty);	
		if(that.options.arrows == 1){
			this.arrows = this.selector.getElement(that.options.arrowsClass);	
			this.initArrows();
		}
		if(that.options.keyboard == 1){
			this.initKeyboard();
		}
	},
	initArrows: function(){
		var that = this;
		if(this.options.autoHideArrows == 1){
			this.arrows.fx = new Fx.Morph(this.arrows, {link: false}).set({opacity:0});
			this.selector.addEvents({
				'mouseenter': function(){
					this.arrows.fx.cancel().start({opacity: 1});
				}.bind(this),
				'mouseleave': function(){
					this.arrows.fx.cancel().start({opacity: 0});
				}.bind(this)			
			});
		}
		else{
			this.arrows.fx = new Fx.Morph(this.arrows, {link: false}).set({opacity:1});
		}
		
		['prev', 'next'].each(function(func, index){
			if(that.arrows.getElement('.' + func)){
				that.arrows.getElement('.' + func).addEvent('click', function(){
					that[func].call(that);
				});
			}
		});		
	},
	initKeyboard: function(){
		var that = this;
		var keyupEvt = function(e){
			e = new Event(e);			
			switch(e.key){
				case 'left': 
					that.prev();
					break;
				case 'right': 
					that.next();
					break;				
			}
		}.bind(this);		
		document.addEvent('keyup', keyupEvt);				
	},
	prev: function(){			
		if(this.current - this.options.itemsperclick >= 0){
			this.current -= this.options.itemsperclick;
		}
		else{
			this.current = 0;
		}
		this.slider.toElement(this.options.cssProperty, this.items[this.current]);
	},
	next: function(){
		if(this.current + this.options.itemsperclick < this.len){
			this.current += this.options.itemsperclick;
		}
		else{
			this.current = this.len - 1;
		}
		this.current = Math.min(this.current, this.len - this.itemsshow);
		this.slider.toElement(this.options.cssProperty, this.items[this.current]);
	}
});


Fx.JVScroll = new Class({
	Extends: Fx,

	options: {
		offset: {x: 0, y: 0},
		wheelStops: true
	},

	initialize: function(element, options){
		this.element = this.subject = document.id(element);
		this.parent(options);

		if (typeOf(this.element) != 'element') this.element = document.id(this.element.getDocument().body);

		if (this.options.wheelStops){
			var stopper = this.element,
				cancel = this.cancel.pass(false, this);
			this.addEvent('start', function(){
				stopper.addEvent('mousewheel', cancel);
			}, true);
			this.addEvent('complete', function(){
				stopper.removeEvent('mousewheel', cancel);
			}, true);
		}
	},	
	
	set: function(){
		var now = Array.flatten(arguments);
		if (Browser.firefox) now = [Math.round(now[0]), Math.round(now[1])]; // not needed anymore in newer firefox versions
		this.element.scrollToRTL(this.cssProperty, now[0] + this.options.offset.x);
	},

	compute: function(from, to, delta){
		return [0, 1].map(function(i){
			return Fx.compute(from[i], to[i], delta);
		});
	},

	/*
	Property: scrollTo
		Scrolls the chosen element to the x/y coordinates.

	Arguments:
		x - the x coordinate to scroll the element to		
	*/

	scrollTo: function(cssProperty, x){
		if (this.timer && this.options.wait) return this;
		var el = this.element;
		if(cssProperty == 'marginLeft'){
			var values = {'marginLeft': x};
		}
		else{
			var values = {'marginRight': x};
		}
		values[cssProperty] += this.options.offset['x'];	
		return this.start([el.getStyle(cssProperty).toInt()], [-values[cssProperty]]);
	},	

	/*
	Property: toLeft
		Scrolls the chosen element to its maximum left.
	*/

	toLeft: function(cssProperty){	
		this.cssProperty = cssProperty;
		return this.scrollTo(cssProperty, 0);
	},

	/*
	Property: toElement
		Scrolls the specified element to the position the passed in element is found.

	Arguments:
		el - the $(element) to scroll the window to
	*/

	toElement: function(cssProperty, el){
		this.cssProperty = cssProperty;
		var parent = this.element.getPosition(this.options.overflown);
		var target = $(el).getPosition(this.options.overflown);
		return this.scrollTo(cssProperty, target.x - parent.x);
	},

	increase: function(){
		this.element.scrollToRTL(this.cssProperty, this.now[0], this.now[1]);
	}

});
JVSlider.implement(new Options);
JVSlider.implement(new Events);

Element.implement({

	scrollToRTL: function(cssProperty, x){
		this.setStyle(cssProperty, x);
	}
});