// define namespace to keep this separate from any other javascript on the site
var ALIVE = {};

// array for hero image on homepage
ALIVE.heroes = [];
//ALIVE.heroes.push(["Dexter Pitts", "pitts.jpg", "pitts.html"]);
//ALIVE.heroes.push(["Michael Jernigan", "jernigan.jpg", "jernigan.html"]);
//ALIVE.heroes.push(["Jay Wilkerson", "wilkerson.jpg", "wilkerson.html"]);
//ALIVE.heroes.push(["Jake Schick", "schick.jpg", "schick.html"]);
//ALIVE.heroes.push(["Crystal Davis", "davis.jpg", "davis.html"]);
ALIVE.heroes.push(["John Jones", "jones.jpg", "jones.html"]);
ALIVE.heroes.push(["Dawn Halfaker", "halfaker.jpg", "halfaker.html"]);
//ALIVE.heroes.push(["Jonathan Bartlett", "bartlett.jpg", "bartlett.html"]);
//ALIVE.heroes.push(["Eddie Ryan", "ryan.jpg", "ryan.html"]);
ALIVE.heroes.push(["Bryan Anderson", "anderson.jpg", "anderson.html"]);

// highlight the current bionav, if on a bio page
ALIVE.highlightBioNav = function(bio) {
	$('#bionav .' + bio).addClass("active");
};

// render the media block of the bio page, based on the specific bio
ALIVE.drawMedia = function(bio) {
	if (bio != undefined && ALIVE.media && ALIVE.media[bio]) {
		var buf = "";
		var last;
		
		// create each video thumbnail
		for (var i=0; i < ALIVE.media[bio]["video"].length; i++) {
			var asset = ALIVE.media[bio]["video"][i];
			// each video is on it's own row
			buf += '<div class="block videos">';
			if (i == 0)
				buf += '<h3>VIDEOS</h3>';
			buf += '<a href="#"><img id="v' + i + '" onclick="ALIVE.showVideo(\'' + i + '\')" src="' + asset.thumb + '" width="60" height="40" alt="' + asset.caption + '" title="' + asset.caption + '" /></a>';
			buf += '<div class="label">';
			buf += '<h4>' + asset.caption + '</h4>';
			buf += '<p>' + asset.date + '</p>';
			buf += '</div>';
			buf += '</div>';
		}
		
		buf += '<div class="block photos">';
		buf += '<h3>PHOTOS</h3>';
		for (var i=0; i < ALIVE.media[bio]["photo"].length; i++) {
			var asset = ALIVE.media[bio]["photo"][i];
			buf += '<a href="#"><img id="p' + i + '" onclick="ALIVE.showImage(' + i + ', ' + ALIVE.media[bio]["photo"].length + ')" src="' + asset.thumb + '" width="60" height="40" alt="' + asset.caption + '" title="' + asset.caption + '" /></a>';
		}
		buf += '</div>';

		// write the thumbnails to the page
		$('#media .right .thumbs').attr("innerHTML", buf);
		
		// draw the first asset
		if (ALIVE.media[bio]["video"].length > 0) {
			ALIVE.showVideo(0);
		} else if (ALIVE.media[bio]["photo"].length > 0) {
			ALIVE.showImage(0, ALIVE.media[bio]["photo"].length);
		}
	}
};

// display a large sized image if the thumbnail is clicked, or if the next/previous arrows are clicked
ALIVE.showImage = function(curr, total) {
	if (total > 0) {
		var image = '<img src="' + ALIVE.media[bio]["photo"][curr].large + '" width="480" height="340" alt="' + ALIVE.media[bio]["photo"][curr].caption + '" />';
		$('#media .left .large').attr("innerHTML", image);
		$('#media .left .caption p').attr("innerHTML", ALIVE.media[bio]["photo"][curr].caption);
		$('#video').hide();
		$('#photo').show();
		
		// highlight the active thumb
		$('#media .right .thumbs img').each(function() {
			$(this).removeClass("active");
			if ($(this).attr("id") == "p" + curr)
				$(this).addClass("active");
		});

		// update slideshow left arrow
		if (curr > 0) {
			$('#media .left .leftarrow').unbind("click");
			$('#media .left .leftarrow').bind("click", function() {
				ALIVE.showImage(curr - 1, total);
				return false;
			});
		} else {
			$('#media .left .leftarrow').unbind("click");
			$('#media .left .leftarrow').bind("click", function() {
				ALIVE.showImage(total - 1, total);
				return false;
			});
		}

		// update slideshow right arrow
		if (curr < total - 1) {
			$('#media .left .rightarrow').unbind("click");
			$('#media .left .rightarrow').bind("click", function() {
				ALIVE.showImage(curr + 1, total);
				return false;
			});
		} else {
			$('#media .left .rightarrow').unbind("click");
			$('#media .left .rightarrow').bind("click", function() {
				ALIVE.showImage(0, total);
				return false;
			});
		}
	}
};

// display the flash video player, if the thumbnail is clicked
ALIVE.showVideo = function(curr) {
	embedSWF("regular", "video", ALIVE.media[bio]["video"][curr].xml);
	$('#video').show();
	$('#photo').hide();

	// highlight the active thumb
	$('#media .right .thumbs img').each(function() {
		$(this).removeClass("active");
		if ($(this).attr("id") == "v" + curr)
			$(this).addClass("active");
	});
};

// display the full sized video player, only on "thefilm" page
ALIVE.loadFilm = function() {
	embedSWF("large", "video", "../video/vps_560_420/data/vp.xml");
};

// display a random hero image, only on the homepage
ALIVE.loadHero = function() {
	var ran = Math.floor(Math.random() * ALIVE.heroes.length);
	var hero = ALIVE.heroes[ran];
	var img = '<a href="bios/' + hero[2] + '"><img src="img/home/hero/' + hero[1] + '" width="417" height="522" alt="Portrait of ' + hero[0] + '" /></a>';
	$('#hero').attr("innerHTML", img);
};

// activate external links to open in new window
// search for all anchors with class="external"
ALIVE.externalLinks = function() {
	$('a.external').each(function() {
		$(this).attr("target", "_blank");
	});
};

/************************/
/* actions on dom ready */
/************************/
$(function() {
	// if this is a bio page, render media module
	try {
		if (bio) {
			ALIVE.highlightBioNav(bio);
			ALIVE.drawMedia(bio);
		}
	} catch(err) {
		// do nothing
	}
	
	// if this is the film page, load the flash movie
	try {
		if (thefilm) {
			ALIVE.loadFilm();
		}
	} catch(err) {
		// do nothing	
	}
	
	// if this is homepage, load the hero photo
	try {
		if (homepage) {
			ALIVE.loadHero();
		}
	} catch(err) {
		// do nothing	
	}
	
	// activate external links
	ALIVE.externalLinks();
});