// INITIALISATION

var fadeOut = 0.3;
var fadeIn = 0.6;
var locked = 0;
var studentText;
var imageLoaded;
var textLoaded;

var pathway = new Array(5);
pathway[0] = 'fineArt';
pathway[1] = 'printmaking';
pathway[2] = 'graphicDesign';
pathway[3] = 'illustration';
pathway[4] = 'photography';

window.onload = startup;

function startup() {
	//hide names
	for(i = 0; i < pathway.length; i++) {
		Element.hide(pathway[i]+'Names');
	}
	//add events
	addHomeEvents();
	addStudentEvents();
}

function addHomeEvents() {
	$('fineArt').onclick = goFineArt;
	$('printmaking').onclick = goPrintmaking;
	$('graphicDesign').onclick = goGraphicDesign;
	$('illustration').onclick = goIllustration;
	$('photography').onclick = goPhotography;
}

function addStudentEvents() {
	allStudents = document.getElementsByClassName('students');
	for(i = 0; i < allStudents.length; i++) {
		allStudents[i].onclick = goStudent;
		Element.removeClassName(allStudents[i], 'selected');
		allStudents[i].style.cursor = 'pointer';
	}
}


// NAVIGATION

function goFineArt() {
	hideTitles('fineArt');
	showNames('fineArt');
	$('fineArt').onclick = goHome;
	$('fineArt').src = 'images/fineart-on.gif';
}

function goPrintmaking() {
	hideTitles('printmaking');
	showNames('printmaking');
	$('printmaking').onclick = goHome;
	$('printmaking').src = 'images/printmaking-on.gif';
}

function goGraphicDesign() {
	hideTitles('graphicDesign');
	showNames('graphicDesign');
	$('graphicDesign').onclick = goHome;
	$('graphicDesign').src = 'images/graphicdesign-on.gif';
}

function goIllustration() {
	hideTitles('illustration');
	showNames('illustration');
	$('illustration').onclick = goHome;
	$('illustration').src = 'images/illustration-on.gif';
}

function goPhotography() {
	hideTitles('photography');
	showNames('photography');
	$('photography').onclick = goHome;
	$('photography').src = 'images/photography-on.gif';
}

function goStudent() {
	if(locked == 0) {
		if(this.parentNode.id == 'fineArtNames') {
			goPathway = 'fineArt';
			goCol = 3;
		} else if(this.parentNode.id == 'printmakingNames') {
			goPathway = 'printmaking';
			goCol = 3;
		} else if(this.parentNode.id == 'graphicDesignNames') {
			goPathway = 'graphicDesign';
			goCol = 4;
		} else if(this.parentNode.id == 'illustrationNames') {
			goPathway = 'illustration';
			goCol = 2;
		} else if(this.parentNode.id == 'photographyNames') {
			goPathway = 'photography';
			goCol = 2;
		}
		//set selected name
		addStudentEvents();
		lock();
		Element.addClassName(this, 'selected');
		//prepare for loading
		studentId = this.id.slice(7);
		imageLoaded = 0;
		textLoaded = 0;
		//remove info and/or make the request
		if($('studentDetails')) {
			new Effect.Fade('studentDetails', { duration: fadeOut, transition: Effect.Transitions.linear, to: 0.0, afterFinish: requestStudent });
		} else {
			requestStudent();
		}
	}
}

function requestStudent() {
	if($('studentDetails')) {
		Element.remove('studentDetails');
	}
	//show loading ani
	if(!$('loadingBar')) {
		new Insertion.Top('col'+goCol, '<div id="loadingBar"><img src="images/loading.gif" alt="Loading..." /></div>');
		Element.hide('loadingBar');
		new Effect.Appear('loadingBar', { duration: fadeIn, transition: Effect.Transitions.linear, to: 1.0, queue: 'end' });
	}
	//preload image
	imgPreloader = new Image();
	imgPreloader.onload = imageDone;
	imgPreloader.src = 'image.php?id='+studentId;
	//make ajax request
	getStudent = new Ajax.Request('student.php', { method: 'get', parameters: 'id='+studentId, onSuccess: ajaxDone, onFailure: ajaxError });
	Element.removeClassName('col'+goCol, 'singleWidth');
	Element.addClassName('col'+goCol, 'doubleWidth');
	Element.hide('col'+(goCol+1));
}

function imageDone() {
	imageLoaded = 1;
	if(textLoaded == 1) {
		showStudentDetails();
	}
}

function ajaxDone(originalRequest) {
	studentText = originalRequest.responseText;
	textLoaded = 1;
	if(imageLoaded == 1) {
		showStudentDetails();
	}
}

function ajaxError(originalRequest) {
	alert('Error ' + t.status + ' -- ' + t.statusText);
}

function goHome() {
	tripped = null;
	if($('loadingBar')) {
		new Effect.Fade('loadingBar', { duration: fadeOut, transition: Effect.Transitions.linear, to: 0.0, afterFinish: function() { Element.remove('loadingBar'); }});
	}
	if($('studentDetails')) {
		new Effect.Fade('studentDetails', { duration: fadeOut, transition: Effect.Transitions.linear, to: 0.0, afterFinish: function() { Element.remove('studentDetails'); }});
	}
	for(i = 0; i < pathway.length; i++) {
		$(pathway[i]).src = 'images/'+pathway[i].toLowerCase()+'-off.gif';
		//hide names
		new Effect.Fade(pathway[i]+'Names', { duration: fadeOut, transition: Effect.Transitions.linear, to: 0.0, afterFinish: function() {
				//only trigger once
				if(!tripped) {
					if($('studentDetails')) {
						Element.remove('studentDetails');
					}
					for(j = 0; j < pathway.length; j++) {
						//resize and bring back any hidden columns
						currentCol = $('col'+(j+1));
						Element.removeClassName(currentCol, 'doubleWidth');
						Element.addClassName(currentCol, 'singleWidth');
						Element.show(currentCol);
						//show titles
						new Effect.Appear(pathway[j], { duration: fadeIn, transition: Effect.Transitions.linear, to: 1.0 });
					}
					new Effect.Appear('exhibition', { duration: fadeIn, transition: Effect.Transitions.linear, to: 1.0 });
					tripped = 1;
				}
			}});
	}
	addHomeEvents();
}


// VISUAL EFFECTS ETC

function lock() {
	locked = 1;
	allStudents = document.getElementsByClassName('students');
	for(i = 0; i < allStudents.length; i++) {
		allStudents[i].onclick = null;
		allStudents[i].style.cursor = 'default';
	}
}

function unlock() {
	locked = 0;
	allStudents = document.getElementsByClassName('students');
	for(i = 0; i < allStudents.length; i++) {
		if(!Element.hasClassName(allStudents[i], 'selected')) {
			allStudents[i].onclick = goStudent;
			allStudents[i].style.cursor = 'pointer';
		}
	}
}

function hideTitles(exclude) {
	new Effect.Fade('exhibition', { duration: fadeOut, transition: Effect.Transitions.linear, to: 0.0 });
	toHide = document.getElementsByClassName('title');
	for(i = 0; i < toHide.length; i++) {
		if(toHide[i] != $(exclude)) {
			new Effect.Fade(toHide[i], { duration: fadeOut, transition: Effect.Transitions.linear, to: 0.0 });
		}
	}
}

function showNames(show) {
	unlock();
	addStudentEvents();
	new Effect.Appear(show+'Names', { duration: fadeIn, transition: Effect.Transitions.linear, to: 1.0, queue: 'end' });
}

function showStudentDetails() {
	new Insertion.Top('col'+goCol, '<div id="studentDetails"><img id="studentImage" src="" alt="Student\'s work" /></div>');
	Element.hide('studentDetails');
	$('studentImage').src = imgPreloader.src;
	new Insertion.Bottom('studentDetails', studentText);
	new Effect.Fade('loadingBar', { duration: fadeOut, transition: Effect.Transitions.linear, to: 0.0, queue: 'end', afterFinish: function() { Element.remove('loadingBar'); }});
	new Effect.Appear('studentDetails', { duration: fadeIn, transition: Effect.Transitions.linear, to: 1.0, queue: 'end', afterFinish: unlock });
}