// Need this for JQuery intellisense
/// <reference path="jquery-1.2.6-vsdoc.js" />


// new media switcher
(function() {
	NewMind.registerNameSpace('NewMind.TunbridgeWells');
	NewMind.registerNameSpace('NewMind.TunbridgeWells.ControlData');
	NewMind.TunbridgeWells.MediaSwitcher = function() {

		var msTimer;
		var msDuration;


		var pauseCycle = function(e) {
			clearTimeout(msTimer);
		};

		var resumeCycle = function(e) {
			if (isNaN(msDuration)) {
				msTimer = setTimeout(cycleMedia, 2500);
			}
			else {
				msTimer = setTimeout(cycleMedia, msDuration);
			}
		};

		var cycleMedia = function(e) {
			//return false;
			clearTimeout(msTimer);
			var $uls = $("ul.galControls").filter(function() {
				return this.className.indexOf('slideShow') > 0;
			});

			var bStartTimer = 0;
			$uls.each(function() {

				if (isNaN(msDuration)) {
					msDuration = this.className.slice(this.className.indexOf('slideShow') + 9);
					if (isNaN(msDuration) || msDuration < 1000) {
						msDuration = 2500;
					}
				}

				bStartTimer = 1;

				var iNum = 0;
				var $this = $(this);
				var $gcls = $this.find("li");
				var gclsLen = $gcls.length;
				var i = 0;

				$gcls.each(function(index) {
					var $this = $(this);
					if ($this.hasClass('current')) {
						iNum = index + 1;
						if (iNum === gclsLen) {
							iNum = 0;
						}
						return false; //break the loop
					}
				});

				//we loop through again as the first time we are simply working out the current node, this time we are updating everything to use the new node
				$gcls.each(function(index) {
					var $this = $(this);
					if (index === iNum) {
						$this.addClass('current');
					}
					else {
						$this.removeClass('current');
					}
				});

				var $gis = $this.parents("div.ctl_Media").find("div");
				var j = 0;

				$gis.each(function() {
					var $this = $(this);
					if ($this.hasClass("galItem")) {
						if (j === iNum) {
							$this.removeClass("hide");
						}
						else {
							if (!$this.hasClass('hide')) {
								$this.addClass("hide");
							}
						}
						j = j + 1;
					}
				});
				//getNextImage(this); //need to load next image in
			});

			if (bStartTimer === 1) {
				msTimer = setTimeout(cycleMedia, msDuration);
			}
		};


		var switchMedia = function(e) {
			var ev = e || window.event;
			if (ev.preventDefault) {
				ev.preventDefault();
			} else {
				ev.returnValue = false;
			}
			var obj = GetEventSource($(this));
			var iNum = Number($(this).text());
			
			if (iNum === 0) {
				iNum = Number($(this).find('img').attr('alt'));	
			}

			var $gcls = $(obj).parents("ul.galControls").find("li");
			var i = 0;

			$gcls.each(function() {
				var $this = $(this);
				if (i + 1 === iNum) {
					$this.addClass("current");
				}
				else {
					$this.removeClass('current');
				}
				i = i + 1;
			});

			var $gis = $(obj).parents("div.ctl_Media").find("div");

			var j = 1;
			$gis.each(function() {
				var $this = $(this);
				if ($this.hasClass('galItem')) {
					if (j === iNum) {
						$this.removeClass('hide');
					}
					else {
						if (!$this.hasClass('hide')) {
							$this.addClass('hide');
						}
					}
					j++;
				}
			});

			//getNextImage(obj); //need to load next image in
		};

		///loads the next image in the gallery
		var getNextImage = function(obj) {
			var $container = $(obj).parents("div.ctl_Media");
			var imageData = NewMind.TunbridgeWells.ControlData[NewMind.TunbridgeWells.GetControlKey($container[0])];

			if (imageData != undefined && $container.find("div").length >= imageData.length) {
				return;
			}
			//we have less images in the DOM than in the JSON we still need to continue loading
			var image = imageData["image" + $container.find("div").length]; //we can use the length as the index as it should indicate the image we are up to

			loadImage(image, $container);
		};

		var getImages = function(obj) {
			var $container = $(obj).parents("div.ctl_Media");
			var imageData = NewMind.TunbridgeWells.ControlData[NewMind.TunbridgeWells.GetControlKey($container[0])];

			if (imageData != undefined && $container.find("div").length >= imageData.length) {
				return true;
			}
			//spin through each image in the JSON and load up the images into the DOM

			$.each(imageData, function(index, image) {
				loadImage(image, $container);
			});
		};

		var loadImage = function(image, $container) {
			if (image !== undefined) {
				var newImage = '<img src="' + image.file + '" alt="' + image.title + '" />';

				if (image.url.length > 0) {
					newImage = '<a href="' + image.url + '">' + newImage + '</a>';
				}

				if (image.desc.length > 0) {
					newImage += '<div class="mediaNote"><h3>' + image.title + '</h3><p>' + image.desc + '</p></div>';
				}

				$container.append('<div class="galItem hide" style="background: url(/engine/shared_gfx/ajax-loader-arrows-white.gif) no-repeat;">' + newImage + '</div>'); //add the new image HTML to the control
			}
		};

		var mediaSwitcherInit = function() {
			// Loop through all media containers and attach events to each galControl link
			// and galItem div
			if (!document.getElementsByTagName) {
				return;
			}

			// Get array of lists with class "galControls"
			var $arrLists = $("ul.galControls");

			// Loop through the gallery lists
			$arrLists.each(function() {
				var $this = $(this);

				// Get references to the image selection list and the actual containing Media control
				var $objEleMediaControl = $this.parents("div.ctl_Media");

				// While we're at it, put an extra class on the Media control in case we want to render
				// it differently depending upon script availability (other than the "hide" class which
				// is on the list unless script is enabled, see further below..)
				// - In fact, do a quick check that we haven't already performed this process for the
				//   current control (this function should be executed when the page is loaded, but it's
				//   possible that some pages will call it early to try to prevent the brief flicker upon
				//   page load as the control rearranges)
				if ($objEleMediaControl.hasClass("ScriptEnabled")) {
					return true;
				}
				$objEleMediaControl.addClass("ScriptEnabled");

				// Set up the mouse events for the links in the list
				var arrLinks = $this.find("a").click(switchMedia).mouseover(pauseCycle).mouseout(resumeCycle);


				// Remove the "hide" class from the list (the list will only work when javascript
				// is enabled, so shouldn't really be visible unless script is working).
				// NB: Don't bother displaying the list if there's only one item - it won't
				// actually do anything since there are no images to switch between!
				if (arrLinks.length > 1) {
					$this.removeClass("hide");
				}


				getImages(this);

				// Set up the mouse events for the images in the gallery containing the list
				var $arrImageConts = $objEleMediaControl.find("div");
				$arrImageConts.each(function() {
					var $this = $(this);
					if ($this.hasClass("galItem")) {
						$this.mouseover(pauseCycle).mouseout(resumeCycle);
					}
				});

			});

			// Kick off the slideshow (on media galleries that have the slideshow option selected)
			resumeCycle();

		};


		return {
			init: function() {
				mediaSwitcherInit();
			}
		};
	}();

	$(function() {
		NewMind.TunbridgeWells.MediaSwitcher.init();
	});
})();