﻿(function($)
{
	// This script was written by Steve Fenton
	// http://www.stevefenton.co.uk/Content/Jquery-Side-Content/
	// Feel free to use this jQuery Plugin
	
	var LastHeight = 0;
	var LastScroll = 0;
	var Sliders = new Array();

	function Toggle (elem, barWidth, speed) {
		var isExpanded = jQuery(elem).hasClass("expanded");
		if (isExpanded) {
			jQuery(elem).animate({ width: "0px" }, speed).removeClass("expanded");;
		} else {
			jQuery(elem).animate({ width: barWidth + "px" }, speed).addClass("expanded");
		}
	};
	
	function AddSlider (id, width) {
		var length = Sliders.length;
		Sliders[length] = id + length;
		return id + length;
	};
	
	function AdjustHeight(elem) {
		var viewHeight = $(window).height();
		var scrollTop = $(window).scrollTop();
		if (viewHeight != LastHeight || scrollTop != LastScroll) {
			// Adjust the height and position
			LastHeight = viewHeight;
			LastScroll = scrollTop;
			jQuery(elem).css({ height: viewHeight + "px" }).parent().css({ top: scrollTop + "px" });
		}
		window.setTimeout(function() { AdjustHeight(elem) }, 500);
	};

	jQuery.fn.sidecontent = function (settings) {
	
		var config = {"speed": "slow", "opacity": "0.6", "side": "right" };
		if (settings) $.extend(config, settings);

		return this.each(function () {
		
			var barWidth = jQuery(this).width();
			var viewHeight = $(window).height();
			
			var sliderId = AddSlider("sidecontentslider");
			
			// Adjust the css on the original element and wrap it
			jQuery(this).css({
				display: "block",
				overflow: "auto",
				width: barWidth + "px",
				height: viewHeight + "px",
				float: "none"
			}).wrap("<div class=\"sidecontentslider\" id=\"" + sliderId + "\"></div>");
	
			// Prevent event propogation to the new parent element
			jQuery(this).click( function (event) {
				event.stopPropagation();
			});
	
			// Hide the new parent element, adjust and fade in
			if (config.side == "left") {
				jQuery("#" + sliderId).fadeTo(0, 0).css({
					position: "absolute",
					overflow: "hidden",
					top: "0px",
					left: "0px",
					width: "0px"
				}).fadeTo(config.speed, config.opacity);
			} else {
				jQuery("#" + sliderId).fadeTo(0, 0).css({
					position: "absolute",
					overflow: "hidden",
					top: "0px",
					right: "0px",
					width: "0px"
				}).fadeTo(config.speed, config.opacity);
			}
			
			// Event to toggle the slider
			jQuery("#" + sliderId).click(function () {
				Toggle(this, barWidth, config.speed);
			});
			
			AdjustHeight(this)
		});
		
		return this;
	};
})(jQuery);
