// Javascript originally by Patrick Griffiths and Dan Webb.
// http://htmldog.com/articles/suckerfish/dropdowns/
sfHover = function() {
	var sfEls = document.getElementById("navbar").getElementsByTagName("li");
	for (var i = 0; i < sfEls.length; i++) {
		sfEls[i].onmouseover = function() {
			this.className += " hover";
		}
		sfEls[i].onmouseout = function() {
			this.className = this.className.replace(new RegExp(" hover\\b"), "");
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

$(document).ready(function() {

	//Execute the slideShow, set 8 seconds for each images
	slideShow(8000);
	startLogos(4000);

});

function slideShow(speed) {


	//append a LI item to the UL list for displaying caption
	$('ul.slideshow').append('<li id="slideshowcaption" class="caption"><div class="slideshowcaptioncontainer"><div class="SSH3"><span name="ssh" ID="ssh"></span></div><p></p></div></li>');

	//Set the opacity of all images to 0
	$('ul.slideshow li').css({ opacity: 0.0 });

	//Get the first image and display it (set it to full opacity)
	$('ul.slideshow li:first').css({ opacity: 1.0 });

	//Get the caption of the first image from REL attribute and display it
	document.getElementById('ssh').innerText = $('ul.slideshow a:first').find('img').attr('alt');
	document.getElementById('ssh').textContent = $('ul.slideshow a:first').find('img').attr('alt');
	$('#slideshowcaption p').html($('ul.slideshow a:first').find('img').attr('text'));

	//Display the caption
	$('#slideshowcaption').css({ opacity: 0.60, bottom: 0 });

	//Call the gallery function to run the slideshow	
	var timer = setInterval('gallery()', speed);

	//pause the slideshow on mouse over
	$('div.pnButtonsMain').hover(
		function() {
			clearInterval(timer);
		},
		function() {
			timer = setInterval('gallery()', speed);
		}
	);
	$('ul.slideshow').hover(
		function() {
			clearInterval(timer);
		},
		function() {
			timer = setInterval('gallery()', speed);
		}
	);

}

function gallery() {


	//if no IMGs have the show class, grab the first image
	var current = ($('ul.slideshow li.show') ? $('ul.slideshow li.show') : $('#ul.slideshow li:first'));

	//Get next image, if it reached the end of the slideshow, rotate it back to the first image
	var next = ((current.next().length) ? ((current.next().attr('id') == 'slideshowcaption') ? $('ul.slideshow li:first') : current.next()) : $('ul.slideshow li:first'));

	//Get next image caption
	var title = next.find('img').attr('alt');
	var desc = next.find('img').attr('text');

	//Set the fade in effect for the next image, show class has higher z-index
	next.css({ opacity: 0.0 }).addClass('show').animate({ opacity: 1.0 }, 1000);

	//Hide the caption first, and then set and display the caption
	$('#slideshowcaption').animate({ bottom: -90 }, 500, function() {
		//Display the content
		document.getElementById('ssh').innerText = title;
		document.getElementById('ssh').textContent = title;
		$('#slideshowcaption p').html(desc);
		$('#slideshowcaption').animate({ bottom: 0 }, 500);
	});

	//Hide the current image
	current.animate({ opacity: 0.0 }, 1000).removeClass('show');

}

function slideForward() {

	//if no IMGs have the show class, grab the first image
	var current = ($('ul.slideshow li.show') ? $('ul.slideshow li.show') : $('#ul.slideshow li:first'));

	//Get next image, if it reached the end of the slideshow, rotate it back to the first image
	var next = ((current.next().length) ? ((current.next().attr('id') == 'slideshowcaption') ? $('ul.slideshow li:first') : current.next()) : $('ul.slideshow li:first'));

	//Get next image caption
	var title = next.find('img').attr('alt');
	var desc = next.find('img').attr('text');

	//Set the fade in effect for the next image, show class has higher z-index
	next.css({ opacity: 0.0 }).addClass('show').animate({ opacity: 1.0 }, 0);

	//Hide the caption first, and then set and display the caption
	$('#slideshowcaption').animate({ opacity: 0 }, 0, function() {
		//Display the content
		document.getElementById('ssh').innerText = title;
		document.getElementById('ssh').textContent = title;
		$('#slideshowcaption p').html(desc);
		$('#slideshowcaption').animate({ opacity: 0.60 }, 0);
	});

	//Hide the current image
	current.animate({ opacity: 0.0 }, 0).removeClass('show');
}

function slideBackward() {
	//if no IMGs have the show class, grab the first image
	var current = ($('ul.slideshow li.show') ? $('ul.slideshow li.show') : $('#ul.slideshow li:first'));

	//Get next image, if it reached the end of the slideshow, rotate it back to the first image li#slideshowcaption.caption
	var next = ((current.prev().length) ? ((current.prev().attr('id').indexOf("slideshowcaption") > -1) ? $('ul.slideshow li:last-child') : current.prev()) : $('ul.slideshow li:last-child'));
	//Get next image caption
	next = ((next.attr('id').indexOf("slideshowcaption") > -1) ? next.prev() : next);

	var title = next.find('img').attr('alt');
	var desc = next.find('img').attr('text');

	//Set the fade in effect for the next image, show class has higher z-index
	next.css({ opacity: 1.0 }).addClass('show');

	//Hide the caption first, and then set and display the caption
	$('#slideshowcaption').animate({ opacity: 0 }, 0, function() {
		//Display the content
		document.getElementById('ssh').innerText = title;
		document.getElementById('ssh').textContent = title;
		$('#slideshowcaption p').html(desc);
		$('#slideshowcaption').animate({ opacity: 0.60 }, 0);
	});

	//Hide the current image
	current.animate({ opacity: 0.0 }, 0).removeClass('show');
}

function startLogos(speed) {

	//Set the opacity of all images to 0
	$('ul.logos li').css({ opacity: 0.0 });

	//Get the first image and display it (set it to full opacity)
	$('ul.logos li:first').css({ opacity: 1.0 });

	//Call the gallery function to run the slideshow
	var timer = setInterval('logoGallery()', speed);

	//pause the slideshow on mouse over
	$('ul.logos').hover(
		    function() {
		    	clearInterval(timer);
		    },
		    function() {
		    	timer = setInterval('logoGallery()', speed);
		    });

	$('div.pnButtons').hover(
		    function() {
		    	clearInterval(timer);
		    },
		    function() {
		    	timer = setInterval('logoGallery()', speed);
		    });
}

function logoGallery() {
	//if no IMGs have the show class, grab the first image
	var current = ($('ul.logos li.logosShow') ? $('ul.logos li.logosShow') : $('#ul.logos li:first'));

	//Get next image, if it reached the end of the slideshow, rotate it back to the first image
	var next = ((current.next().length) ? ((current.next().attr('id') == 'ssc') ? $('ul.logos li:first') : current.next()) : $('ul.logos li:first'));


	//Set the fade in effect for the next image, show class has higher z-index
	next.css({ opacity: 0.0 }).addClass('logosShow').animate({ opacity: 1.0 }, 1000);

	//Hide the current image
	current.animate({ opacity: 0.0 }, 1000).removeClass('logosShow');

}

function logoForward() {
	//if no IMGs have the show class, grab the first image
	var current = ($('ul.logos li.logosShow') ? $('ul.logos li.logosShow') : $('#ul.logos li:first'));

	//Get next image, if it reached the end of the slideshow, rotate it back to the first image
	var next = ((current.next().length) ? ((current.next().attr('id') == 'ssc') ? $('ul.logos li:first') : current.next()) : $('ul.logos li:first'));


	//Set the fade in effect for the next image, show class has higher z-index
	next.css({ opacity: 1.0 }).addClass('logosShow');

	//Hide the current image
	current.css({ opacity: 0.0 }).removeClass('logosShow');
}

function logoBackward() {
	//if no IMGs have the show class, grab the first image
	var current = ($('ul.logos li.logosShow') ? $('ul.logos li.logosShow') : $('#ul.logos li:last-child'));

	//Get next image, if it reached the end of the slideshow, rotate it back to the first image
	var next = ((current.prev().length) ? ((current.prev().attr('id') == 'ssc') ? $('ul.logos li:last-child') : current.prev()) : $('ul.logos li:last-child'));


	//Set the fade in effect for the next image, show class has higher z-index
	next.css({ opacity: 1.0 }).addClass('logosShow');

	//Hide the current image
	current.css({ opacity: 0.0 }).removeClass('logosShow');
}