// This class swaps an images with the class .swapGrey to have _grey at the end when hovered over
$(document).ready(function() {
	var initImg;
	var initImg2;
	var initImg3;

		$("ul.navigation img.swap, ul#filter img.swap").live("mouseover mouseout",
		  function (event) {
		  if (event.type == "mouseover") {
			  					
			initImg = $(this).attr("src");	
			var imgType = (initImg).slice(-4);
			var greyImg = initImg.slice(0, -4) + "_up" + imgType;
			$(this).attr("src",greyImg);
			  
			  }
			  else {$(this).attr("src",initImg)}
		  });
		  
		$('ul.navigation img.swap').live('click', function()  {
			
				var thisSrc = $('img.active').attr("src");
				var alteredSrc = (thisSrc).slice(0, -7)+".png";
				
				$('img.active').attr("src",alteredSrc);
				$('img.active').addClass("swap");
				$('ul.navigation li img').removeClass("active");
				
				addActive(this);
			
			
			});
			function addActive(thisun){
				
				$(thisun).addClass("active");
				$(thisun).removeClass("swap");
						
			}
			

			
			
			
			$('a.navSwitch').live('click', function()  {
				
				var thisLink = $(this).attr("rel");	
				
				alterNav2(thisLink);
			})
			
						function alterNav2(imageNameTwo) {
						
				var thisSrc3 = $('img.active').attr("src");
				
				var alteredSrc3 = (thisSrc3).slice(0, -7)+".png";
				
				$('img.active').attr("src",alteredSrc3);
				$('img.active').addClass("swap");
				$('ul.navigation li img').removeClass("active");
				
				
				
				var  endUpdateZero= (imageNameTwo).substring(1);
				var endUpdate=(endUpdateZero).slice(0,-3);
				var greyImg4 = "Images/nav_"+(endUpdate)+ "_up.png";
				
				
				$(imageNameTwo).attr("src", greyImg4);
				addActive(imageNameTwo);
				
				
			
				
			};
			
			
			
			//below is used to switch nav colour when link is clicked within page
			function alterNav(imageName) {
						
				var thisSrc2 = $('img.active').attr("src");
				var alteredSrc2 = (thisSrc2).slice(0, -7)+".png";
				
				$('img.active').attr("src",alteredSrc2);
				$('img.active').addClass("swap");
				$('ul.navigation li img').removeClass("active");
				
				initImg2 = $(imageName).attr("src");	
				var imgType2 = (initImg2).slice(-4);
				var greyImg2 = initImg2.slice(0, -4) + "_up" + imgType2;
			$(imageName).attr("src",greyImg2);
			
				addActive(imageName);
			};
			
			//below is used to switch images on Portfolio page
			$('ul#filter a img').click(function() {
			
				var initImg3 = $('img.live').attr("src");
				var alteredSrc = (initImg3).slice(0, -7)+".png";
				
				$('img.live').attr("src",alteredSrc);
				$('img.live').addClass("swap");
				$('ul#filter li a img').removeClass("live");
				$(this).addClass("live");
				
				var thisimg = $(this).attr("src");	
				
				
				
			
			$(this).attr("src",thisimg);
				
				addActive(this);
			
			
			});
						  

});