// JavaScript Document
var swapHomeState = 0;
var tabsLoaded = false;

function initVideoList(){
	$('#scrolling-videos').children().each(function(index){
		$(this).click(function() {
			loadVideo($(this).attr('id'));
			loadVideoInfo(index);
		});
	});
}
function loadVideoInfo(videoId){
	$('#video-descriptions').children().each(function(index){
		if(index == videoId){
			$(this).show();
		}
		else{
			$(this).hide();
		}
	});
	document.getElementById('video-title').innerHTML = videoNameArray[videoId];
}




function filterVideos(videoIndex){
	var numberOfVidsToDisplay = 0;
	$('#scrolling-videos').children().each(function(index){
		if(videoIndex == "all"){
			$(this).fadeIn();
			$('#sorry-message').hide();
		}
		else{
			var currentArray = videosArray[index];
			if(currentArray[videoIndex]){
				$(this).fadeIn();
				numberOfVidsToDisplay++;
			}
			else{
				$(this).fadeOut();
			}
		}
		if(numberOfVidsToDisplay == 0 && videoIndex!="all"){
			$('#sorry-message').fadeIn();
		}
		else{
			$('#sorry-message').hide();
		}
	});
}
function initWalks(){
	$('#walks').children().each(function(index){
		$(this).click(function() {
			loadVideo($(this).attr('id'));
			clearWalkClasses();
			$(this).addClass('walk-selected');
			$(this).removeClass('walk-unselected');
		});
	});
}
function clearWalkClasses(){
	$('#walks').children().each(function(index){
		$(this).removeClass('walk-selected');
		$(this).addClass('walk-unselected');
	});
}
function loadVideo(youTubeId){
	document.getElementById('media-container').innerHTML = "<iframe width='590' height='310' src='http://www.youtube.com/embed/" + youTubeId + "' frameborder='0' allowfullscreen></iframe>";
}
function loadImage(imageName){
	document.getElementById('media-container').innerHTML = "<img src='content/" + imageName + "' width='590' height='310'>";
}

function initMembers(selectedMember){
	$('#members-thumbs').children().each(function(index){
		$(this).click(function() {
			selectMember(index);
		});
	});
	selectMember(selectedMember);
}
function selectMember(selectedMember){
	$('#members').children().each(function(index){
		if(index!=selectedMember){
			$(this).hide();
		}
		else{
			$(this).show();
		}
	});
	$('#members-thumbs').children().each(function(index){
		var currentImageName = $(this).children(0).children(0).attr('src');
		if(currentImageName.slice(currentImageName.length-7,currentImageName.length) == "-bw.jpg"){
			var currentClearedName = currentImageName.slice(0,currentImageName.length-7);
		}
		else {
			var currentClearedName = currentImageName.slice(0,currentImageName.length-4);
		}
		if(index!=selectedMember){
			$(this).children(0).children(0).attr('src',currentClearedName + "-bw.jpg");
		}
		else{
			$(this).children(0).children(0).attr('src',currentClearedName + ".jpg");
		}
	});
}


function initDropdown(){
	$("#drop-down-menu").mouseenter(function(){
		clearTimeout($("#drop-down-menu").data('timeoutId'));
		$("#drop-down-list-container").fadeIn("fast");
	}).mouseleave(function(){
		var timeoutId = setTimeout(function(){ $("#drop-down-list-container").fadeOut("fast");}, 100);
		$("#drop-down-menu").data('timeoutId', timeoutId);
	});
	$("#drop-down-list-container").mouseenter(function(){
		clearTimeout($("#drop-down-menu").data('timeoutId'));
		 $("#drop-down-list-container").fadeIn("fast");
	}).mouseleave(function(){
		clearTimeout($("#drop-down-menu").data('timeoutId'));
		var timeoutId = setTimeout(function(){ $("#drop-down-list-container").fadeOut("fast");}, 100);
		$("#drop-down-menu").data('timeoutId', timeoutId);
	});
}
function selectMenuItem(menuString){
	clearTimeout($("#drop-down-menu").data('timeoutId'));
	$("#drop-down-list-container").hide();
	document.getElementById('drop-down-menu').innerHTML = menuString;
}
function swapHomeImage(){
	var ie55 = (navigator.appName == "Microsoft Internet Explorer" && parseInt(navigator.appVersion) == 4 && navigator.appVersion.indexOf("MSIE 5.5") != -1);
	var ie6 = (navigator.appName == "Microsoft Internet Explorer" && parseInt(navigator.appVersion) == 4 && navigator.appVersion.indexOf("MSIE 6.0") != -1);
	if(ie55 || ie6){
		$('#tab1').toggleClass('home-tab-white');
		$('#tab1').toggleClass('home-tab-green-gif');
		$('#tab2').toggleClass('home-tab-white');
		$('#tab2').toggleClass('home-tab-brown-gif');
	}
	else{
		$('#tab1').toggleClass('home-tab-white');
		$('#tab1').toggleClass('home-tab-green');
		$('#tab2').toggleClass('home-tab-white');
		$('#tab2').toggleClass('home-tab-brown');	
	}
	if(!swapHomeState){
		swapHomeState = 1;
		$('#home-image').attr("src", "images/canine-club-dog-day-care-cheshire.jpg");
		$('#doggy-01').attr("src", "images/doggy-01-white.jpg");
		$('#doggy-02').attr("src", "images/doggy-02.jpg");
	}
	else{
		swapHomeState = 0;
		$('#home-image').attr("src", "images/canine-club-dog-walking-cheshire.jpg");
		$('#doggy-01').attr("src", "images/doggy-01.jpg");
		$('#doggy-02').attr("src", "images/doggy-02-white.jpg");
	}
}
function initSwapHome(){
	var ie55 = (navigator.appName == "Microsoft Internet Explorer" && parseInt(navigator.appVersion) == 4 && navigator.appVersion.indexOf("MSIE 5.5") != -1);
	var ie6 = (navigator.appName == "Microsoft Internet Explorer" && parseInt(navigator.appVersion) == 4 && navigator.appVersion.indexOf("MSIE 6.0") != -1);
	if (ie55 || ie6) {
		$('#tab1').toggleClass('home-tab-green');
		$('#tab1').toggleClass('home-tab-green-gif');
		$('#television').attr("src", "images/television-trans.gif");
	}
	var swapHomeInterval = self.setInterval("swapHomeImage()",5500);
}
function swapPageImage(){
	var ie55 = (navigator.appName == "Microsoft Internet Explorer" && parseInt(navigator.appVersion) == 4 && navigator.appVersion.indexOf("MSIE 5.5") != -1);
	var ie6 = (navigator.appName == "Microsoft Internet Explorer" && parseInt(navigator.appVersion) == 4 && navigator.appVersion.indexOf("MSIE 6.0") != -1);
	if (ie55 || ie6) {
		$('#page-div-01').toggleClass('page-background-ie');
		$('#page-div-02').toggleClass('page-background-ie');
	}
}
function selectNav(navId){
	var selectedNav = "nav" + navId;
	$('#' + selectedNav).addClass('nav-selected');
	$('#' + selectedNav).removeClass('nav-unselected');
}
var slideshowState = 1;
var slideshowWidth = 0;
function initSlideshow(slideshowWidthVar){
	var newWidth = $('#slideshow-images').children().length * 270;
	$('#slideshow-images').css('width', newWidth);
	slideshowWidth = slideshowWidthVar;
	if($('#slideshow-images').children().length > 3){
		$('#slideshow-button-right-image').fadeIn();
	}
	$('#slideshow-button-right').click(function() {
		if(slideshowWidth * slideshowState < $('#slideshow-images').width()-20){
			slideshowState++;
			showHideSliderButtons();
		}
	});
	$('#slideshow-button-left').click(function() {
		if(slideshowState > 1){
			slideshowState--;
			showHideSliderButtons();			
		}
	});
}
function showHideSliderButtons(){
	$('#slideshow-images').animate({left: -(slideshowState-1)*slideshowWidth});
	if(slideshowWidth * slideshowState >= $('#slideshow-images').width()-20){
		$('#slideshow-button-right-image').hide();
	}
	else{
		$('#slideshow-button-right-image').show();
	}
	if(slideshowState == 1){
		$('#slideshow-button-left-image').fadeOut();
	}
	else{
		$('#slideshow-button-left-image').fadeIn();
	}
}
function initSlider(){
	//Show the paging and activate its first link
	$(".paging").show();
	$(".paging div:first").addClass("active");
	
	//Get size of the image, how many images there are, then determin the size of the image reel.
	var imageWidth = $(".window").width();
	var imageSum = $(".image_reel div").size();
	var imageReelWidth = imageWidth * imageSum;
	
	//Adjust the image reel to its new size
	$(".image_reel").css({'width' : imageReelWidth});
	
	//Paging  and Slider Function
	rotate = function(){
		var triggerID = $active.attr("rel") - 1; //Get number of times to slide
		var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide
	
		$(".paging div").removeClass('active'); //Remove all active class
		$active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)
	
		//Slider Animation
		$(".image_reel").animate({
			left: -image_reelPosition
		}, 500 );
	
	}; 
	
	//Rotation  and Timing Event
	rotateSwitch = function(){
		play = setInterval(function(){ //Set timer - this will repeat itself every 7 seconds
			$active = $('.paging div.active').next(); //Move to the next paging
			if ( $active.length === 0) { //If paging reaches the end...
				$active = $('.paging div:first'); //go back to first
			}
			rotate(); //Trigger the paging and slider function
		}, 8000); //Timer speed in milliseconds (7 seconds)
	};
	
	rotateSwitch(); //Run function on launch
	
	//On Hover
	$(".image_reel a").hover(function() {
		clearInterval(play); //Stop the rotation
	}, function() {
		rotateSwitch(); //Resume rotation timer
	});	
	
	//On Click
	$(".paging div").click(function() {
		$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
	});
}