$(document).ready(function(){
	
	$("ul.subnav").parent().append("<span class='downArrow'></span>"); //Only shows drop down trigger when js is enabled (Adds empty span tag after ul.subnav*)

	$("ul.topnav li span").hover(function(){ //When trigger is hovered
			
		//Following event is applied to the subnav itself (moving subnav up and down)
		$(this).parent().find("ul.subnav").slideDown("fast").show(); //Drop down the subnav on click

		$(this).parent().hover(function(){
		}, function(){
			$(this).parent().find("ul.subnav").slideUp("slow"); //When the mouse hovers out of the subnav move it back up
		});

		//Following events are applied to the trigger (hover events for the trigger)
		}).hover(function(){
				$(this).addClass("subhover"); //On hover over add class subhover
			}, function(){ //On hover out
				$(this).removeClass("subhover"); //On hover out remove class subhover
	});
	
	//For the slideshow navigation
	var imageList = $("div.imageReel img").length;
	for(var i = 1; i <= imageList; i++)
	{
		$(".paging").append("<a href='#' rel='" + i + "'>" + i + "</a>");
	}
	
	//Show the paging and activate it's first link
	$(".paging").show();
	$(".paging a:first").addClass("active");
	
	//Get the size of the image, how many images there are and determine the size of the image reel
	var imageWidth = $(".window").width();
	var imageSum = $(".imageReel img").size();
	var imageReelWidth = imageWidth * imageSum;
	
	//Adjust the image reel to it's new size
	$(".imageReel").css({"width" : imageReelWidth});
	
	//Paging and Slider function
	rotate = function()
	{
		var triggerID = $active.attr("rel") - 1; //Get the number of times to slide
		var imageReelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide
		
		$(".paging a").removeClass("active"); //Remove all active class
		$active.addClass("active"); //Add active class. (the $active is declared in the rotateSwitch function)
		
		//Slider animation
		$(".imageReel").animate({
			left: -imageReelPosition
		}, 500);
	};
	
	//Rotate and Timing Event
	rotateSwitch = function()
	{
		play = setInterval(function(){
			$active = $(".paging a.active").next();
			if($active.length == 0)
			{
				$active = $(".paging a:first");
			}
			rotate();
		}, 7000);
	};
	
	rotateSwitch(); //Run function on launch
	
	//On Hover
	$(".imageReel img").hover(function(){
		clearInterval(play);
	}, function(){
		rotateSwitch();
	});
	
	//On Click
	$(".paging a").click(function(e){
		e.preventDefault();
		$active = $(this); //Activate the clicked paging
		//Reset timer
		clearInterval(play); //Stop the rotation
		rotate(); //Trigger rotation immediately
		rotateSwitch(); //Resume rotation timer
		return false; //Prevent browser jump to link anchor
		
	});
	
	var iconsList = $(".iconsTD span").length;
	for(var i = 1; i <= iconsList; i++)
	{	
		var imageName;
		
		$("#icon" + i).hover(function(){
			imageName = $(this).attr("src");
			var imageNameHover = $(this).attr("name");
			//$(this).animate({"opacity" : "0"}, "fast");
			$(this).attr("src", "Images/Icons/" + imageNameHover + ".png");
		}, function(){
			$(this).attr("src", imageName);
			//$(this).animate({"opacity" : "1"}, "fast");
		});
	}
	
	//As die grys icons geclick word
	/*$(".greyIcon").click(function(e){
		var imageClicked = $(this).attr("title");
		$.ajax({
			url: imageClicked,
			success: function(data){
				$(document).html(data);
			}
		});
	});*/
	
	$(".imageReel img").each(function(index){
		var path = $(this).attr("src");
		//Call preloadImages function here
		$.preloadImages("image" + (index+1) + ".jpg", "" + path + "");
	});
});

//Function for preloading images jQuery style!!!
(function($){
	var cache = [];
	
	$.preloadImages = function(){
		var args_len = arguments.length;
		for(var c = args_len; c--;){
			var cacheImage = document.createElement("img");
			cacheImage.src = arguments[c];
			cache.push(cacheImage);
		}
	}
})(jQuery)

function displayContent(theContent){

	window.alert(theContent);

}

// Form validation
function validateForm(formName){
	with(formName){
		if(storeName.value == ""){
			document.getElementById("errorHolder").innerHTML = "<b>Company Name</b> field is a required field";
			$(".storenotice").text("*");
			return false;
		}
		else{
			$(".storenotice").text("");
			if(firstname.value == ""){
				document.getElementById("errorHolder").innerHTML = "<b>Firstname</b> field is a required field";
				$(".fnamenotice").text("*");
				return false;
			}
			else
			{
				$(".fnamenotice").text("");
				if(surname.value == ""){
					document.getElementById("errorHolder").innerHTML = "<b>Surname</b> field is a required field";
					$(".snamenotice").text("*")
					return false;
				}
				else{
					$(".snamenotice").text("");
					if(email.value == ""){
						$("#errorHolder").html("<b>Email</b> field is a required field");
						$(".emailnotice").text("*");
						return false;
					}
					else{
						if(validateEmail(email, "<b>Not</b> a valid email address") == false){
							$(".emailnotice").text("*");
							return false;
						}
						else{
							$(".emailnotice").text("");
							var t = area.selectedIndex;
							var selectedText = area.options[t].text;
							if(area.value == "Select"){
								document.getElementById("errorHolder").innerHTML = "<b>Area</b> is a required field";
								$(".areanotice").text("*");
								return false;
							}
							else{
								$(".areanotice").text("");
								if(formName.name == "SupplierForm"){
									if(extraInfo.value == ""){
										$("#errorHolder").html("<b>Please</b> supply more information");
										$(".textareanotice").text("*");
										return false;
									}
									else{
										$(".checkboxnotice").text("");
										showLoader();
										return true;
									}
								}
								else
								{
									for(var i = 0; i < product.length; i++){
										if(!product[i].checked){
											$("#errorHolder").html("<b>Please</b> check at least one product");
											$(".checkboxnotice").text("*");
										}
										else{
											$(".checkboxnotice").text("");
											$("#errorHolder").html("");
											showLoader();
											return true;
										}
									}
									return false;
								}
							}
						}
					}
				}
			}
		}
	}
}

function showLoader(){
	$(".clientTypeFormHeading").append(" &nbsp;<span><img src='Images/Menu/dropdown_linkbg.png' alt='' /></span>&nbsp; <b>Working, please wait...</b>");
	
	var lWidth = $(".clientTypeFormContent").width();
	var lHeight = $(".clientTypeFormContent").height();
	
	//Get the window width and height
	var lImageW = $(".clientTypeFormContent").width();
	var lImageH = $(".clientTypeFormContent").height();
	
	//Set the popup window to center
	$("#loaderImage").css("top", lImageH/2-10);
	$("#loaderImage").css("left", lImageW/2-110);
	
	$("#loader").css({"width": lWidth, "height": lHeight});
	$("#loader").fadeTo("normal", 0.9);
}

function validateEmail(email, errorText){
	with(email){
		apos = value.indexOf("@");
		dotpos = value.lastIndexOf(".");
		if(apos < 1 || dotpos-apos < 2){
			$("#errorHolder").html(errorText);
			return false;
		}
		else{
			return true;
		}		
	}
}

function reloadInterestedPage(clientType){
	window.location = "http://localhost:8001/BravoNew/Interested.asp?type=" + clientType;
}

function changeClientType(clientType){
	if(clientType == "Supplier"){
		$("#contentType").html("<td colspan='2' valign='top'><div><span class='extrainfonotice'>*</span>Extra Information:</div><div><textarea name='extraInfo' rows='8' cols='70' class='textArea'></textarea></div></td>");
	}
	else{
		$("#contentType").html("<td valign='top'><span class='checkboxnotice'>*</span>Products interested in:</td><td><input type='checkbox' name='product' value='Beds' /> Beds<br /><input type='checkbox' name='product' value='LoungeSuites' /> Lounge Suites<br /><input type='checkbox' name='product' value='CaseGoods' /> Case Goods<br /><input type='checkbox' name='product' value='Logistics' /> Logistics<br /></td>");
	}
}

function roll(imgName, imgSrc)
{
	document[imgName].src = imgSrc;
}
