// JavaScript Document

var whichXML = ['animation','video'];
var basePath = "/portfolio/local/xml/";


/* PORTFOLIO PAGE */

function createAnimationIndex()
{
	importXML(basePath + "portfolio_animation.xml");
	
	var animations = xmlDoc.getElementsByTagName("ANIMATION");
	var animationsLength = animations.length;
	
	var animationList = "<h2 class='serviceArea_title'>Animation Samples</h2>";
	animationList += "<ul>";
	for (var i=0; i<animationsLength; i++) {		
		animationList += "<li class='clip'>";
		animationList += "<a href='/portfolio/sampleanimation.html?"+i+"'>";
		animationList += "<img src='/portfolio/local/images/animation/"+xmlDoc.getElementsByTagName("IMAGE")[i].firstChild.data+"' ";
		animationList += 'alt="'+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+'" width="115" height="86" />';
		animationList += "<h3>";
		animationList += xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+"</h3></a>";
		animationList += "<p>"+xmlDoc.getElementsByTagName("SUBHEAD")[i].firstChild.data+"</p>";
		animationList += "</li>";
	}
	animationList += "</ul>";
	
	document.getElementById('tabs-animation').innerHTML = animationList;
}

function createWebdesignIndex()
{
	importXML(basePath + "portfolio_webdesign.xml");
	
	var websites = xmlDoc.getElementsByTagName("WEBSITE");
	var websitesLength = websites.length;
	
	var webList = "<h2 class='serviceArea_title'>Web Design Samples</h2>";
	webList += "<ul>";
	for (var i=0; i<websitesLength; i++) {
		webList += "<li class='clip'>";
		webList += "<a href='http://"+xmlDoc.getElementsByTagName("URL")[i].firstChild.data+"'";
		if (xmlDoc.getElementsByTagName("URL")[i].firstChild.data != "www.mzamultimedia.com") {
			webList += " target='_blank'";
		}
		webList += "><img src='/portfolio/local/images/webdesign/"+xmlDoc.getElementsByTagName("IMAGE")[i].firstChild.data+"' ";
		webList += 'alt="'+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+'" width="115" height="81" />';
		webList += "<h3>";
		if (xmlDoc.getElementsByTagName("FAVICON")[i].hasChildNodes()==1) {
			webList += "<img src='/portfolio/local/images/webdesign/"+xmlDoc.getElementsByTagName("FAVICON")[i].firstChild.data+"' ";
			webList += 'alt="'+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+' favicon" width="16" height="16" class="favicon" />';
		}
		webList += xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+"</h3>";
		webList += "</a></li>";
	}
	webList += "</ul>";
	
	document.getElementById('tabs-webdesign').innerHTML = webList;
}

function createIllustrationIndex()
{
	importXML(basePath + "portfolio_illustration.xml");
	
	var illustrations = xmlDoc.getElementsByTagName("ILLUSTRATION");
	var illustrationsLength = illustrations.length;
	var imageName, titleName;
	
	var illustrationList = "<h2 class='serviceArea_title'>Illustration Samples</h2>";
	illustrationList += "<ul>";
	for (var i=0; i<illustrationsLength; i++) {
		imageName = xmlDoc.getElementsByTagName("IMAGE")[i];
		titleName = xmlDoc.getElementsByTagName("TITLE")[i];
		illustrationList += "<li class='clip'>";
		illustrationList += "<a href='/portfolio/local/images/illustration/"+imageName.firstChild.data+"' ";
		illustrationList += 'rel="lightbox[illustration]" title="'+titleName.firstChild.data+'">';
		illustrationList += "<img src='/portfolio/local/images/illustration/tn-"+imageName.firstChild.data+"' ";
		illustrationList += 'alt="'+titleName.firstChild.data+'" width="115" height="81" />';
		illustrationList += "<h3>"+titleName.firstChild.data+"</h3>";
		illustrationList += "</a></li>";
	}
	illustrationList += "</ul>";
	
	document.getElementById('tabs-illustration').innerHTML = illustrationList;
}

function createGraphicdesignIndex()
{
	importXML(basePath + "portfolio_graphicdesign.xml");
	
	var gdesigns = xmlDoc.getElementsByTagName("DESIGN");
	var gdesignsLength = gdesigns.length;
	var imageName, titleName;
	
	var gdesignsList = "<h2 class='serviceArea_title'>Print Design Samples</h2>";
	gdesignsList += "<ul>";
	for (var i=0; i<gdesignsLength; i++) {
		imageName = xmlDoc.getElementsByTagName("IMAGE")[i];
		titleName = xmlDoc.getElementsByTagName("TITLE")[i];
		gdesignsList += "<li class='clip'>";
		gdesignsList += "<a href='/portfolio/local/images/graphicdesign/"+imageName.firstChild.data+"' ";
		gdesignsList += 'rel="lightbox[design]" title="'+titleName.firstChild.data+'">';
		gdesignsList += "<img src='/portfolio/local/images/graphicdesign/tn-"+imageName.firstChild.data+"' ";
		gdesignsList += 'alt="'+titleName.firstChild.data+'" width="115" height="81" />';
		gdesignsList += "<h3>"+titleName.firstChild.data+"</h3>";
		gdesignsList += "</a></li>";
	}
	gdesignsList += "</ul>";
	
	document.getElementById('tabs-graphicdesign').innerHTML = gdesignsList;
}

function createPhotographyIndex()
{
	importXML(basePath + "portfolio_photography.xml");
	
	var photographs = xmlDoc.getElementsByTagName("PHOTOGRAPH");
	var photographsLength = photographs.length;
	var imageName, titleName;
	
	var photographList = "<h2 class='serviceArea_title'>Photography Samples</h2>";
	photographList += "<ul>";
	for (var i=0; i<photographsLength; i++) {
		imageName = xmlDoc.getElementsByTagName("IMAGE")[i];
		titleName = xmlDoc.getElementsByTagName("TITLE")[i];
		photographList += "<li class='clip'>";
		photographList += "<a href='/portfolio/local/images/photography/"+imageName.firstChild.data+"' ";
		photographList += 'rel="lightbox[photograph]" title="'+titleName.firstChild.data+'">';
		photographList += "<img src='/portfolio/local/images/photography/tn-"+imageName.firstChild.data+"' ";
		photographList += 'alt="'+titleName.firstChild.data+'" width="115" height="81" />';
		photographList += "<h3>"+titleName.firstChild.data+"</h3>";
		photographList += "</a></li>";
	}
	photographList += "</ul>";
	
	document.getElementById('tabs-photography').innerHTML = photographList;
}

function createVideoIndex()
{
	importXML(basePath + "portfolio_video.xml");
	
	var videos = xmlDoc.getElementsByTagName("VIDEO");
	var videosLength = videos.length;
	var imageName, titleName, subHead;
	
	var videoList = "<h2 class='serviceArea_title'>Video Samples</h2>";
	videoList += "<ul>";
	for (var i=0; i<videosLength; i++) {
		imageName = xmlDoc.getElementsByTagName("IMAGE")[i];
		titleName = xmlDoc.getElementsByTagName("TITLE")[i];
		subHead = xmlDoc.getElementsByTagName("SUBHEAD")[i];
		videoList += "<li class='clip'>";
		videoList += "<a href='/portfolio/samplevideo.html?"+i+"'>";
		videoList += "<img src='/portfolio/local/images/video/"+imageName.firstChild.data+"' ";
		videoList += 'alt="'+titleName.firstChild.data+'" width="115" height="86" />';
		videoList += "<h3>"+titleName.firstChild.data+"</h3></a>";
		videoList += "<p>"+subHead.firstChild.data+"</p>";
		videoList += "</li>";
	}
	videoList += "</ul>";
	
	document.getElementById('tabs-video').innerHTML = videoList;
}


/* SAMPLE ANIMATIONS */

function createLocalNav(sampleType)
{	
	var animations = xmlDoc.getElementsByTagName(sampleType.toUpperCase());
	var animationsLength = animations.length;
	
	var localNav = "<ul id='tn-clips'>";
	for (var i=0; i<animationsLength; i++) {
		localNav += "<li>";
		localNav += "<a href='#' onclick='selectclip("+i+"); return false;' id='tn-"+i+"' >";
		localNav += "<img src='/portfolio/local/images/"+sampleType+"/"+xmlDoc.getElementsByTagName("IMAGE")[i].firstChild.data+"' ";
		localNav += 'alt="'+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+'" width="44" height="33" ';
		localNav += 'title="'+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+'"/></a>';
		localNav += "</li>";
	}
	localNav += "</ul>";
	
	document.write(localNav);
}

function selectclip(clipIndex)
{
	if ((document.getElementById("tn-"+clipIndex).className).indexOf("thumbSelected") == -1) {
		var clipname = xmlDoc.getElementsByTagName("CLIP")[clipIndex].firstChild.data;
		//var clipheight = parseInt(xmlDoc.getElementsByTagName("HEIGHT")[clipIndex].firstChild.data)/*+ 46*/;
			
		document.getElementById("cliptitle").innerHTML = xmlDoc.getElementsByTagName("TITLE")[clipIndex].firstChild.data;
		var summaryNote = "<p id='summaryNote'>"+xmlDoc.getElementsByTagName("SUBHEAD")[clipIndex].firstChild.data+"</p>";
		var audioNote = "";
		if (xmlDoc.getElementsByTagName("AUDIO")[clipIndex].hasChildNodes()==1) {
			audioNote = "<p id='audioNote'><b>NOTE:</b> This clip contains audio.</p>";
		}
		var creditNote = "";
		if (xmlDoc.getElementsByTagName("CREDIT")[clipIndex].hasChildNodes()==1) {
			creditNote = "<p id='creditNote'>"+xmlDoc.getElementsByTagName("CREDIT")[clipIndex].firstChild.data+"</p>";
		}
		document.getElementById("clipsubhead").innerHTML = summaryNote + audioNote + creditNote;
	
		var chosenclip = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="362" height="274" id="swfmovie">'+
						 '<param name="movie" value="/portfolio/local/video/FLVPlayer_Portfolio.swf?clip='+clipname+'.flv" />'+
						 '<param name="play" value="true" />'+
						 '<param name="menu" value="false" />'+
						 '<param name="quality" value="high" />'+
						 '<param name="wmode" value="opaque" />'+
						 '<!--[if !IE]>-->'+
						 '<object type="application/x-shockwave-flash" data="/portfolio/local/video/FLVPlayer_Portfolio.swf?clip='+clipname+'.flv" width="362" height="274">'+
						 '<param name="play" value="true" />'+
						 '<param name="menu" value="false" />'+
						 '<param name="quality" value="high" />'+
						 '<param name="wmode" value="opaque" />'+
						 '<!--<![endif]-->'+
						 '<p style="padding:15px 0;">Adobe Flash Player 8 or higher is required to view this content.</p>'+
						 '<a href="http://www.adobe.com/go/getflashplayer">'+
						 '<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a>'+
						 '<!--[if !IE]>--></object><!--<![endif]--></object>';	
		
		var clipaward = "";
		var awards = xmlDoc.getElementsByTagName("AWARDS");
		if (awards[clipIndex].hasChildNodes()==1) {
			var awardName = awards[clipIndex].getElementsByTagName("AWARD");
			clipaward += "<ul id='awards'>";
			for (i=0; i<awardName.length; i++) {
				//clipaward = awards[clipIndex].firstChild.data;
				clipaward += "<li class='"+awardName[i].firstChild.data+"' /></li>";
			}
		}
	
		document.getElementById("movieclip").innerHTML = chosenclip;
		document.getElementById("clipaward").innerHTML = clipaward;
		
		// Update Thumbnails
		var clipsLength = xmlDoc.getElementsByTagName("CLIP").length;
		for (i=0; i<clipsLength; i++) {
			document.getElementById("tn-"+i).className = "";
		}
		document.getElementById("tn-"+clipIndex).className = "thumbSelected";
	}
}


/* HOME PAGE */

function animationIndex_home()
{
	importXML(basePath + "portfolio_animation.xml");
	
	var animations = xmlDoc.getElementsByTagName("ANIMATION");
	var animationsLength = animations.length;
	
	var portIndex = "<ul>";
	for (var i=1; i<5; i++) {
		portIndex += "<li";
		if (i == 1) {
			portIndex += " class='first'";
		}
		portIndex += "><a href='/portfolio/sampleanimation.html?"+i+"' >";
		portIndex += "<img src='/portfolio/local/images/animation/"+xmlDoc.getElementsByTagName("IMAGE")[i].firstChild.data+"' ";
		portIndex += 'alt="'+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+'" width="68" height="51" />';
		portIndex += "<h4 class='portTitle'>"+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+"</h4>";
		portIndex += "<p class='portCopy'>"+xmlDoc.getElementsByTagName("SUBHEAD")[i].firstChild.data+"</p>";
		portIndex += "</a></li>";
	}
	portIndex += "<li class='last'><p class='viewAll'><a href='/portfolio/'>View All</a></p></li>";
	portIndex += "</ul>";
	
	document.write(portIndex);
}

function webdesignIndex_home()
{
	importXML(basePath + "portfolio_webdesign.xml");
	
	var websites = xmlDoc.getElementsByTagName("WEBSITE");
	var websitesLength = websites.length;
	
	var portIndex = "<ul>";
	for (var i=0; i<3; i++) {
		portIndex += "<li";
		if (i === 0) {
			portIndex += " class='first'";
		}
		portIndex += ">";
		portIndex += "<h4 class='portTitle'>";
		portIndex += "<a href='http://"+xmlDoc.getElementsByTagName("URL")[i].firstChild.data+"/' ";
		portIndex += 'title="'+xmlDoc.getElementsByTagName("URL")[i].firstChild.data+'" target="_blank">';
		portIndex += "<img src='/portfolio/local/images/webdesign/"+xmlDoc.getElementsByTagName("IMAGE")[i].firstChild.data+"' ";
		portIndex += 'alt="'+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+'" width="122" height="86" />';
		portIndex += "<img src='/portfolio/local/images/webdesign/"+xmlDoc.getElementsByTagName("FAVICON")[i].firstChild.data+"' ";
		portIndex += 'alt="'+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+' favicon" width="16" height="16" class="favicon" />';
		portIndex += xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data;
		portIndex += "</a></h4></li>";
	}
	portIndex += "<li class='last'><p class='viewAll'><a href='/portfolio/#web'>View All</a></p></li>";
	portIndex += "</ul>";
	
	document.write(portIndex);
}


/* SOLUTIONS PAGES */

function animationIndex_solutions()
{
	importXML(basePath + "portfolio_animation.xml");
	
	var portIndex = "<ul>";
	for (i=1; i<5; i++) {
		portIndex += "<li>";
		portIndex += "<a href='/portfolio/sampleanimation.html?"+i+"' ";
		portIndex += 'title="'+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+'">';
		portIndex += "<img src='/portfolio/local/images/animation/"+xmlDoc.getElementsByTagName("IMAGE")[i].firstChild.data+"' ";
		portIndex += 'alt="'+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+'" width="115" height="86" />';
		portIndex += "</a></li>";
	}
	portIndex += "</ul>";
	portIndex += "<p class='viewAll'><a href='/portfolio/'>View All</a></p>";
	
	document.write(portIndex);
}

function illustrationIndex_solutions()
{
	importXML(basePath + "portfolio_illustration.xml");
	var illustrations = xmlDoc.getElementsByTagName("ILLUSTRATION");
	var illustrationsLength = illustrations.length;
	var imageName, titleName;
	var randomNumbers = [];
	for (var i=0; i<4; i++) {
		newRandomNum = Math.floor(Math.random()*illustrationsLength);
		while (randomNumbers.indexOf(newRandomNum) !== -1) {
			newRandomNum = Math.floor(Math.random()*illustrationsLength);
		}
		randomNumbers[i] = newRandomNum;
	}
		
	var portIndex = "<ul>";
	for (i=0; i<4; i++) {
		imageName = xmlDoc.getElementsByTagName("IMAGE")[randomNumbers[i]];
		titleName = xmlDoc.getElementsByTagName("TITLE")[randomNumbers[i]];
		portIndex += "<li>";
		portIndex += "<a href='/portfolio/local/images/illustration/"+imageName.firstChild.data+"' ";
		portIndex += 'rel="lightbox[illustration]" title="'+titleName.firstChild.data+'">';
		portIndex += "<img src='/portfolio/local/images/illustration/tn-"+imageName.firstChild.data+"' ";
		portIndex += 'alt="'+titleName.firstChild.data+'" width="115" height="81" />';
		portIndex += "</a></li>";
	}
	portIndex += "</ul>";
	portIndex += "<p class='viewAll'><a href='/portfolio/#illustration'>View All</a></p>";
	
	document.write(portIndex);
}

function graphicdesignIndex_solutions()
{
	importXML(basePath + "portfolio_graphicdesign.xml");
	var gdesigns = xmlDoc.getElementsByTagName("DESIGN");
	var gdesignsLength = gdesigns.length;
	var imageName, titleName;
	var randomNumbers = [];
	for (var i=0; i<4; i++) {
		newRandomNum = Math.floor(Math.random()*gdesignsLength);
		while (randomNumbers.indexOf(newRandomNum) !== -1) {
			newRandomNum = Math.floor(Math.random()*gdesignsLength);
		}
		randomNumbers[i] = newRandomNum;
	}
		
	var portIndex = "<ul>";
	for (i=0; i<4; i++) {
		imageName = xmlDoc.getElementsByTagName("IMAGE")[randomNumbers[i]];
		titleName = xmlDoc.getElementsByTagName("TITLE")[randomNumbers[i]];
		portIndex += "<li>";
		portIndex += "<a href='/portfolio/local/images/graphicdesign/"+imageName.firstChild.data+"' ";
		portIndex += 'rel="lightbox[graphicdesign]" title="'+titleName.firstChild.data+'">';
		portIndex += "<img src='/portfolio/local/images/graphicdesign/tn-"+imageName.firstChild.data+"' ";
		portIndex += 'alt="'+titleName.firstChild.data+'" width="115" height="81" />';
		portIndex += "</a></li>";
	}
	portIndex += "</ul>";
	portIndex += "<p class='viewAll'><a href='/portfolio/#print'>View All</a></p>";
	
	document.write(portIndex);
}

function webdesignIndex_solutions()
{
	importXML(basePath + "portfolio_webdesign.xml");
	var websites = xmlDoc.getElementsByTagName("WEBSITE");
	var websitesLength = websites.length;
	var imageName, titleName, urlName;
	var randomNumbers = [];
	for (var i=0; i<4; i++) {
		newRandomNum = Math.floor(Math.random()*(websitesLength-3));	// Excludes last 3 websites
		while (randomNumbers.indexOf(newRandomNum) !== -1) {
			newRandomNum = Math.floor(Math.random()*(websitesLength-3));	// Excludes last 3 websites
		}
		randomNumbers[i] = newRandomNum;
	}
	
	var portIndex = "<ul>";
	for (i=0; i<4; i++) {
		imageName = xmlDoc.getElementsByTagName("IMAGE")[randomNumbers[i]];
		titleName = xmlDoc.getElementsByTagName("TITLE")[randomNumbers[i]];
		urlName = xmlDoc.getElementsByTagName("URL")[randomNumbers[i]];
		portIndex += "<li>";
		portIndex += "<a href='http://"+urlName.firstChild.data+"/' ";
		portIndex += 'title="'+urlName.firstChild.data+'"';
		if (urlName.firstChild.data != "www.mzamultimedia.com") {
			portIndex += " target='_blank'";
		}
		portIndex += "><img src='/portfolio/local/images/webdesign/"+imageName.firstChild.data+"' ";
		portIndex += 'alt="'+titleName.firstChild.data+'" width="115" height="81" />';
		portIndex += "</a></li>";
	}
	portIndex += "</ul>";
	portIndex += "<p class='viewAll'><a href='/portfolio/#web'>View All</a></p>";
	
	document.write(portIndex);
}

function videoIndex_solutions()
{
	importXML(basePath + "portfolio_video.xml");
	
	var portIndex = "<ul>";
	for (i=0; i<4; i++) {
		portIndex += "<li>";
		portIndex += "<a href='/portfolio/samplevideo.html?"+i+"' ";
		portIndex += 'title="'+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+'">';
		portIndex += "<img src='/portfolio/local/images/video/"+xmlDoc.getElementsByTagName("IMAGE")[i].firstChild.data+"' ";
		portIndex += 'alt="'+xmlDoc.getElementsByTagName("TITLE")[i].firstChild.data+'" width="115" height="86" />';
		portIndex += "</a></li>";
	}
	portIndex += "</ul>";
	portIndex += "<p class='viewAll'><a href='/portfolio/#video'>View All</a></p>";
	
	document.write(portIndex);
}

function photoIndex_solutions()
{
	importXML(basePath + "portfolio_photography.xml");
	var photographs = xmlDoc.getElementsByTagName("PHOTOGRAPH");
	var photographsLength = photographs.length;
	var imageName, titleName;
	var randomNumbers = [];
	for (var i=0; i<4; i++) {
		newRandomNum = Math.floor(Math.random()*photographsLength);
		while (randomNumbers.indexOf(newRandomNum) !== -1) {
			newRandomNum = Math.floor(Math.random()*photographsLength);
		}
		randomNumbers[i] = newRandomNum;
	}
		
	var portIndex = "<ul>";
	for (i=0; i<4; i++) {
		imageName = xmlDoc.getElementsByTagName("IMAGE")[randomNumbers[i]];
		titleName = xmlDoc.getElementsByTagName("TITLE")[randomNumbers[i]];
		portIndex += "<li>";
		portIndex += "<a href='/portfolio/local/images/photography/"+imageName.firstChild.data+"' ";
		portIndex += 'rel="lightbox[photograph]" title="'+titleName.firstChild.data+'">';
		portIndex += "<img src='/portfolio/local/images/photography/tn-"+imageName.firstChild.data+"' ";
		portIndex += 'alt="'+titleName.firstChild.data+'" width="115" height="81" />';
		portIndex += "</a></li>";
	}
	portIndex += "</ul>";
	portIndex += "<p class='viewAll'><a href='/portfolio/#photo'>View All</a></p>";
	
	document.write(portIndex);
}


function portfolio_animationNav(xmlIndex) {
	importXML(basePath + 'portfolio_'+whichXML[xmlIndex]+'.xml');
	createLocalNav(whichXML[xmlIndex]);
}

function portfolio_animationClip(clipIndex,xmlIndex) {
	importXML(basePath + 'portfolio_'+whichXML[xmlIndex]+'.xml');
	selectclip(clipIndex);
}

function portfolioIndexTabs() {
	createAnimationIndex();
	createWebdesignIndex();
	createIllustrationIndex();
	createGraphicdesignIndex();
	createPhotographyIndex();
	createVideoIndex();
}