/*
- Dont bind/unbind in realtime, instead create a switch/controller which react to the state of the slide
- Have a central "onSlideClick"  controller which decides which "setFocus" needs to be done
	$(".slides").bind("click mouseover mouseout", function (e) {
			// find out if is current focus
			// find out which WAS in focus
			// find out what is state
			// find out event type

			// Determine WHICH setFocus is appropriate

			// Do a setFocus with the right "state"
	})
- Have only one element be animated with others which follow.
- Dont repeat selectors over and over, create scoped vars (mostly in steps)
- When a slide receives an order (normalState, hoverState, expandState) all the other become slave
- Add a focusedSlide variable, with a setFocus(newSlide, oldSlide, state) method  state = 'default' | 'hover' | 'expanded'
- setFocus become the one controlling the animations
- When new master takes over, previous anims stop
- Inside setFocus, use transition Handlers:
	transitions = {
		hover: function (master, slaves, previsouFocus) {
		},
		expand: function (master, slaves, previsouFocus) {
		},
		normal: function (master, slaves, previsouFocus) {
		}
	}
- Use objects


*/

(function ($) {

	var height = 205;        // pixels
	var hover_width = 294;   // pixels
	var opened_width = 560;  // pixels


	/*  easing and duration  */
	var open_widget_ease = "easeInOutExpo";
	var open_widget_duration = 300;
	var hover_ease = "easeOutExpo";
	var hover_duration = 300;
	var open_ease = "easeOutExpo";
	var open_duration = 500;
	var count, container_width, default_volet_width, collapse_width, fullcollapse_width;


	var focusedSlide = {
		element: null,
		state: "normalState"
	};

	jQuery.extend(jQuery.easing,
			{
				easeInOutExpo: function (x, t, b, c, d) {
					if (t == 0) return b;
					if (t == d) return b + c;
					if ((t /= d / 2) < 1) return c / 2 * Math.pow(2, 10 * (t - 1)) + b;
					return c / 2 * (-Math.pow(2, -10 * --t) + 2) + b;
				},
				easeOutExpo: function (x, t, b, c, d) {
					return (t == d) ? b + c : c * (-Math.pow(2, -10 * t / d) + 1) + b;
				}
			}
	);

	jQuery.easing.def = 'easeInOutExpo';
	function Accordion(target, opener_div_selector, closer_div_selector) {
		var accordion = this;

		this.ui = {};

		this.init = function () {


			$(function() {
				accordion.start();

				var open_widget = function () {
					$(target).stop().animate({ height:height + "px" }, { duration: open_widget_duration, specialEasing: { height: open_widget_ease }});
					$(target).addClass("active");
					$(closer_div_selector).show();
					$(opener_div_selector).hide();
				};

				var close_widget = function () {
					$(target).stop().animate({ height:"0px" }, { duration: open_widget_duration, specialEasing: { height: open_widget_ease }});
					$(target).removeClass("active");
					$(opener_div_selector).show();
					$(closer_div_selector).hide();
				};

				$(opener_div_selector + ", " + closer_div_selector).bind("click",
						function (e) {
							e.preventDefault();
							if ($(target).is(".active")) {
								close_widget();
							} else {
								open_widget();
							}
						}
				);

				open_widget();

			});


		};

		this.start = function () {
			this.bindUI();
			$.fx.off = true;
			this.setFocus(this.ui.$slides.first(), null, "normalState");
			$.fx.off = false;
		};

		this.bindUI = function () {
			var ui = this.ui;
			var $root = this.$root = $(target);
			this.ui.$slides = $root.find(".widget_content_container");
			this.ui.$animated = $root.find(".animated");
			var $slides = this.ui.$slides;

			count = $slides.length;
			container_width = $(target).width() +(count*2); 
			default_volet_width = $(target).width() / count;
			collapse_width = ( container_width - hover_width ) / ( count - 1 );
			fullcollapse_width = ( $(target).width() - opened_width) / ( count - 1 );
			
			this.ui.$slides.find('h4').css('maxWidth',default_volet_width-5);
			
			
			$(target).css("overflow", "hidden");
			$(target).children("#widget_container").width(container_width + 100 + "px");
	

			$slides.each(
					function (index) {
						$(this).attr('data', index + 1);
					}
			);

			//fix for ie
			$(target).children(".widget_image_container").html("x");
			$(target).children(".widget_backimage_container").html("x");
			$(target).children(".widget_frontimage_container").html("x");
			$(target).children(".widget_openimage_container").html("x");


			this.ui.$slides.bind("click", function(e) {
				accordion.slideController(this, "open");
			});

			this.ui.$slides.hoverIntent({
				timeout: 15, // number = milliseconds delay before onMouseOut
				over: function (e) {
					accordion.slideController(this, "hover");
				},
				out: function (e) {
					accordion.slideController(this, "blur");
				}
			});

		};

		this._slideController = function(master, action) {
			// find out which slide is the target
			// find out if is current focus
			// find out which WAS in focus
			// find out what is state
			// find out event type

			// Determine WHICH setFocus is appropriate

			// Do a setFocus with the right "state"
			//(normalState, hoverState, expandState)
      		


			
			var $master = $(master);
			var state = focusedSlide.state;
			var $previous = $(focusedSlide.element);
			if (action === "open" ) {
				if (!(state === "expandState")) {
					accordion.setFocus($master, $previous, "expandState");	
				} 
			} else if (action === "collapse" ){
				accordion.setFocus($master, $previous, "normalState");
			} else if (action === "blur" ){
				if (state !== "expandState" ) {
					accordion.setFocus($master, $previous, "normalState");
				}
			} else if (action === "hover" ){
				// Place in "hovered" state if no slide is currently open
				
				if (state !== "expandState"  && !( state === "hoverState" && $($master).attr("data") === $previous.attr("data") ) ) {
					accordion.setFocus($master, $previous, "hoverState");
				}
			}
		};

		this.slideController = _.debounce(this._slideController, 20);


		this.setFocus = function($master, $previous, state) {
			
			
			
			var $slaves;
			$slaves = accordion.ui.$slides.not($master);
			this.transition(state, $master, $slaves, $previous);
			if (state !== "normalState") {
				focusedSlide.element = $master;
			} else {
				focusedSlide.element = null;
			}
			focusedSlide.state = state;
		};

		this.transition = function(state, master, slaves, previous) {
			this.transitions[state](master, slaves, previous, focusedSlide.state);
		};

		this.transitions = {
			hoverState: function (master, $slaves, previous, previousState) {

				var $previous = $(previous);
				var $master = $(master);
				var $slides = accordion.ui.$slides;
				
				
				// master elements
				var $master_image_container = $master.find(".widget_image_container");
				var $master_step2 = $master.find(".step2");
				var $master_backImage_container = $master.find(".widget_backimage_container");
				var $master_frontImage_container = $master.find(".widget_frontimage_container");
				var $master_h4 = $master.find("h4");
				var $master_step2_a = $master.find(".step2").find("a");
				
				// slave elements
				if ($previous.length) {
					var $slave_image_container_not_hover = $previous.find(".widget_image_container");
					var $slave_h4_not_hover = $previous.find("h4");
				} else {
					var $slave_image_container_not_hover = $slaves.find(".widget_image_container");
					var $slave_h4_not_hover = $slaves.find("h4");
				}
				var $previous_backImage_container = $previous.find(".widget_backimage_container");
				var $previous_frontImage_container = $previous.find(".widget_frontimage_container");

				
				$slides.css({"cursor":"pointer"});
				$animated = accordion.ui.$animated;
				$animated.width($master.width());
				
				$animated.stop(true,true).animate(
						{
							width: hover_width + "px"
						}, {
							duration: hover_duration,
							specialEasing: {
								width: hover_ease
							},
							step: function(now, fx) {

								positionSlides(now, hover_width, $slides, $master, $slaves, $(previous));

								var percent = (now - fx.end) * 100 / (fx.start - fx.end);
								var invPercent = Math.abs((100 - percent));

								$master_image_container.css("backgroundPosition", "-" + percent + "px 0");
								$master_backImage_container.css("backgroundPosition", "-" + percent + "px 0");

								$master_frontImage_container.css({
									"backgroundPosition":"-" + percent + "px 0",
									"opacity": (invPercent / 100),
									"filter": "alpha(opacity=" + (invPercent) + ")"
								});
								$master_h4.css({
									"opacity":  ((invPercent / 100) + 0.5),
									"filter": "alpha(opacity=" + (invPercent + 50) + ")"
								});
								$master_step2.css("left", "-" + percent + "px");
								
								$master_step2_a.css({
									"opacity":  ((invPercent / 100) ),
									"filter": "alpha(opacity=" + (invPercent) + ")"
								});
								
								
								
								var $previous_step2 = $(previous).find(".step2");

								blurSlaves(percent, $slave_image_container_not_hover, $slave_h4_not_hover, $previous_step2);
								function blurSlaves(percent, $slave_image_container_not_hover, $slave_h4_not_hover, $slave_step2) {
									$slave_image_container_not_hover.css({
										"opacity": (percent / 100),
										"filter": "alpha(opacity=" + (percent) + ")"
									});
									$slave_h4_not_hover.css({
										"opacity":  ((percent / 100) + 0.5),
										"filter": "alpha(opacity=" + (percent + 50) + ")"
									});
									$previous_backImage_container.css("backgroundPosition", "-" + (Math.abs((100 - percent))) + "px 0");
									$previous_frontImage_container.css({
										"backgroundPosition": "-" + (Math.abs((100 - percent))) + "px 0",
										"opacity": (Math.abs((percent) / 100)),
										"filter": "alpha(opacity=" + (Math.abs((percent))) + ")"
									});

									$slave_step2.css("left", "-" + (Math.abs((100 - percent))) + "px");

								}

							},
							complete: function() {
								
								var percent = 0;
								var invPercent = 100;
								
								
								$master_image_container.css("backgroundPosition", "-" + percent + "px 0");
								$master_backImage_container.css("backgroundPosition", "-" + percent + "px 0");

								$master_frontImage_container.css({
									"backgroundPosition":"-" + percent + "px 0",
									"opacity": (invPercent / 100),
									"filter": "alpha(opacity=" + (invPercent) + ")"
								});
								$master_h4.css({
									"opacity":  ((invPercent / 100) + 0.5),
									"filter": "alpha(opacity=" + (invPercent + 50) + ")"
								});
								$master_step2.css("left", "-" + percent + "px");
								
								$master_step2_a.css({
									"opacity":  "1",
									"filter": "alpha(opacity=100)"
								});
								
								
								var $previous_step2 = $(previous).find(".step2");

								blurSlaves(percent, $slave_image_container_not_hover, $slave_h4_not_hover, $previous_step2);
								function blurSlaves(percent, $slave_image_container_not_hover, $slave_h4_not_hover, $slave_step2) {
									$slave_image_container_not_hover.css({
										"opacity": (percent / 100),
										"filter": "alpha(opacity=" + (percent) + ")"
									});
									$slave_h4_not_hover.css({
										"opacity":  ((percent / 100) + 0.5),
										"filter": "alpha(opacity=" + (percent + 50) + ")"
									});
									$previous_backImage_container.css("backgroundPosition", "-" + (Math.abs((100 - percent))) + "px 0");
									$previous_frontImage_container.css({
										"backgroundPosition": "-" + (Math.abs((100 - percent))) + "px 0",
										"opacity": (Math.abs((percent) / 100)),
										"filter": "alpha(opacity=" + (Math.abs((percent))) + ")"
									});

									$slave_step2.css("left", "-" + (Math.abs((100 - percent))) + "px");

								}
								
								
								positionSlides(hover_width, hover_width, $slides, $master, $slaves, $(previous));
								
								$animated.css("width", hover_width + "px");
							}
						}
				);

			},
			expandState: function (master, slaves, previous, previousState) {

				
				var done = 0;
				var $previous = $(previous);
				var $master = $(master);
				var $slaves = $(slaves);
				var $slides = accordion.ui.$slides;
				
				$slaves.addClass("closed");
				$master.addClass("opened");
				
				var $master_openimage_container = $master.find(".widget_openimage_container");
				var $master_backimage_container = $master.find('.widget_backimage_container');
				var $master_frontimage_container = $master.find('.widget_frontimage_container');
				var $master_image_container = $master.find('.widget_image_container');

				var $slave_backimage_container = $slaves.find('.widget_backimage_container');
				var $master_step3 = $master.find(".step3");
				$master_backimage_container.hide();
				$master_frontimage_container.hide();
				$master_image_container.hide();
				$slave_backimage_container.show();
				$master_step3.show();
				
				var $slaves_close = $slaves.find(".close");
				$slaves_close.remove();
				

				if ($master.is($previous) || !$previous.length) {
					var $slave_openimage_container = $slaves.find('.widget_openimage_containerfsdfdfs h');
					var $slave_step3 = $slaves.find('.step3');

					var $previous_step2 = $previous.find("NOTHING");
					var $previous_h4 = $previous.find("NOTHING");

					var $master_step2 = $master.find(".step2");
					var $master_h4 = $master.find("h4");
				} else {
					var $slave_openimage_container = $previous.find('.widget_openimage_container');
					var $slave_step3 = $previous.find('.step3');

					var $previous_step2 = $previous.find(".step2");
					var $previous_h4 = $previous.find("h4");

					var $master_step2 = $master.find(".step2");
					var $master_h4 = $master.find("h4");
				}
				
				var $previous_backimage_container = $previous.find(".widget_backimage_container");
				var $previous_image_container = $previous.find(".widget_image_container"); 
				var $previous_frontimage_container = $previous.find(".widget_frontimage_container"); 
				
				
				var $slave_image_container = $slaves.find(".widget_image_container"); 
				
				if ( $slave_image_container.css("opacity") === 0 ){
					$slave_image_container = $slaves.find("nothing"); 
				}
				
				
				var $all_content_container_step2_a = accordion.ui.$slides.find(".step2 a");
				var $master_step2_a = $master.find(".step2 a");
				$master_step2_a.css({
									"opacity": "0",
									"filter": "alpha(opacity=0)"
								});
				
				$slides.css({"cursor":"default"});
				
				$animated = accordion.ui.$animated;
				$animated.width($master.width());
				$animated.stop(true,true).animate({
							width: opened_width + "px"
						}, {
							duration: open_duration,
							specialEasing: {
								width: open_ease
							},
							step: function(now, fx) {

								positionSlides(now, opened_width, $slides, $master, slaves, $(previous));

								var percent = (now - fx.end) * 100 / (fx.start - fx.end);
								var invPercent = Math.abs((100 - percent));

								$slaves.css("width", fullcollapse_width + ( percent / 100 * (collapse_width - fullcollapse_width) ) + "px");
								$master.find(".widget_openimage_container").css({
									"opacity": (Math.abs((100 - percent) / 100)),
									"filter": "alpha(opacity=" + (Math.abs(100 - percent)) + ")"
								});

								$master_step3.css({
									"opacity": (invPercent / 100),
									"top": "-" + percent * 3 + "px"
								});

								$previous_step2.css({
									"opacity": (percent / 100),
									"filter": "alpha(opacity=" + (percent) + ")"
								});
								$previous_h4.css({
									"opacity": (((percent / 100) + 0.5) >= 1) ? 1 : ((percent / 100) + 0.5),
									"filter": "alpha(opacity=" + ((percent + 50) >= 100) ? 100 : (percent + 50) + ")"
								});
								
								$slave_image_container.css({
									"opacity": (percent / 100),
									"filter": "alpha(opacity=" + (percent) + ")"
								});
								
								$previous_backimage_container.css("backgroundPosition", "-" + (invPercent) + "px 0");

								$master_step2.css({
									"left": (percent) + "px",
									"opacity": (invPercent / 100),
									"filter": "alpha(opacity=" + (invPercent) + ")"
								});

								$master_h4.css({
									"opacity": (((invPercent / 100) + 0.5) >= 1) ? 1 : ((invPercent / 100) + 0.5),
									"filter": "alpha(opacity=" + ((invPercent + 50) >= 100) ? 100 : (invPercent + 50) + ")"
								});


								$slave_openimage_container.css({
									"opacity": (percent / 100),
									"filter": "alpha(opacity=" + (percent) + ")"
								});
								$slave_step3.css({
									"opacity": (percent / 100),
									"filter": "alpha(opacity=" + (percent) + ")"
								});
								
								$all_content_container_step2_a.css({
									"opacity": (percent / 100),
									"filter": "alpha(opacity=" + (percent) + ")"
								});
								
							},
							complete: function() {
									
									
									

									var percent = 0;
									var invPercent = 100;
	
									$slaves.css("width", fullcollapse_width + ( percent / 100 * (collapse_width - fullcollapse_width) ) + "px");
									$master.find(".widget_openimage_container").css({
										"opacity": (Math.abs((100 - percent) / 100)),
										"filter": "alpha(opacity=" + (Math.abs(100 - percent)) + ")"
									});
	
									$master_step3.css({
										"opacity": (invPercent / 100),
										"top": "-" + percent * 3 + "px"
									});
	
									$previous_step2.css({
										"opacity": (percent / 100),
										"filter": "alpha(opacity=" + (percent) + ")"
									});
									$previous_h4.css({
										"opacity": (((percent / 100) + 0.5) >= 1) ? 1 : ((percent / 100) + 0.5),
										"filter": "alpha(opacity=" + ((percent + 50) >= 100) ? 100 : (percent + 50) + ")"
									});
									
									$slave_image_container.css({
										"opacity": (percent / 100),
										"filter": "alpha(opacity=" + (percent) + ")"
									});
									
									$previous_backimage_container.css("backgroundPosition", "-" + (invPercent) + "px 0");
	
									$master_step2.css({
										"left": (percent) + "px",
										"opacity": (invPercent / 100),
										"filter": "alpha(opacity=" + (invPercent) + ")"
									});
	
									$master_h4.css({
										"opacity": (((invPercent / 100) + 0.5) >= 1) ? 1 : ((invPercent / 100) + 0.5),
										"filter": "alpha(opacity=" + ((invPercent + 50) >= 100) ? 100 : (invPercent + 50) + ")"
									});
	
	
									$slave_openimage_container.css({
										"opacity": (percent / 100),
										"filter": "alpha(opacity=" + (percent) + ")"
									});
									$slave_step3.css({
										"opacity": (percent / 100),
										"filter": "alpha(opacity=" + (percent) + ")"
									});
									
									$all_content_container_step2_a.css({
										"opacity": (percent / 100),
										"filter": "alpha(opacity=" + (percent) + ")"
									});
									
									
									
									
									
									$animated.css("width", opened_width + "px");
									
									var closeLink = $('<a class="close" href="#">Close</a>');
									closeLink.click(function (e) {
										e.preventDefault();
										//accordion.setFocus($master, null, "normalState");
										accordion.setFocus($master, $previous, "normalState");
										$slaves.removeClass("closed");
										$master.removeClass("opened");
										$(this).remove();
										return false;
									});
									$master.children(".widget_openimage_container").append(closeLink);
								
							}} 
				);


			},
			normalState: function (master, slaves, previous, previousState) {


				$(master).removeClass("hover");

				var $master = $(master);
				var $previous = $(previous);
				var $slides = accordion.ui.$slides;

				var $master_image_container = $master.find('.widget_image_container');
				var $master_backimage_container = $master.find('.widget_backimage_container');
				var $master_frontimage_container = $master.find('.widget_frontimage_container');
				var $master_step2 = $master.find('.step2');
				var $master_openimage_container = $master.find('.widget_openimage_container');
				var $master_step3 = $master.find('.step3');

				if (previousState === "expandState") {
					$master_backimage_container.show();
					$master_image_container.show();
					$master_frontimage_container.show();
					
				}
				
				var $slave_backImage_container = $slides.find(".widget_backimage_container");
				var $all_widget_image_container = $slides.not($master).find(".widget_image_container");
				$slave_backImage_container.css("backgroundPosition", "-" + 100 + "px 0");
				$all_widget_image_container.css("backgroundPosition", "-" + 100 + "px 0");

				var $not_this_h4 = $slides.find("h4");
				var $master_step2_a = $master.find(".step2 a");
				

				$animated = accordion.ui.$animated;
				$animated.width($master.width());
				
				$animated.stop(true,true).animate({
							width: default_volet_width + "px"
						}, {
							duration: hover_duration,
							specialEasing: {
								width: hover_ease
						},
							step: function(now, fx) {
								positionSlides(now, default_volet_width, $slides, $master, slaves, $(previous));

								var percent = (now - fx.end) * 100 / (fx.start - fx.end);
								var invPercent = Math.abs((100 - percent));

								$master_image_container.css("backgroundPosition", "-" + (Math.abs(100 - percent)) + "px 0");
								$master_backimage_container.css({
									"backgroundPosition": "-" + (invPercent) + "px 0"
								});
								$master_image_container.css({
									"opacity": (invPercent / 100),
									"filter": "alpha(opacity=" + (invPercent) + ")"
								});
								$master_frontimage_container.css({
									"backgroundPosition": "-" + (invPercent) + "px 0",
									"opacity": (percent / 100),
									"filter": "alpha(opacity=" + (Math.abs(percent)) + ")"
								});

								$master_step2.css({
									"left": "-" + (invPercent) + "px",
									"opacity": (invPercent / 100),
									"filter": "alpha(opacity=" + (Math.abs(invPercent)) + ")"
									
								});

								$all_widget_image_container.css({
									"opacity": (invPercent / 100),
									"filter": "alpha(opacity=" + invPercent + ")"
								});

								$not_this_h4.css({
									"opacity": (((invPercent / 100) + 0.5) >= 1) ? 1 : ((invPercent / 100) + 0.5),
									"filter": "alpha(opacity=" + ((invPercent + 50) >= 100) ? 100 : (invPercent + 50) + ")"
								});
								
								if (previousState === "expandState") {

									$master_step3.css({
										"opacity": (percent / 100),
										"filter": "alpha(opacity=" + (percent) + ")"
									});
									
									$master_openimage_container.css({
										"opacity": (percent / 100),
										"filter": "alpha(opacity=" + (percent) + ")"
									});
									
									
									
								}
								

							},
							complete: function() {
								
								

								var percent = 0;
								var invPercent = 100;

								$master_image_container.css("backgroundPosition", "-" + (Math.abs(100 - percent)) + "px 0");
								$master_backimage_container.css({
									"backgroundPosition": "-" + (invPercent) + "px 0"
								});
								$master_image_container.css({
									"opacity": (invPercent / 100),
									"filter": "alpha(opacity=" + (invPercent) + ")"
								});
								$master_frontimage_container.css({
									"backgroundPosition": "-" + (invPercent) + "px 0",
									"opacity": (percent / 100),
									"filter": "alpha(opacity=" + (Math.abs(percent)) + ")"
								});

								$master_step2.css({
									"left": "-" + (invPercent) + "px",
									"opacity": (invPercent / 100),
									"filter": "alpha(opacity=" + (Math.abs(invPercent)) + ")"
								});

								$all_widget_image_container.css({
									"opacity": (invPercent / 100),
									"filter": "alpha(opacity=" + invPercent + ")"
								});

								$not_this_h4.css({
									"opacity": (((invPercent / 100) + 0.5) >= 1) ? 1 : ((invPercent / 100) + 0.5),
									"filter": "alpha(opacity=" + ((invPercent + 50) >= 100) ? 100 : (invPercent + 50) + ")"
								});
								
								if (previousState === "expandState") {

									$master_step3.css({
										"opacity": (percent / 100),
										"filter": "alpha(opacity=" + (percent) + ")"
									});
									$master_step3.hide();
									$master_openimage_container.css({
										"opacity": (percent / 100),
										"filter": "alpha(opacity=" + (percent) + ")"
									});
									
									
									
								}
								
								
								positionSlides(default_volet_width, default_volet_width, $slides, $master, slaves, $(previous));
								
								$animated.css("width", default_volet_width + "px");
							}
						}
				);
			}
		};

		this.init();
	}

	function positionSlides(width, targetWidth, $slides, $master, $slaves, $previous) {
		var total = container_width;
		
		var slavesWidth;
		if ($previous.length && !$master.is($previous)) {
		
			slavesWidth = parseInt((total - targetWidth) / (parseInt(count)-1));
		} else {
			slavesWidth = parseInt((total - width) / (parseInt(count)-1));
		}
		
		var offset = 0;
		var itemWidth;
		var offsets = [];
		var slide;
		
		for (var i = 0; i < $slides.length; i = i + 1) {
			slide = $slides[i];
			var isMaster = $master.is(slide);
			var isPrevious = $previous.is(slide);
			
			if ($previous.length) {
				if (isMaster) {
					itemWidth = width;
				} else if (isPrevious) {
					itemWidth = (total - (slavesWidth * (parseInt(count)-1))) - width+2;
				} else {
					itemWidth = (parseInt(slavesWidth)-2);
				}
			} else {
				if (isMaster) {
					itemWidth = width;
				} else {
					itemWidth = (parseInt(slavesWidth)-2);
				}
			}
			
			$(slide).css({
				"left": offset ,
				"width": itemWidth  
			});
			offset = offset + itemWidth;			
		}
	}

	window.Accordion = Accordion;

})(jQuery);