﻿/*
 * Javascript with functions that can be executed on any page
 * Requires JQuery 1.3
 */

//IE 6/7 just does not understand css :before, :after attributes.
function fixIEquotes()
{
	var blockQuotes = document.getElementsByTagName('blockquote');
	var openQuotes, closeQuotes;

	for (var i = 0; i < blockQuotes.length; i++)
	{
		openQuotes = document.createTextNode('"');
		closeQuotes = document.createTextNode('"');

		//blockQuotes[i].insertAdjacentElement('afterBegin', openQuotes);
		blockQuotes[i].insertAdjacentText('afterBegin', '" ');
		blockQuotes[i].appendChild(closeQuotes);
	}
}


// makes the scrollBarDiv scrollable and associates the jQuery content with it
function makeScrollable($scrollBarDiv, $contentDivs, showFunction, startDragFunction, stopDragFunction)
{
	if($scrollBarDiv === undefined || $contentDivs === undefined || $scrollBarDiv[0] === undefined)
	{
		throw 'cannot make scrollable an undefined scrollbar or content';
	}
	
	//handles the drag event of the scrollbar
	var dragBar = function(event, ui)
	{
		//make sure it does not go out of bounds
		var containerWidth = $scrollBarDiv.parent().width();
		if (ui.position.left < 0)
		{
			ui.position.left = 0;
		}
		
		if (ui.position.left > (containerWidth - $scrollBarDiv.width()))
		{
			ui.position.left = (containerWidth - $scrollBarDiv.width());
		}
		
		//calculate which div to show and show that based on the scroll bars position
		if ($contentDivs.length > 0)
		{
			var availableWidth = containerWidth - $scrollBarDiv.width() * 0.2;
			var contentIndex = Math.floor((ui.position.left / availableWidth) * $contentDivs.length);
			
			if (contentIndex > $contentDivs.length - 1)
			{
				contentIndex = $contentDivs.length - 1;
			}
			
			showContent(contentIndex);
		}
	};

	//makes the statement in the div at index position visible
	var showContent = function(index)
	{
		var fadeInContent = function()
		{
			$contentDivs.filter(':eq(' + index + ')')
				.fadeIn
				(
					600,
					function()
					{
						//sometimes the content is visible, but not faded in properly, so force it to fade in correctly
						jQuery(this).fadeTo(150, 1);
					}
				);
		};
		
		if ($scrollBarDiv[0].currentIndex != index)
		{
			if ($contentDivs.filter(':visible').length === 0)
			{
				fadeInContent();
			}
			else
			{
				$contentDivs.stop(true)
					.filter(':visible')
					.show()
					.fadeOut
					(
						300,
						fadeInContent
					);
			}
			
			$scrollBarDiv[0].currentIndex = index;
			if (showFunction && showFunction !== null)
			{
				showFunction(index);
			}
		}
	};
	
	//keep track of the index in the scroll bar
	$scrollBarDiv[0].currentIndex = -1;
	
	jQuery(document).ready(function()
	{
		if ($contentDivs.length > 0)
		{
			$scrollBarDiv.css({width: Math.floor($scrollBarDiv.parent().width() / $contentDivs.length) + 'px'});
		}
		
		$scrollBarDiv.draggable(
		{
			axis: 'x',
			cursor: 'pointer',
			drag: dragBar,
			start: startDragFunction,
			stop: stopDragFunction
		});
		
		//by default, show the first content div
		showContent(0);
	});
	
	return showContent;
}

// creates a slide show from the provided scrollbar, content and play/pause buttons
function initializeSlideShow($scrollBarDiv, $contentDivs, showFunction, $playButton, $pauseButton, buttonPath, slideDelayTime)
{
	if($scrollBarDiv === undefined || $contentDivs === undefined || $scrollBarDiv[0] === undefined)
	{
		throw 'cannot make scrollable an undefined scrollbar or content';
	}
	
	$scrollBarDiv[0].isPlaying = false;
	$scrollBarDiv[0].showIntervalId = -1;
	$scrollBarDiv[0].slideDelay = slideDelayTime;
	$scrollBarDiv[0].currentIndex = -1;
	$scrollBarDiv[0].scrollingTime = 400; // the time that the scrollbar takes to move to the next position
	
	//changes the image for the supplied button.
	//the image name is assumed to be in the format: [ButtonType][Hover?]Button.[extension]
	var changeButtonImage = function(image, path, buttonType, extension, isHover)
	{
		var imageSrc = path + buttonType;
		if (isHover)
		{
			imageSrc += 'Hover';
		}
		
		image.src = imageSrc + 'Button.' + extension;
	};
	
	//moves the scrollbar to represent which index it is on
	var moveBarToIndex = function(index)
	{
		var containerWidth = $scrollBarDiv.parent().width();
		var barPosition = Math.ceil(index / $contentDivs.length * containerWidth);

		//draggable bar has relative positioning
		$scrollBarDiv.animate({ left: barPosition + 'px'}, $scrollBarDiv[0].scrollingTime, 'swing');
	};
	
	//function called when the slide show interval has passed and the next slide should show
	var nextSlide = function()
	{
		var newIndex = $scrollBarDiv[0].currentIndex + 1;
		if (newIndex >= $contentDivs.length)
		{
			newIndex = 0;
		}
		
		moveBarToIndex(newIndex);
		$scrollBarDiv[0].showContentFunction(newIndex);
	};
	
	//starts the slide show. moveToNextSlide indicated whether or not the next slide should show immediately
	var playShow = function(moveToNextSlide)
	{
		if(!$scrollBarDiv[0].isPlaying)
		{
			if ($scrollBarDiv[0].showIntervalId == -1)
			{
				$scrollBarDiv[0].showIntervalId = window.setInterval(nextSlide, $scrollBarDiv[0].slideDelay);
			}
			
			$playButton.css(
			{
				border: 'solid 1px #ebebeb',
				padding: '0px'
			});
			$pauseButton.css(
			{
				border: '',
				padding: '1px'
			});
			if (moveToNextSlide)
			{
				nextSlide();
			}
			$scrollBarDiv[0].isPlaying = true;
		}
	};
	
	//suspends the current slide show
	var pauseShow = function(alterPlayState)
	{
		window.clearInterval($scrollBarDiv[0].showIntervalId);
		$scrollBarDiv[0].showIntervalId = -1;
		if (alterPlayState)
		{
			$pauseButton.css(
			{
				border: 'solid 1px #ebebeb',
				padding: '0px'
			});
			$playButton.css(
			{
				border: '',
				padding: '1px'
			});
			$scrollBarDiv[0].isPlaying = false;
		}
	};
	
	//bind the events to the play and pause buttons
	$playButton.css(
	{
		cursor: 'pointer',
		padding: '1px'
	});
	$playButton.click(function() { playShow(true); });
	$playButton.mouseover(function() { changeButtonImage(this, buttonPath, 'Play', 'jpg', true); });
	$playButton.mouseout(function() { changeButtonImage(this, buttonPath, 'Play', 'jpg', false); });
	
	$pauseButton.css(
	{
		cursor: 'pointer',
		padding: '1px'
	});
	$pauseButton.click(function() { pauseShow(true); });
	$pauseButton.mouseover(function() { changeButtonImage(this, buttonPath, 'Pause', 'jpg', true); });
	$pauseButton.mouseout(function() { changeButtonImage(this, buttonPath, 'Pause', 'jpg', false); });
	
	$scrollBarDiv[0].showContentFunction = makeScrollable
		(
			$scrollBarDiv,
			$contentDivs,
			showFunction,
			function(event, ui)
			{
				pauseShow(false);
			},
			function(event, ui)
			{
				if ($scrollBarDiv[0].isPlaying)
				{
					//restart the animation
					$scrollBarDiv[0].isPlaying = false;
					playShow(false);
				}
			}
		);
		
	playShow(false);
}