// JavaScript Document
//run-catch problem with window.onload = initializeMenu("projectList");

// constants
var aExts = new Array('xhtml', 'css', 'jscript', 'as2', 'oop', 'xml', 'dw', 'fl', 'ps', 'ai', 'fw', 'id');
var aNames = new Array('xhtml', 'Cascading Style Sheets', 'javascript', 'ActionScript 2.0', 'object oriented programming', 'xml', 'Dreameweaver', 'Flash', 'Photoshop', 'Illustrator', 'Fireworks', 'inDesign');

var isLoaded = false;
var xmlDoc;
var aFeatured;

function init(){	
	importXML("projects.xml");		
}
function initializeMenu() {	
	if(isLoaded) {		
		generateMenu();
	} else {
		importXML("projects.xml");	
	}
}

function importXML(file) {
 //var xmlDoc;
 /*
 
 	if (document.implementation && document.implementation.createDocument)
	{
		xmlDoc = document.implementation.createDocument("", "", null);
		xmlDoc.onload = readXML;
	}
	else if (window.ActiveXObject)
	{
		xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
		xmlDoc.onreadystatechange = function () {
			if (xmlDoc.readyState == 4) readXML();
		};
 	}
	else
	{
		alert('Your browser can\'t handle this script');
		return;
	}
	xmlDoc.load(file);

 */
 
 
 var moz = (typeof document.implementation != 'undefined') && (typeof document.implementation.createDocument != 'undefined'); 
 var ie = (typeof window.ActiveXObject != 'undefined');
 if (moz) {	 
   xmlDoc = document.implementation.createDocument("", "", null)
   xmlDoc.onload = readXML;
 } else if (ie) {
   	xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
	
	xmlDoc.onreadystatechange = function () {
		if (xmlDoc.readyState == 4) readXML();
	};
 }
 xmlDoc.async = false;
 xmlDoc.load(file);
}

function readXML() {
	aFeatured = getFeaturedArray();
	generateMenu();
	isLoaded = true;
}

//  ****************************** MENU GENERATION FUNCTIONS  **********************************

function generateMenu(ext){
	var aMenuItems;
	if(ext == undefined) {
		// full menu
		aMenuItems = aFeatured;
		resetTechImg();
		document.getElementById('allBttn').setAttribute('src', 'img/all_button-de.jpg');		
	} else {
		// menu by tech
		aMenuItems = generateMenuItemArrayByTech(ext);
		document.getElementById('allBttn').setAttribute('src', 'img/all_button-act.jpg');
	}
	
	var listLength = 4;
	var counter = 0;

	var targetDiv = document.getElementById('sm_footer');	
	removeTagFrom('UL', targetDiv);	
	var listNode = document.createElement('UL');
	
	for(var j=0; j<aMenuItems.length; j++) {
		listNode.appendChild(generateMenuLI(aMenuItems[j]));
		counter++;
		if(counter == listLength) {
			counter = 0;
			targetDiv.appendChild(listNode);
			listNode = document.createElement('UL');			
		}	
	}
	listNode.setAttribute('class', 'lst_menu');
	targetDiv.appendChild(listNode);
}

// returns array of nodes that have been set to be featured on the site
function getFeaturedArray() {	
	var aProjects = xmlDoc.getElementsByTagName("project");
	var aFeatured = new Array();
	for(var i=0; i<aProjects.length; i++) {
		var featured = aProjects[i].getAttribute("featured");
		if(featured == "yes") {
			aFeatured.push(aProjects[i]);
		}		
	}
	return aFeatured;	
}

// generates array of the project which has tag equal to argument
function generateMenuItemArrayByTech(ext) {	
	var aMenuItems = new Array();
	var isItem;
	for(var i=0; i<aFeatured.length; i++) {
		var techString = aFeatured[i].getElementsByTagName("tags")[0].firstChild.data;
		isItem = techString.search(ext);
		if(isItem != -1) {
			aMenuItems.push(aFeatured[i]);
		}
	}
	return aMenuItems;
}

function generateMenuLI(project) {
	var aTitle = project.getElementsByTagName("title");
	var projName = aTitle[0].firstChild.data;
	var liNode = document.createElement('LI');
	var linkNode = document.createElement('A');
	var hrefValue = 'javascript:setPage(' + project.getAttribute('id') + ');'
	linkNode.setAttribute('href', hrefValue);
	linkNode.appendChild(document.createTextNode(projName));
	liNode.appendChild(linkNode);
	return liNode;
}

//  ****************************** Page FUNCTIONS  **********************************

function setPage(projNum) {
	var projectNode = getNodeByAttValue('project', 'id', projNum);
	
	// retrieves project content as string
	var title = getStringFrom(projectNode.getElementsByTagName('title')[0]);
	var sdate = getStringFrom(projectNode.getElementsByTagName('date')[0]);
	var desc = getStringFrom(projectNode.getElementsByTagName('description')[0]);
	var imgUrl = getStringFrom(projectNode.getElementsByTagName('pic')[0]);
	var techs = getStringFrom(projectNode.getElementsByTagName('tags')[0]);
	
	var nPresence = projectNode.getElementsByTagName('presence')[0];
	var xLink = getStringFrom(nPresence);
	
	getTechImg(techs);
	
	var leftDiv = document.getElementById("sm_leftCol");
	removeTagFrom('p', leftDiv);
	if(xLink != ""){
		tagP0  = document.createElement('P');
		
		// sets presence content
		var preContent;
		switch(nPresence.getAttribute("type")) {
			case("hard"):
				preContent = document.createTextNode(xLink)
				break;
			case("web"):
				preContent = document.createElement('a');
				preContent.appendChild(document.createTextNode('See more'));
				var jsString = "window.open('" + xLink + "','projectWindow','scrollbars=yes,menubar=no,height=600,width=850,resizable=yes,toolbar=no,location=no,status=no')";
				preContent.setAttribute('onclick', jsString);
				preContent.setAttribute('href', '#');
				break;
		}
		tagP0.appendChild(preContent);
		leftDiv.appendChild(tagP0);
	
	
	
	
	var rightDiv = document.getElementById("sm_rightCol");
	removeTagFrom('div', rightDiv);
	// sets title
	var tagH3 = rightDiv.getElementsByTagName('h3')[0].firstChild.data = title;
	rightDiv.getElementsByTagName('p')[0].firstChild.data = sdate;
	var tagP = document.createElement('DIV');
	// used inner to be able to add paragraphs and still be a string
	tagP.innerHTML = desc;
	//tagP.appendChild(document.createTextNode(desc));
	rightDiv.appendChild(tagP);
	
	/*var tagImg = document.getElementById("sm_slide");
	tagImg.setAttribute('src', imgUrl);*/
	/*imgUrl = 'img/cssImg/newsreader_bg.jpg';*/
	document.getElementById("sm_stage").style.backgroundImage="url(" + imgUrl + ")";
	
	
	}
	
	
}

/*	generates list item such as : <li><a href="javascript:generateMenu('xhtml');"><img src="img/tech/xhtml.jpg" /></a></li>
	they will part of the technology bar	*/
function getTechImg (techString) {
	document.getElementById('allBttn').setAttribute('src', 'img/all_button-act.jpg');
	var targetDiv = document.getElementById('sm_tech');	
	removeTagFrom('LI', targetDiv);	
	
	var aTechs = techString.split(',');
	var folderStr = "img/tech/";
	var imgStr = "";
	for(var i=0; i<aTechs.length; i++){
		if(aTechs[i] != "") {
			var tagLi = document.createElement('LI');
			var tagA = document.createElement('A');
			hrefAtt = "javascript:generateMenu('" + aTechs[i] + "');";
			tagA.setAttribute('href', hrefAtt);
			var tagImg = document.createElement('IMG');
			var imgUrl = folderStr + aTechs[i] + ".jpg";
			tagImg.setAttribute('src', imgUrl);
			tagImg.setAttribute('alt', getAltString(aTechs[i]));
			tagA.appendChild(tagImg);
			tagLi.appendChild(tagA);
			targetDiv.appendChild(tagLi);
		}
	}	
}

// shows all the technologies
function resetTechImg() {	
	getTechImg(aExts.join(','));
}

function getAltString(ext) {
	var fullName = "";
	
	for( var i=0; i < aExts.length; i++) {
		if(aExts[i] == ext) {
			fullName = aNames[i];
		}
	}
	return fullName;
}


//  ****************************** XML HELPER FUNCTIONS  **********************************  // 

function getNodeByAttValue(nodeName, attName, attValue) {
	var theNode;	
	var aNodes = xmlDoc.getElementsByTagName(nodeName);
	
	for(var i=0; i<aNodes.length; i++) {
		if(aNodes[i].getAttribute(attName) == attValue)  theNode = aNodes[i];
	}
	return theNode;	
}

// returns txt data from a node if any, otherwise empty string
function getStringFrom(tagName) {
	var str = "";
	if(tagName.firstChild) {
		str = tagName.firstChild.data;
	}
	var aPara = tagName.getElementsByTagName('p');
	if(aPara.length > 0){
		str = "";
		for(var i=0; i<aPara.length; i++) {
			str += "<p>";
			str += aPara[i].firstChild.data;
			str += "</p>";
		}		
	}
	return str;	
}

function removeTagFrom(tag, containerTag) {
	var tagList = containerTag.getElementsByTagName(tag);
	while (tagList.length > 0) {
		containerTag.removeChild(tagList[0]);
		tagList = containerTag.getElementsByTagName(tag);		
	}
}