// JavaScript Document
// This was written for the Visuale website by James Parenti
// Note that some code is currently commented out - this may not be immediately apparent in certain editing applications.
/*
***********************************************

This is a simpler version of the Identity and Print displays - vis_designs_splitlists.js
takes all the content and divides both lists in two.

This version only makes simple lists, includes a re-write of the attributes display to contain 3
node values instead of one.


***********************************************
*/
window.onload = initAll;
function initAll() {
	makeRequestForDesign();
	makeRequestForIdentity();
	document.getElementById("blueCover").style.opacity = 0;	
}

/* -------------------MAKE A LIST OF DESIGN WORK WHERE CATEGORY EQUALS GENERAL DESIGN --------------------*/
function makeRequestForDesign() {
		new Ajax.Request('alldesign.xml',	
		{
				method:'get',
				
				onSuccess:function(transport) {
					// Not necessary to grab 
					var outMsg = transport.responseXML.getElementsByTagName("project") || "Sorry, no luck";
		
							var specListLeft = " ";
								for (var i=0;i<outMsg.length;i++){
								specListLeft += "<a href=\"#\" id=\"projectLink\" class=\"previewClass\" onclick=\"showTheProject(" + 
												  outMsg[i].attributes[1].nodeValue + ")\">" +
												  outMsg[i].attributes[0].nodeValue + "</a>&nbsp;" +
												  "<span id=\"subText\">" + outMsg[i].attributes[2].nodeValue + "</span><br />";
							    }
				
					document.getElementById("listLeft").innerHTML = "<div class=\"designSubHeader\">Print</div>" + specListLeft;
					// This initiates the preview link count -- doesn't work if it's in the initAll function because the DOM doesn't see the links 
					getPreviewReady();
				},
				onFailure: function() { alert('no...') }
		});
}

/* -------------------MAKE A LIST OF DESIGN WORK WHERE CATEGORY EQUALS IDENTITY--------------------*/
function makeRequestForIdentity() {
		new Ajax.Request('allidentity.xml',	
		{
				method:'get',
				onSuccess:function(transport) {
					var outMsg = transport.responseXML.getElementsByTagName("project") || "Sorry, no luck";
							var specListCenterLeft = " ";
								for (var i=0;i<outMsg.length;i++){
									specListCenterLeft += "<a href=\"#\" id=\"identityLink\" class=\"previewClass\" onclick=\"showTheIdProject(" + 
													  outMsg[i].attributes[1].nodeValue + ")\">" +
													  outMsg[i].attributes[0].nodeValue + "</a>&nbsp;" +
												     "<span id=\"subText\">" + outMsg[i].attributes[2].nodeValue + "</span><br />";
								}
								
					document.getElementById("listCenterLeft").innerHTML = "<div class=\"designSubHeader\">Identity</div>" + specListCenterLeft;
		
					// This initiates the preview link count -- doesn't work if it's in the initAll function because the DOM doesn't see the links 
					getPreviewReady();
				},
				onFailure: function() { alert('no...') }
		});
}

/* -------------------------------------GET PREVIEW READY-----------------------------------*/		
function getPreviewReady() {	
	var previewLinks = document.getElementsByClassName("previewClass");
		for(var i=0;i<previewLinks.length;i++) {
			previewLinks[i].onmouseover = showProjectPreview;
	}
}

/* ----------------------------------SHOW THE SITE PREVIEW-----------------------------------*/		
function showProjectPreview(evt) {
		//  we'll get back to this later
}
		
/* ---------------------------------------SHOW THE PROJECT-----------------------------------*/		
function showTheProject(projectNumber) {
		showCover();
		function displayAll() {
			displayContainer;
			document.getElementById("projectLink").onclick = getProject(projectNumber);
		}
		setTimeout(displayAll,500);
		return false;	
}

function getProject(projectNumber) {
		new Ajax.Request('alldesign.xml',	
		{
		method:'get',
		onSuccess:function(transport) {
		var designDisplay = " ";
		var designEntry = transport.responseXML.documentElement.getElementsByTagName("project");
				for(var i=0;i<designEntry.length;i++) {
					if(designEntry[i].attributes[1].nodeValue == projectNumber && designEntry[i].firstChild.nodeType == 1) {	
						// Internet Explorer Values - childNodes increase in increments of 1
						  
							 var designTitle = designEntry[i].childNodes[0].firstChild.nodeValue;
							 var designImageOne = designEntry[i].childNodes[6].firstChild.nodeValue;
								 // Img 1 Width and Height
								 var designImageOneWidth = designEntry[i].childNodes[6].attributes[0].nodeValue;
								 var designImageOneHeight = designEntry[i].childNodes[6].attributes[1].nodeValue;
						} 
						// Firefox, Safari, etc. Values - childNodes skip because of the account for empty text nodes
					else if (designEntry[i].attributes[1].nodeValue == projectNumber &&  designEntry[i].firstChild.nodeType == 3) {
							 var designTitle = designEntry[i].childNodes[1].firstChild.nodeValue;
							 var designImageOne = designEntry[i].childNodes[13].firstChild.nodeValue;
							 	// Img 1 Width and Height
								 var designImageOneWidth = designEntry[i].childNodes[13].attributes[0].nodeValue;
								 var designImageOneHeight = designEntry[i].childNodes[13].attributes[1].nodeValue;
						}   
								var designDisplay =
								"<div class=\"displayDesignBlock\">" +
								"<div id=\"headingForDesign\">" + designTitle + "</div>" +
								"<img src=images/designdisplay"+"/" + designImageOne + " border=\"0\">" +
								"<div id=\"closeSection\" style=\"background-color:#f5f5f5;\">" +
								"<a href=\"#\" id=\"closeSite\" onclick=\"closeProjectWindow();\">" +
								"<strong>CLOSE</strong>" +
								"</div>" +
								"</div>";
					  
					}
					// Display the completed information
						displayContainer(designImageOneWidth);
						displayContainerHeight(designImageOneHeight);
						//document.getElementById("closeButtonDesign").style.left = designImageOneWidth + "px";
						document.getElementById("displayDesignBox").style.width = designImageOneWidth + "px";
						document.getElementById("displayDesignBox").innerHTML = designDisplay;	
				}				
			});
}

/* ---------------------------------------SHOW THE IDENTITY-----------------------------------*/		
function showTheIdProject(projectNumber) {
		showCover();
		function displayAll() {
			displayContainer;
			document.getElementById("identityLink").onclick = getIdProject(projectNumber);
		}
		setTimeout(displayAll,500);
		return false;	
}

function getIdProject(projectNumber) {
		new Ajax.Request('allidentity.xml',	
		{
		method:'get',
		onSuccess:function(transport) {
		var designDisplay = " ";
		var designEntry = transport.responseXML.documentElement.getElementsByTagName("project");
				for(var i=0;i<designEntry.length;i++) {
					if(designEntry[i].attributes[1].nodeValue == projectNumber && designEntry[i].firstChild.nodeType == 1) {	
						// Internet Explorer Values - childNodes increase in increments of 1
						  
							 var designTitle = designEntry[i].childNodes[0].firstChild.nodeValue;
							 var designImageOne = designEntry[i].childNodes[6].firstChild.nodeValue;
								 // Img 1 Width and Height
								 var designImageOneWidth = designEntry[i].childNodes[6].attributes[0].nodeValue;
								 var designImageOneHeight = designEntry[i].childNodes[6].attributes[1].nodeValue;
						} 
						// Firefox, Safari, etc. Values - childNodes skip because of the account for empty text nodes
					else if (designEntry[i].attributes[1].nodeValue == projectNumber &&  designEntry[i].firstChild.nodeType == 3) {
							 var designTitle = designEntry[i].childNodes[1].firstChild.nodeValue;
							 var designImageOne = designEntry[i].childNodes[13].firstChild.nodeValue;
							 	// Img 1 Width and Height
								 var designImageOneWidth = designEntry[i].childNodes[13].attributes[0].nodeValue;
								 var designImageOneHeight = designEntry[i].childNodes[13].attributes[1].nodeValue;
						}   
								var designDisplay =
								"<div class=\"displayDesignBlock\">" +
								"<div id=\"headingForDesign\">" + designTitle + "</div>" +
								"<img src=images/designdisplay"+"/" + designImageOne + " border=\"0\">" +
								"<div id=\"closeSection\" style=\"background-color:#f5f5f5;\">" +
								"<a href=\"#\" id=\"closeSite\" onclick=\"closeProjectWindow();\">" +
								"<strong>CLOSE</strong>" +
								"</div>" +
								"</div>";
					  
					}
					// Display the completed information
						displayContainer(designImageOneWidth);
						displayContainerHeight(designImageOneHeight);
						//document.getElementById("closeButtonDesign").style.left = designImageOneWidth + "px";
						document.getElementById("displayDesignBox").style.width = designImageOneWidth + "px";
						document.getElementById("displayDesignBox").innerHTML = designDisplay;	
				}				
			});
}





/*----------------------------------DISPLAY FUNCTIONS-------------------------------------*/
// function findLivePageWidth
function findLivePageWidth() {
		
	if (window.innerWidth)
		return window.innerWidth;
	if (document.body.clientWidth)
		return document.body.clientWidth;
	return (null);
}

// function showCover
function showCover() {
		var newwidth='100%';
		var newheight='100%';
		document.getElementById("blueCover").style.width=newwidth;
		document.getElementById("blueCover").style.height=newheight;
		document.getElementById("blueCover").style.visibility = "visible";
		new Effect.Opacity('blueCover', { from: 0.0, to: 0.5, duration:0.5});
}

// function hideCover
function hideCover() {
		var newwidth='0%';
		var newheight='0%';
		function thenHide() {	
			document.getElementById("blueCover").style.visibility = "hidden";
			document.getElementById("blueCover").style.opacity = 0;
			document.getElementById("blueCover").style.width=newwidth;
			document.getElementById("blueCover").style.height=newheight;
			// This was added because, for some reason, the first entry wouldn't be clickable on the list unless the list was re-initialized.
			makeRequestForDesign();
		}
		new Effect.Opacity('blueCover', { from: 0.5, to: 0.0, duration:0.5});
		setTimeout(thenHide,500);
}


// function displayContainer
function displayContainer(currImgWidth) {

		var currImgWidth;
		livePageWidth = findLivePageWidth();
		newLeft = (livePageWidth/2) - (currImgWidth/2);
		document.getElementById("displayDesignBox").style.left = newLeft + "px";
		document.getElementById("displayDesignBox").style.visibility = "visible";
}


function displayContainerHeight(currImgHeight) {
		var currImgHeight;
		var newHeightDisplay = currImgHeight;
		document.getElementById("displayDesignBox").style.height = newHeightDisplay + "px";
}

/*function displayContainerPBlock(pImgWidth) {
		var pImgWidth;
		var closeButtonLeft = 585;
		document.getElementById("closeButtonDesign").style.left = closeButtonLeft + "px";
}*/


// function closeContainer
function closeContainer() {
		newLeft = 0;
		document.getElementById("displayDesignBox").style.left = newLeft + "px";
		document.getElementById("displayDesignBox").style.visibility = "hidden";
}

function closeProjectWindow() {
		   hideCover();
		   closeContainer();
		   document.getElementById("displayDesignBox").innerHTML = " ";
		   return false;
}