;(function($) {

	$.fn.jslider = function(o) {
			return this.each(function() {
					new $js(this, o);
			});
	};
	
	// Default configuration properties.
	var defaults = {
			movingDistance: 204,
			curWidth: 214,
			curImgWidth: 200,
			curTitleSize: "20px",
			curParSize: "15px",
			interval: 300
	};
	
	$.jslider = function(e, o) {
		this.options    = $.extend({}, defaults, o || {});
		
		this.container  = $(e);
		this.panels 		= $('.scrollContainer > div',this.container);
		this.clip       = $('.scrollContainer',this.container);
		
		this.options['regWidth'] 				= this.panels.width();
		this.options['regImgWidth']			= $('img',this.panels).width();
		this.options['regTitleSize']		= $('h2',this.panels).css("font-size");
		this.options['regParSize']			= $('p',this.panels).css("font-size");
		
		this.buttonNext = $('.scrollButtons.right',this.container);
		this.buttonPrev = $('.scrollButtons.left',this.container);

		this.funcNext   = function() { self.next(); };
		this.funcPrev   = function() { self.prev(); };
		
		this.currentlyMoving = false;
		
		var self = this;
		
		if ($.browser.safari) {
			$(window).bind('load', function() { self.setup(); });
		} else {
			this.setup();
		}
		
	}
	
	var $js = $.jslider;
	$js.fn = $js.prototype = {
        jslider: '0.0.1'
	};

	$js.fn.extend = $.extend;
	
	$js.fn.extend({

        setup: function() {
					this.currentlyMoving = false;
					this.clip.css('width', (this.panels[0].offsetWidth * this.panels.length) + 100 ).css('left', "0px");
					
					this.panels.css({'float' : 'left','position' : 'relative'});
					this.curPanel = 1;
					this.growBigger($(this.panels.get(this.curPanel)));
					$(this.panels.get(this.curPanel+1)).bind('click', this.funcNext);
					$(this.panels.get(this.curPanel-1)).bind('click', this.funcPrev);
					
					this.buttonNext.bind('click', this.funcNext);
					this.buttonPrev.bind('click', this.funcPrev);
        },
				
				next: function() {
					if ($(':animated',this.container).length == 0 && this.curPanel < this.panels.length - 1) {
						var nextPanel    = this.curPanel + 1;
						var leftValue    = this.clip.css("left");
						var movement	 = parseFloat(leftValue, 10) - this.options['movingDistance'];
					
						this.clip
							.stop()
							.animate({
								"left": movement
							},this.options['interval']);
						
						this.returnToNormal($(this.panels.get(this.curPanel)));
						this.growBigger($(this.panels.get(nextPanel)));
						
						this.curPanel = nextPanel;
						
						//remove all previous bound functions && go forward
						$(this.panels.get(this.curPanel+1)).unbind().bind('click', this.funcNext);
						
						//remove all previous bound functions &&	go back											
						$(this.panels.get(this.curPanel-1)).unbind().bind('click', this.funcPrev);
						
						//remove all previous bound functions
						$(this.panels.get(this.curPanel)).unbind()
					}
					
        },
				prev: function() {
					if ($(':animated',this.container).length == 0 && this.curPanel > 0) {
						var nextPanel    = this.curPanel - 1;
						var leftValue    = this.clip.css("left");
						var movement	 = parseFloat(leftValue, 10) + this.options['movingDistance'];
					
						this.clip
							.stop()
							.animate({
								"left": movement
							},this.options['interval']);
						
						this.returnToNormal($(this.panels.get(this.curPanel)));
						this.growBigger($(this.panels.get(nextPanel)));
						
						this.curPanel = nextPanel;
						
						//remove all previous bound functions && go forward
						$(this.panels.get(this.curPanel+1)).unbind().bind('click', this.funcNext);
						
						//remove all previous bound functions &&	go back											
						$(this.panels.get(this.curPanel-1)).unbind().bind('click', this.funcPrev);
						
						//remove all previous bound functions
						$(this.panels.get(this.curPanel)).unbind()
					}
        },
				scroll: function(i, a) {
            if (this.locked || this.animating)
                return;

            this.animate(this.pos(i), a);
        },
				growBigger: function(element) {
					if(this.options['curWidth'] != this.options['regWidth'])
					{
						$(element)
							.animate({ width: this.options['curWidth'] },this.options['interval'])
							.find("img")
							.animate({ width:  this.options['curImgWidth'] },this.options['interval'])
								.end()
							.find("h2")
							.animate({ fontSize:  this.options['curTitleSize'] },this.options['interval'])
							.end()
							.find("p")
							.animate({ fontSize: this.options['curParSize'] },this.options['interval']);
					}
				},
				returnToNormal: function(element) {
					if(this.options['curWidth'] != this.options['regWidth'])
					{
						$(element)
							.animate({ width: this.options['regWidth'] },this.options['interval'])
							.find("img")
							.animate({ width: this.options['regImgWidth'] },this.options['interval'])
								.end()
							.find("h2")
							.animate({ fontSize: this.options['regTitleSize'] },this.options['interval'])
							.end()
							.find("p")
							.animate({ fontSize: this.options['regParSize'] },this.options['interval']);
					}
				}
    });

	
})(jQuery);