/// <reference path="/content/scripts/jquery.js" />
/// <reference path="/content/scripts/jquery.ui.js" />
/// <reference path="/content/scripts/knockout.js" />
/// <reference path="/content/scripts/knockout.map.js" />
/// <reference path="/content/scripts/knockout.templates.js" />

/*
* jQuery UI Auto complete HTML Extension for displaying label content.
*
* Copyright 2010, Scott González (http://scottgonzalez.com)
* Dual licensed under the MIT or GPL Version 2 licenses.
*
* http://github.com/scottgonzalez/jquery-ui-extensions
*/
(function ($) {

	$.ui.autocomplete.prototype._renderItem = function (ul, item) {
		return $("<li></li>")
			.data("item.autocomplete", item)
			.append($("<a></a>")[this.options.html ? "html" : "text"](item.label))
			.appendTo(ul);
	};

})(jQuery);
(function ($) {
	$.fn.submitHandler = function (callback) {
		this.each(function (i) {
			var container = $(this);
			// attach the jquery unobtrusive validator
			$.validator.unobtrusive.parse(container);
			// bind the submit handler to unobtrusive validation.
			$(container).data("validator").settings.submitHandler = function () {
				callback(container);
			};
		});
		return this;
	};
})(jQuery);

/*
Title:		ehRotator: a jQuery Content Rotator Plugin for the Enchanted Hills
Author:		Stacey Cielia Lynn
Version:	0.1.2
License: 	Copyrighted.

ehRotator Options

animatePause :		whether to use 'Pause' animation text when pausing [boolean, defaults to true]
autoPlay :			whether to start playing immediately [boolean, defaults to true]
changeSpeed :		speed of transition [integer, milliseconds, defaults to 600]
controls :			whether to create & display controls (Play/Pause, Previous, Next) [boolean, defaults to true]
controlText :		custom text for controls [object, 'play', 'pause', 'previous' and 'next' properties]
cssClass :			custom class to add to .ehRotator wrapper [string]
effect :			transition effect [string: 'fade', 'slideLeft' or 'none', defaults to 'fade']
hoverPause :		whether to pause on hover [boolean, defaults to true]
links :				whether to create & display numeric links to each slide [boolean, defaults to true]
speed :				time each slide is shown [integer, milliseconds, defaults to 3000]

*/

(function ($) {
	$.fn.ehRotator = function (settings) {
		// default global variables
		var config = {
			animatePause: true,
			autoPlay: true,
			changeSpeed: 600,
			controls: true,
			controlText: {
				play: 'Play',
				pause: 'Pause',
				next: 'Next',
				previous: 'Previous'
			},
			effect: 'fade',
			hoverPause: true,
			links: true,
			speed: 3000
		};

		// merge default global variables with custom variables, modifying 'config'
		if (settings) $.extend(true, config, settings);

		// make sure speed is at least 20ms longer than changeSpeed
		if (config.speed < (config.changeSpeed + 20)) {
			config.speed += 20;
		}

		// create slideshow for each matching element invoked
		this.each(function (i) {
			// declare instance variables
			var $container = $(this);
			var gallery = $(this).children().remove();
			var timer = '';
			var counter = 0;
			var preloadedImg = [];
			var howManyInstances = $('.ehRotator').length + 1;
			var uniqueClass = 'ehRotator-' + howManyInstances;
			var cssClass = config.cssClass != undefined ? config.cssClass : '';

			// set up html container.
			$container.css('position', 'relative').wrap('<div class="ehRotator ' + uniqueClass + '" />');
			var $wrap = $('.' + uniqueClass);
			$wrap.css('position', 'relative').addClass(cssClass);

			// add first slide to container
			$(gallery[0]).clone().appendTo($container);

			// preload slide images into memory
			preload();

			// add controls
			if (config.controls) {
				addControls();
				if (config.autoPlay == false) {
					$('.' + uniqueClass + '-play').addClass(uniqueClass + '-paused ehRotator-paused').text(config.controlText.play);
				}
			}

			// add links for each slide, if desired
			if (config.links) {
				addSlideLinks();
				$('.' + uniqueClass + '-slidelinks a').eq(0).addClass(uniqueClass + '-active ehRotator-active');
			}

			// pause slide rotation on hover
			if (config.hoverPause) {
				$container.hover(function () {
					if (isPlaying()) pause('hover');
				},
					function () {
						if (isPlaying()) play('hover');
					});
			}

			// determine whether the rotator should auto-play
			if (config.autoPlay && gallery.length > 1) {
				timer = setInterval(function () {
					play();
				}, config.speed);
			}

			// display error message if no slides are present
			if (gallery.length < 1) {
				$('.' + uniqueClass).append('<p>For ehRotator to work, the container element must have child elements.</p>');
			}


			// utility for loading slides
			function transitionTo(gallery, index) {
				// store the current index of the counter
				var oldCounter = counter;

				// if the counter is at the end of the gallery or the current slide
				// is somehow beyond the length of the gallery, go ahead and reset
				// it back to the beginning.
				if ((counter >= gallery.length) || (index >= gallery.length)) {
					counter = 0;
				}
				else if ((counter < 0) || (index < 0)) {
					counter = gallery.length - 1;
				}
				else {
					counter = index;
				}

				// behaviors for left sliding effects
				if (config.effect == 'slideLeft') {
					var newSlideDir, oldSlideDir;
					// setup the sliding direction
					function slideDir(dir) {
						newSlideDir = dir == 'right' ? 'left' : 'right';
						oldSlideDir = dir == 'left' ? 'left' : 'right';
					};

					// if we have reached the end of the slider, then start going the other way
					counter >= oldCounter ? slideDir('left') : slideDir('right');

					$(gallery[counter]).clone().appendTo($container).slideIt({
						direction: newSlideDir,
						changeSpeed: config.changeSpeed
					});

					if ($container.children().length > 1) {
						$container.children().eq(0).css('position', 'absolute').slideIt({
							direction: oldSlideDir,
							showHide: 'hide',
							changeSpeed: config.changeSpeed
						}, function () {
							$(this).remove();
						});
					}
				}
				else if (config.effect == 'fade') {
					$(gallery[counter]).clone().appendTo($container).hide().fadeIn(config.changeSpeed, function () {
						if ($.browser.msie) this.style.removeAttribute('filter');
					});
					if ($container.children().length > 1) {
						$container.children().eq(0).css('position', 'absolute').fadeOut(config.changeSpeed, function () {
							$(this).remove();
						});
					}
				}
				else if (config.effect == 'none') {
					$(gallery[counter]).clone().appendTo($container);
					if ($container.children().length > 1) {
						$container.children().eq(0).css('position', 'absolute').remove();
					}
				}

				// update active class on slide link
				if (config.links) {
					$('.' + uniqueClass + '-active').removeClass(uniqueClass + '-active ehRotator-active');
					$('.' + uniqueClass + '-slidelinks a').eq(counter).addClass(uniqueClass + '-active ehRotator-active');
				}
			};

			// is the rotator currently in 'play' mode
			function isPlaying() {
				return $('.' + uniqueClass + '-play').hasClass('ehRotator-paused') ? false : true;
			};

			// start slide rotation on specified interval
			function play(src) {
				if (!isBusy()) {
					counter++; transitionTo(gallery, counter);
					if (src == 'hover' || !isPlaying()) {
						timer = setInterval(function () {
							play();
						}, config.speed);
					}
					if (!isPlaying()) {
						$('.' + uniqueClass + '-play').text(config.controlText.pause).removeClass('ehRotator-paused ' + uniqueClass + '-paused');
					}
				}
			};

			// stop slide rotation
			function pause(src) {
				clearInterval(timer);
				if (!src || src == 'playBtn') $('.' + uniqueClass + '-play').text(config.controlText.play).addClass('ehRotator-paused ' + uniqueClass + '-paused');
				if (config.animatePause && src == 'playBtn') {
					$('<p class="' + uniqueClass + '-pausetext ehRotator-pausetext">' + config.controlText.pause + '</p>').css({
						fontSize: '62%',
						textAlign: 'center',
						position: 'absolute',
						top: '40%',
						lineHeight: '100%',
						width: '100%'
					}).appendTo($wrap)
									.addClass(uniqueClass + 'pauseText')
									.animate({
										fontSize: '600%',
										top: '30%',
										opacity: 0
									}, { duration: 500, complete: function () {
										$(this).remove();
									} 
									});
				}
			};

			// load the next slide
			function next() {
				goToAndPause(counter + 1);
			};

			// load the previous slide
			function previous() {
				goToAndPause(counter - 1);
			};

			// is the rotator in mid-transition
			function isBusy() {
				return $container.children().length > 1 ? true : false;
			};

			// load a specific slide
			function goToAndPause(index) {
				$container.children().stop(true, true);
				if ((counter != index) || ((counter == index) && isBusy())) {
					if (isBusy()) $container.children().eq(0).remove();
					transitionTo(gallery, index);
					pause();
				}
			};

			// load images into memory
			function preload() {
				$(gallery).each(function (i) {
					$(this).find('img').each(function (i) {
						preloadedImg[i] = $('<img>').attr('src', $(this).attr('src'));
					});
				});
			};

			// generate and add play/pause, prev, next controls
			function addControls() {
				$wrap.append('<p class="ehRotator-controls ' + uniqueClass + '-controls"><a class="ehRotator-play ' + uniqueClass + '-play" href="#null">' + config.controlText.pause + '</a> <a class="ehRotator-prev ' + uniqueClass + '-prev" href="#null">' + config.controlText.previous + '</a> <a class="ehRotator-next ' + uniqueClass + '-next" href="#null">' + config.controlText.next + '</a></p>');
				$('.' + uniqueClass + '-controls a').each(function () {
					if ($(this).hasClass('ehRotator-play')) $(this).click(function () {
						isPlaying() ? pause('playBtn') : play(); return false;
					});
					if ($(this).hasClass('ehRotator-prev')) $(this).click(function () {
						previous(); return false;
					});
					if ($(this).hasClass('ehRotator-next')) $(this).click(function () {
						next(); return false;
					});
				});
			};

			// generate and add slide links
			function addSlideLinks() {
				$wrap.append('<p class="ehRotator-slidelinks ' + uniqueClass + '-slidelinks"></p>');
				$.each(gallery, function (i, val) {
					var linktext = $(this).attr('title');
					if (!linktext) {
						linktext = i + 1;
					}
					$('<a class="ehRotator-slidelink-' + i + ' ' + uniqueClass + '-slidelink-' + i + '" href="#null">' + linktext + '</a>').bind('click', { index: i }, function (e) {
						goToAndPause(e.data.index); return false;
					}).appendTo('.' + uniqueClass + '-slidelinks');
				});
			};
		});
		return this;
	};
})(jQuery);


(function ($) {
	$.fn.slideIt = function (settings, callback) {
		// default global variables
		var config = {
			direction: 'left',
			showHide: 'show',
			changeSpeed: 600
		};

		// merge default global variables with custom variables, modifying 'config'
		if (settings) $.extend(config, settings);

		this.each(function (i) {
			$(this).css({
				left: 'auto',
				right: 'auto',
				top: 'auto',
				bottom: 'auto'
			});
			var measurement = (config.direction == 'left') || (config.direction == 'right') ? $(this).outerWidth() : $(this).outerHeight();
			var startStyle = {};
			startStyle['position'] = $(this).css('position') == 'static' ? 'relative' : $(this).css('position');
			startStyle[config.direction] = (config.showHide == 'show') ? '-' + measurement + 'px' : 0;
			var endStyle = {};
			endStyle[config.direction] = config.showHide == 'show' ? 0 : '-' + measurement + 'px';
			$(this).css(startStyle).animate(endStyle, config.changeSpeed, callback);
		});
		return this;
	};
})(jQuery);