/*jslint undef: true, sloppy: true */
/*global $, crossFade, document, setTimeout, setOpacity */

// Set up variables
var intCurrentImage = 0;
var arrImgNodes = [];
var arrImages = [];

arrImages[0] = ["../images/fraser_island/200/fraser_islandh.jpg", 129, 200, "Strange sand on Seventy-Five Mile Beach", "../fraser_island/day05.html", "../images/image.php?folder=fraser_island&image=fraser_islandh.jpg&return=1"];
arrImages[1] = ["../images/bada_valley/200/bada_valley3.jpg", 133, 200, "Mark crossing the Sungai Leriang", "../bada_valley/day01.html", "../images/image.php?folder=bada_valley&image=bada_valley3.jpg&return=1"];
arrImages[2] = ["../images/bada_valley/200/bada_valley6.jpg", 132, 200, "Palindo", "../bada_valley/day01.html", "../images/image.php?folder=bada_valley&image=bada_valley6.jpg&return=1"];
arrImages[3] = ["../images/bada_valley/200/bada_valleya.jpg", 142, 200, "Mark washing in a river", "../bada_valley/day03.html", "../images/image.php?folder=bada_valley&image=bada_valleya.jpg&return=1"];
arrImages[4] = ["../images/gunung_rinjani/200/gunung_rinjani3.jpg", 132, 200, "The view into the crater", "../gunung_rinjani/day02.html", "../images/image.php?folder=gunung_rinjani&image=gunung_rinjani3.jpg&return=1"];
arrImages[5] = ["../images/annapurna_circuit/200/annapurna_circuit_stage_23.jpg", 136, 200, "Children of Kagbeni", "../annapurna_circuit/day14-21.html", "../images/image.php?folder=annapurna_circuit&image=annapurna_circuit_stage_23.jpg&return=1"];
arrImages[6] = ["../images/hollyford-pyke_route/200/hollyford-pyke_routeb.jpg", 132, 200, "Mark knee-deep in the oozing Black Swamp", "../hollyford-pyke_route/day07.html", "../images/image.php?folder=hollyford-pyke_route&image=hollyford-pyke_routeb.jpg&return=1"];
arrImages[7] = ["../images/hollyford-pyke_route/200/hollyford-pyke_routec.jpg", 132, 200, "Mt Madeline", "../hollyford-pyke_route/day07.html", "../images/image.php?folder=hollyford-pyke_route&image=hollyford-pyke_routec.jpg&return=1"];
arrImages[8] = ["../images/mt_cook/200/mt_cook7.jpg", 133, 200, "Mt Cook and the Hooker Glacier", "../mt_cook/day01.html", "../images/image.php?folder=mt_cook&image=mt_cook7.jpg&return=1"];

arrImages.sort(function () { return (Math.round(Math.random()) - 0.5); });

// Code to be run when page is loaded
function fader() {
	var objImage, i;

	// If the firstHeader id is on the first heading
	if ($('#firstHeader').hasClass('initial')) {

		// Remove the initial class
		$('#firstHeader').removeClass('initial');

		// Insert image gallery header as the first heading
		$('#firstHeader').before('<h3 class="initial">From My Photo Library</h3>');

	} else {

		// Insert image gallery header, but not as the first heading
		$('#firstHeader').before('<h3>From My Photo Library</h3>');
	}

	// Insert div for image
	$(document.createElement('div')).attr('id', 'imageGallery').insertBefore('#firstHeader');

	// Insert image link
	$(document.createElement('a')).attr({href: arrImages[0][5], id: 'photoLink'}).prependTo("#imageGallery");

	// Insert img objects
	for (i = 0; i < arrImages.length; i += 1) {
		objImage = document.createElement("img");
		if (i === 0) {
			objImage.xOpacity = 0.99;
		} else {
			objImage.xOpacity = 0;
		}
		$(objImage).css('display', (i === 0) ? 'block' : 'none').attr({src: arrImages[i][0], width: arrImages[i][1], height: arrImages[i][2], alt: arrImages[i][3]}).appendTo('#photoLink');
	}

	// Get array of all img nodes in gallery
	arrImgNodes = $("#photoLink img");

	// Wait 5 seconds and start cross-fading
	setTimeout(crossFade, 5000);
}

// Cross-fade between two images
function crossFade() {
	var floatCurrentOpacity, floatNextOpacity, intNextImage;

	// Work out index for next image, wrapping round if necessary
	intNextImage = arrImgNodes[intCurrentImage + 1] ? intCurrentImage + 1 : 0;

	// Calculate new opacities
	floatCurrentOpacity = arrImgNodes[intCurrentImage].xOpacity - 0.05;
	floatNextOpacity = arrImgNodes[intNextImage].xOpacity + 0.05;
	if (floatNextOpacity > 0.99) {
		floatNextOpacity = 0.99;
	}

	// Make sure next image is visible
	arrImgNodes[intNextImage].style.display = "block";

	// Set new opacities
	setOpacity(arrImgNodes[intCurrentImage], floatCurrentOpacity);
	setOpacity(arrImgNodes[intNextImage], floatNextOpacity);

	if (floatCurrentOpacity <= 0) {

		// Fade is finished, so hide previous image
		arrImgNodes[intCurrentImage].style.display = "none";

		// Make image link to new destination
		intCurrentImage = intNextImage;
		$('#photoLink').attr('href', arrImages[intCurrentImage][5]);

		// And start cross-fading again in 5 seconds
		setTimeout(crossFade, 5000);

	} else {

		// Otherwise cross-fade again in 50 milliseconds
		setTimeout(crossFade, 50);

	}
}

// Set opacity in a way that most browsers will understand
function setOpacity(objImgNode, floatOpacity) {
	objImgNode.xOpacity = floatOpacity;
	objImgNode.style.opacity = floatOpacity;
	objImgNode.style.MozOpacity = floatOpacity;
	objImgNode.style.filter = "alpha(opacity=" + (floatOpacity * 100) + ")";
}