/*******************************\
|								|
|   vSwitch Plugin - V 1.0	    |
|	- - - - - - - - - - - -		|
|     Developed by Vexard		|
|       www.Vexard.com			|
|								|
\*******************************/

(function($) {
	
	$.fn.vSwitch = function(options) {

		// Default Options
		var defaults  = {
			sWidth : 200,
			bWidth : 317
		},

		options = $.extend(defaults , options);
		
		var Core = $(this);
		
		$(".Banners", Core).prepend('<div class="Bg1"></div><div class="Bg2"></div>');
		$(".Banner:first", Core).addClass('Active').css({width: options.bWidth+"px", marginTop: "0px", right: "0px"});
		$(".Title", Core).html( $(".Active", Core).parent().find("span").html() );
		
		var loop = 1;
		$(".Banner", Core).each(function(){
			$(this).addClass("item" + loop);
			loop++;
		});
		
		loop = 1;
		$(".Buttons li", Core).each(function(){
			$(this).addClass("item" + loop);
			loop++;
		});
		
		$(".Buttons li", Core).click(function(){
			$(".Bg1", Core).css({right: "0px"});
			$(".Bg2", Core).css({right: "0px"});
			
			$(".Bg1", Core).animate({right: "-500px"}, 1500);
			$(".Bg2", Core).animate({right: "-1000px"}, 1500);
			
			$(".Active", Core)
			.animate({right: "100px", width: options.sWidth+"px", marginTop: "54px"}, 300)
			.animate({right: "-"+options.bWidth+"px"}, 500)
			.removeClass("Active");
			
			var Class = $(this).attr("class");
			
			$(".Banners").find("."+Class)
			.animate({right: "50px"}, 1100)
			.animate({right: "0px", width: options.bWidth + "px", marginTop: "0px"}, 400)
			.addClass("Active");
			
			$(".Title", Core).fadeOut().html( $(".Active", Core).parent().find("span").html() ).fadeIn();
		});
		
	}
		
})(jQuery);