/**
 * jQuery plugin that renders the Granditalia Insprirationbar
 * Depends on the SmoothDivScroller plugin
 *
 * @author NoProtocol
 */

(function ($) {


	$.fn.inspirationbar = function () {
		var self = this;
		$(self).hide();
		$(window).load(function() { // Wait for all images to load...
			$(self).show('fade');
			$(self).smoothDivScroll({
				autoScroll: "onstart",
				autoScrollDirection: "endlessloopright",
				autoScrollStep: 1,
				autoScrollInterval: 25
			});
			repositonPopouts(self);
		});
		// Naar links scrollen
		$('.leftArrow, .rightArrow', self).hover(function () {
			$(self).smoothDivScroll("option", "autoScrollStep", 4);
			$(self).smoothDivScroll("option", "autoScrollInterval", 10);
			$(self).smoothDivScroll("option", "autoScrollDirection", $(this).data('direction'));
			$(self).smoothDivScroll("startAutoScroll");
		},function () {
			// Stop scroll
			$(self).smoothDivScroll("stopAutoScroll");
		});
		$('.leftArrow, .rightArrow', self).mousedown(function () {
			$(self).smoothDivScroll("option", "autoScrollStep", 12);
		});
		$('.leftArrow, .rightArrow', self).mouseup(function () {
			$(self).smoothDivScroll("option", "autoScrollStep", 4);
		});
	};

	// Default config
	var baseHeight = 110;

	// Private methods

	/**
	 * Resize the scollableArea and align the items in the middle.
	 *
	 * @param el  The SmoothDivScroll element. '#photo-slider'
	 */
	var repositonPopouts = function(el) {
		var maxHeight = 0;
		var minHeight = null;
		var items = $(".scrollableArea", el).children();
		items.each(function () {
			var newHeight = $(this).innerHeight();
			if (newHeight > maxHeight) {
				maxHeight = newHeight;
			}
			if (minHeight === null || newHeight < minHeight) {
				minHeight = newHeight;
			}
		});
		if ($(this).height() == maxHeight) {
			return; // Height already up to date
		}
		// Align <img> elements in the middle
		var maxOffset = 0;
		items.each(function (){
			var item = $(this);
			var itemHeight = item.innerHeight();
			var offset = Math.ceil((maxHeight - itemHeight) / 2);
			if (itemHeight >= baseHeight && offset > maxOffset) {
				maxOffset = offset;
			}
			item.css({marginTop: offset}); // Add margin
		});
		$(el).css({
			height: maxHeight,
			top: (0 - maxOffset)
		});
		$(" .dropshadow", el).css({
			top: maxOffset
		});
	};

//	{
//		$('#scrollRight').hover(function () {
//			$("div#photo-scroller").smoothDivScroll("option","autoScrollDirection","endlessloopright");
//			$("div#photo-scroller").smoothDivScroll("startAutoScroll");
//			popUpDiv.hide();
//		},function () {
//			// Stop scroll
//			$("div#photo-scroller").smoothDivScroll("stopAutoScroll");
//		});
//
//		$('#scrollLeft').hover(function () {
//			$("div#photo-scroller").smoothDivScroll("option","autoScrollDirection","endlessloopleft");
//			$("div#photo-scroller").smoothDivScroll("startAutoScroll");
//			popUpDiv.hide();
//		},function () {
//			// Stop scroll
//			$("div#photo-scroller").smoothDivScroll("stopAutoScroll");
//		});


})(jQuery);