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

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

arrImages[0] = ["../images/southwest_england/200/01_penzance8.jpg", 135, 200, "Mark posing by the Land's End signpost before setting off for John o'Groats", "../southwest_england/01_penzance.html", "../images/image.php?folder=southwest_england&image=01_penzance8.jpg&return=1"];
arrImages[1] = ["../images/southwest_england/200/13_street13.jpg", 150, 200, "Burrow Mump, Burrowbridge", "../southwest_england/13_street.html", "../images/image.php?folder=southwest_england&image=13_street13.jpg&return=1"];
arrImages[2] = ["../images/the_midlands/200/19_gloucester3.jpg", 150, 200, "Upton St Leonards", "../the_midlands/19_gloucester.html", "../images/image.php?folder=the_midlands&image=19_gloucester3.jpg&return=1"];
arrImages[3] = ["../images/northern_england/200/30_standedge4.jpg", 150, 200, "The pavement to Black Hill", "../northern_england/30_standedge.html", "../images/image.php?folder=northern_england&image=30_standedge4.jpg&return=1"];
arrImages[4] = ["../images/northern_england/200/41_alston8.jpg", 150, 200, "A tarn by Cross Fell", "../northern_england/41_alston.html", "../images/image.php?folder=northern_england&image=41_alston8.jpg&return=1"];
arrImages[5] = ["../images/southern_scotland/200/52_drymen8.jpg", 150, 200, "Peta on Duncryne Hill with Loch Lomond in the distance", "../southern_scotland/53_rowardennan.html", "../images/image.php?folder=southern_scotland&image=52_drymen8.jpg&return=1"];
arrImages[6] = ["../images/northern_scotland/200/70_john_o_groats22.jpg", 150, 200, "Mark posing by the signpost at John o'Groats", "../northern_scotland/70_john_o_groats.html", "../images/image.php?folder=northern_scotland&image=70_john_o_groats22.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) + ")";
}

