// Set window- and layer-related variables
var dWidLyr  = 610;
var dHgtLyr  = 600;
var curSlide = 0;
var zIdx 	 = -1;
var isVis 	 = false;

// Set browser-determined global variables
var NN 		 = (document.layers ? true : false);
var sWidPos  = ((NN ? outerWidth  : screen.availWidth)  / 2) - (dWidLyr / 2);
var sHgtPos  = ((NN ? outerHeight : screen.availHeight) / 2) - (dHgtLyr / 2);
var hideName = (NN ? 'hide' : 'hidden');
var showName = (NN ? 'show' : 'visible');


//Set image-related variables
var img = new Array();
var imgOut = new Array();
var imgOver = new Array();
var layerList = new Array();
var imgPath = 'woodcuts/cats/';

// Set tour-realted variables
var showSpeed = 3500;
var tourOn = false;

// Define a function to generate layers
function genLayer(sName, sLeft, sTop, sWdh, sHgt, sVis, copy) {
	if (NN) {
		document.writeln('<LAYER NAME="' + sName + '" LEFT=' + sLeft + ' TOP=' + sTop +
		' WIDTH=' + sWdh + ' HEIGHT=' + sHgt + ' VISIBILITY="' + sVis + '"' +
		' z-Index=' + (++zIdx) + '>' + copy + '</LAYER>');
		}
	else {
		document.writeln('<DIV ID="' + sName + '" STYLE="position:absolute; overflow:none; left:' +
			sLeft + 'px; top:' + sTop + 'px; width:' + sWdh + 'px; height:' + sHgt + 'px;' +
			' visibility:' + sVis + '; z-Index=' + (++zIdx) + '">' +
			copy + '</DIV>'
			);
		}
	}

// Define an object constructor for each slide
function slide(imgStr, artwork, size) {
	this.name    = imgStr;
	this.artwork = artwork;
	this.size = size;
	this.structure =
		'<TABLE class="artists" border="0" bordercolor="red" CELLPADDING=5><TR><TD VALIGN=TOP align=center width="460">' +
		'<IMG SRC=' + imgPath + imgStr +'.jpg></TD>' +
		'<TD VALIGN=TOP align=left width="140"><span class="arthdg">TITLE:</span>&nbsp;&nbsp;<br><span class="arttext">' +
		artwork + '</span><p><span class="arthdg">SIZE:</span><br><span class="arttext">' +
		size + '</span></TD></TR></TABLE>';

	// Preload corresponding images while we're at it
	imagePreLoad(imgStr);

	return this;
	}

// Define a function to preload the images
function imagePreLoad(imgStr) {
	// Images for the slides
	img[img.length]	= new Image();
  	img[img.length - 1].src = imgPath + imgStr + '.jpg';

	// Primary images for the slide menu
	imgOut[imgOut.length] = new Image();
	imgOut[imgOut.length - 1].src = imgPath + imgStr + 'out.jpg';

	// Rollover images for the slide menu
	imgOver[imgOver.length] = new Image();
	imgOver[imgOver.length - 1].src = imgPath + imgStr + 'out.jpg';
	}

// Define an array to store all of the slide objects
var slideShow  = new Array(

			new slide('bea_garden', "Bea's Garden", '15 &nbsp;x&nbsp; 15'),
			new slide('on_the_lookout', 'On the Lookout', '&nbsp;'),
			new slide('lets_play', "Let's Play", '&nbsp;'),
			new slide('taking_the_sun', 'Taking the Sun', '&nbsp;'),
			new slide('getting_sleepy', 'Getting Sleepy', '7 1/2 &nbsp;x&nbsp; 7 1/2'),
			new slide('cat_bird', 'Cat Bird', '7 1/2 &nbsp;x&nbsp; 7'),			
			new slide('damn_bell', 'Damn Bell', '6 1/4 &nbsp;x&nbsp; 8 1/2'),
			new slide('three_hunters', 'Three Hunters', '15 1/2 &nbsp;x&nbsp; 10'),
			new slide('dusty', 'Dusty', '6 3/4 &nbsp;x&nbsp; 7 1/4'),
			new slide('stalker', 'Stalker', '8 1/2 &nbsp;x&nbsp; 4 1/2')

			);

// Capitalize the first letter of the word passed
// Makes for better looking copy
function camelCap(str) {
	return str.substring(0, 1).toUpperCase() + str.substring(1);
	}

// This generates all layers (or styles) to display for the screen
function genScreen() {
	var menuStr = '';
	for (var i = 0; i < slideShow.length; i++) {
		// Create all of the animal slide layers
		genLayer('slide' + i, sWidPos + 80, 180, dWidLyr, dHgtLyr, (i == 0 ? showName : hideName), slideShow[i].structure);

		// While iterating, build the HTML string for the menu layer
		menuStr += '<A HREF="" onMouseOver="hideStatus(); if(!tourOn) { setSlide(' + i + ');' +
			' imageSwap(\'' + slideShow[i].name + '\', ' + i + ', true)}; return true;"' +
			' onMouseOut="hideStatus(); if(!tourOn) { setSlide(' + i + ');' +
			' imageSwap(\'' + slideShow[i].name + '\', ' + i + ', false)}; return true;"' +
			' onClick="return false;"><IMG NAME="' + slideShow[i].name + '" SRC="' + imgPath + slideShow[i].name + 'out.jpg" BORDER=0></A><BR>';
		}

	// Create the guide layer (prev/next)
  	genLayer('guide', sWidPos - 80, 180, 100, 200, showName,
  		'<DIV ID="menuConstraint">' +
  		'<A HREF="javascript: if(!tourOn) { changeSlide(-1); }" onMouseOver="hideStatus(); return true;">' +
  		'<=== &nbsp;</A>' +
  		'<A HREF="javascript: if(!tourOn) { changeSlide(1); }" onMouseOver="hideStatus(); return true;">' +
  		' ===></A></DIV>'
		);

	// Create the menu
	genLayer('menu', sWidPos - 80, 200, 0, 200, showName,
		'<DIV ID="menuConstraint"><TABLE border="0" bordercolor="yellow" cellpadding="2"><TD>' +
		menuStr + '</TD></TABLE></DIV>'
		);
	}

// Define a function to hide layers
function hideLayer(name) {
	refLayer(name).visibility = hideName;
	}

// Define a function to reveal layers
function showLayer(name) {
	refLayer(name).visibility = showName;
	}

// Define a central function to reference layers (this has been corrected from original code)
function refLayer(name) {
	if (NN) { return document.layers[name]; }	
  	else { return document.getElementById(name).style; }
	}

// Hide or show the animal guide
function menuManager() {
	if (isVis) {	hideLayer('menu'); }
	else { showLayer('menu'); }
	isVis = !isVis;
	}

// Function to change slides if the user navigates with the arrows
function changeSlide(offset) {
	// Hide the existing Layer
	hideLayer('slide' + curSlide);

	// Calculate the next layer index number
	curSlide = (curSlide + offset < 0 ? slideShow.length - 1 :
		(curSlide + offset == slideShow.length ? 0 : curSlide + offset));

	// Show the desired layer
	showLayer('slide' + curSlide);
	}

// Function to change the slide if user navigates with the menu
function setSlide(ref) {
	if (tourOn) { return; }
	hideLayer('slide' + curSlide);
	curSlide = ref;
	showLayer('slide' + curSlide);
	}

// Image rollover function
function imageSwap(imagePrefix, imageIndex, isOver) {
	if (isOver) { document[imagePrefix].src = imgOver[imageIndex].src; }
	else { document[imagePrefix].src = imgOut[imageIndex].src; }
	}

// Places an empty string in the status bar to avoid annoying URL displays
function hideStatus() { window.status = ''; }

// Start or stop the automated tour
function autoPilot() {
	// Stop the tour if it is running
	if (tourOn) {
		clearInterval(auto);
		imageSwap(slideShow[curSlide].name, curSlide, false);
		}
	// Otherwise begin the tour from the currently viewed slide
	else {
		auto = setInterval('automate()', showSpeed);
		imageSwap(slideShow[curSlide].name, curSlide, true);

		// Show the menu if it is not currrently visible
		showLayer('menu');
		visible = true;
		}
	tourOn = !tourOn;
	}

// Automate the slideshow
function automate() {
	// Incite the image rollver
	imageSwap(slideShow[curSlide].name, curSlide, false);

	// Incite the slide change
	changeSlide(1);

	// Incite the image rollver
	imageSwap(slideShow[curSlide].name, curSlide, true);
	}