﻿(function($) {

	$.fn.simpleCarousel = function(options) {
		var settings = { VisibleItems: 4 };

		return this.each(function() {

			if (options) {
				$.extend(settings, options);
			}

			var $List = $(this);
			var $Slides = $List.children('li');

			if ($List.is('ul') && ($Slides.size() > 0)) {

				$List.addClass('simpleCarouselList');
				$Container = $('<div class="simpleCarouselBox" />');
				$Frame = $('<div class="simpleCarouselFrame" />');

				$List.after($Container);
				$Container.append($Frame);
				$Frame.append($List);

				var itemWidth = $Slides.first().outerWidth(true);
				var itemHeight = $Slides.first().outerHeight(true);
				var frameWidth = itemWidth * settings.VisibleItems;
				var listWidth = itemWidth * $Slides.size();

				$List.css('width', listWidth + 'px');
				$Frame.css('width', frameWidth + 'px');
				$Frame.css('height', itemHeight + 'px');

				var $ControlsBox = $('<div class="simpleCarouselControls" />');
				var $NextButton = $('<div class="nextButton" />');
				var $PrevButton = $('<div class="prevButton" />');

				$ControlsBox.append($NextButton);
				$ControlsBox.append($PrevButton);
				$Container.append($ControlsBox);

				var listOffset = 0;

				function setButtons() {
					$NextButton.removeClass('disabled');
					$PrevButton.removeClass('disabled');

					if (listOffset + frameWidth >= listWidth)
						$NextButton.addClass('disabled');

					if (listOffset <= 0)
						$PrevButton.addClass('disabled');
				}

				setButtons();

				$NextButton.click(function() {
					if (!$(this).hasClass('disabled')) {
						if (listOffset + frameWidth + frameWidth >= listWidth) {
							listOffset = listWidth - frameWidth;
						}
						else {
							listOffset = listOffset + frameWidth;
						}
						setButtons();
						$List.animate({ left: listOffset * -1 + 'px' });
					}
				});

				$PrevButton.click(function() {
					if (!$(this).hasClass('disabled')) {
						if (listOffset - frameWidth <= 0) {
							listOffset = 0;
						}
						else {
							listOffset = listOffset - frameWidth;
						}
						setButtons();
						$List.animate({ left: listOffset * -1 + 'px' });
					}
				});
			}

		});
	};

})(jQuery);

