// JavaScript Document
//create array of projects to hold


/* ---------------  FUNCTION FOR CHANGING PROJECT ----------------- */
function updateProjectView(projectId){
	//update title
	document.getElementById('projectTitle').innerHTML = eval('projects'+projectId+'[0]');
	//update date
	document.getElementById('projectDate').innerHTML = eval('projects'+projectId+'[1]');
	//call update image button count
	document.getElementById('numbers').innerHTML = updateImageBut(eval('projects'+projectId+'[2]'),eval('projects'+projectId+'[5]'),projectId);
	//call to update main image to default, 1
	//update nav title
	updateMainImg('1',projectId,imgArray[0]);
}

/* ---------  FUNCTION FOR UPDATING THE NUMBER OF IMAGE LINKS ----------- */
function updateImageBut(total,images,project){
	//convert image array to list for outputting
	stringHolder = images;
	imgArray = stringHolder.split("*");
	//define output variable
	output = "<ul>";
	//loop through number of images
	for (i = 1;i<=total;i++){
		output = output + "<li><a href=javascript:updateMainImg('" + i + "','" + project + "','" + imgArray[i-1] +"'); id='number" + i + "'>" + i +"</a></li>";
	}
	
	output += "</ul>";
	
	return output;
}

/* ---------------  FUNCTION FOR CHANGING CURRENT IMAGE ----------------- */
function updateMainImg(imageId,project,image){
		//update main image
		document.getElementById('projectMainImage').innerHTML = '<img src="/images/cmsprojects/' + image + '" width="457" height="272" alt="IKON Project Image" />';
		//set active state
		for (i = 1;i<=eval('projects'+project+'[2]');i++){
		//change the class of the button just pushed. 
			if (imageId == i){
				document.getElementById('number'+i).className = 'over';
			}else{
				document.getElementById('number'+i).className = 'off';
			}
		}
		
}
/* ----------  FUNCTION TO CHANGE THE STATE OF THE PROJECT BUTTONS ------------ */
function changeState(myclass, target,heightDown,heightUp){
	//loop through total projects to change them back to off if they were to be one.
	for (i = 1;i<=totalProjects;i++){
		//Make sure title is right. 
		document.getElementById('project'+i).innerHTML = "<p><div id='project_title'>&nbsp;&nbsp;<b>" + eval('projects'+i+'[0]') + "</b></div></p><br /><div class=\"project_text\" id=\"project_text" + i + "\">" + eval('projects'+i+'[4]') +"</div>";
		//change the class of the button just pushed. 
		if (target == 'project'+i){
			//alert(target == 'project'+i);
			document.getElementById('project'+i).className = 'project_on';
			document.getElementById('project_text'+i).style.height = heightUp + 'px';
			document.getElementById('project_text'+i).style.overflow = 'hidden';
		}else{
			document.getElementById('project'+i).className = 'project_off';
			document.getElementById('project_text'+i).style.height = '1px';
			document.getElementById('project_text'+i).style.overflow = 'hidden';
		}
	}
}

function setCatPic(catname, catpic)
{
    document.getElementById('projectMainImage').innerHTML = '<img src="/images/cmsprojects/' + catpic + '" width="457" height="272" alt="'+catname+'" />';
    document.getElementById('projectTitle').innerHTML = catname;
    document.getElementById('projectDate').innerHTML = 'Category';
    document.getElementById('numbers').innerHTML = '<center>Click the "'+catname+'" link above to view the projects in this category.</center>';
}