﻿function InitSlider(slideContainerId) {
	//scrollpane parts
	var scrollPane = $("#" + slideContainerId),
			scrollContent = $("#" + slideContainerId + " .scroll-content");

	//build slider
	var scrollbar = $("#" + slideContainerId + " .scroll-bar").slider({
		slide: function (event, ui) {
			if (scrollContent.width() > scrollPane.width()) {
				scrollContent.css("margin-left", Math.round(
						ui.value / 100 * (scrollPane.width() - scrollContent.width())
					) + "px");
			} else {
				scrollContent.css("margin-left", 0);
			}
		}
	});

	//append icon to handle
	var handleHelper = scrollbar.find(".ui-slider-handle")
		.mousedown(function () {
			scrollbar.width(handleHelper.width());
		})
		.mouseup(function () {
			scrollbar.width("100%");
		})
		.append("<span class='ui-icon ui-icon-grip-dotted-vertical'></span>")
		.wrap("<div class='ui-handle-helper-parent'></div>").parent();

	//change overflow to hidden now that slider handles the scrolling
	scrollPane.css("overflow", "hidden");

	//size scrollbar and handle proportionally to scroll distance
	function sizeScrollbar() {
		var remainder = scrollContent.width() - scrollPane.width();
		var proportion = remainder / scrollContent.width();
		var handleSize = scrollPane.width() - (proportion * scrollPane.width());
		scrollbar.find(".ui-slider-handle").css({
			width: handleSize,
			"margin-left": -handleSize / 2
		});
		handleHelper.width("").width(scrollbar.width() - handleSize);
	}

	//init scrollbar size
	setTimeout(sizeScrollbar, 10); //safari wants a timeout
}

var lastExpandedSlide;
function toggleSlideExpander(sender, slideItemId, sliderId) {
	if (slideItemId != lastExpandedSlide) {
		$(lastExpandedSlide).hide();
	}

	$(".slidingList .scroll-content-item").removeClass('active')
	$(".slidingList .arrow div").fadeOut();

	if (!$(slideItemId).is(':visible')) {
		$(slideItemId).fadeIn(1000,
			function () {
				//Scroll to the element
				$('html, body').animate({
					scrollTop: ($(slideItemId).offset().top - 355)
				}, 500);
				$(sliderId + " .arrow div").fadeIn(500);

				var leftPos = ($(sender).offset().left - 65 - ($(window).width() / 2 - 1263 / 2));

				$(sliderId + " .arrow div").css('left', leftPos);
				$(sender).addClass('active');
			}
		);
	}
	else {
		$(slideItemId).fadeOut(1000);
	}

	lastExpandedSlide = slideItemId;
}


function closeExandedItem(sender) {
	$(sender).closest('.expandableSliderItem').hide(1000);
}
