var from = 0;
var perPage = 10;
var specific = "NONE";
var filter = "NONE";
var path='http://sceti.library.upenn.edu/core/';
var xml = new garden();
var list = [];
var mainList = [];

function initialize(file,GRN){
	xml = new garden();
	xml.load(file);	
	list = xml.xpAll(xml.tree.documentElement, '//'+GRN);
	mainList = list;
}

function makeWin(url,name){
	window.open(url,name,'location=yes,menubar=yes,scrollbars=yes,resizable=yes,width=885,height=600'); }

function goFrom(i){
	from = i;
	display();
}

function move(change){
	from = from+change*perPage;
	from = ( from < 0 ? 0 : from);
	from = ( from > list.length-1 ? list.length-1 : from );
	display();	
}

function browseBar_page(gLabel,rOptions){
	output = gLabel+" ";
	output += "<select id='browseBar_selectPerPage' onChange='perPage=parseInt(this.value); goFrom(0);'>";
	for (i = 0; i < rOptions.length; i++){
		if (rOptions[i] == perPage){ output += "<option value='"+rOptions[i]+"' selected>"+rOptions[i]+"</option>"; }
		else { output += "<option value='"+rOptions[i]+"'>"+rOptions[i]+"</option>"; }
	}
	document.getElementById("browseBar_page").innerHTML = output+"</select>";
}

function browseBar_sortCall(value){
	if (value == sType && oType == 'ascending'){ oType='descending'; }
	else { oType='ascending'; }
	document.getElementById(sType+"_sort").innerHTML = "";
	sType = value;
	document.getElementById(sType+"_sort").innerHTML = "<img src='"+path+"images/whitearrow_"+(oType == 'ascending' ? 'desc' : 'asc')+".gif' border='0' alt='sort "+(oType == 'ascending' ? 'descending' : 'ascending' )+"' />";
	list = list.sort(qSort);
	goFrom(0);
}

function browseBar_sort(sortLabelGUI, sortNames, sortLabels){
	output = sortLabelGUI;
	for (i = 0; i < sortNames.length; i++){
		output += "<a href='##' onClick='browseBar_sortCall(\""+sortNames[i]+"\")' >"+sortLabels[i];
		output += "<span id='"+sortNames[i]+"_sort'>";
		if (i == 0){
			sType = sortNames[i];
			output += "<img src='"+path+"images/whitearrow_asc.gif' border='0' alt='sort ascending' />";
		}
		output += "</span></a>&nbsp;&nbsp;&nbsp;&nbsp;";
	}
	document.getElementById("browseBar_sort").innerHTML = output;
}
function browseBar_counter(){
	output = "";
	if (specific == "NONE" || list.length>1){
		output = from+1+" - "+(from+perPage < list.length ? from+perPage : list.length)+" of "+list.length;

		if (from > 0){
			output = "<a href='##' onClick='goFrom(0);'><img src='"+path+"images/butnfirst.gif' alt='first' /></a>&nbsp;&nbsp;<a href='##' onClick='move(-1);'><img src='"+path+"images/butnprev.gif' alt='previous'/></a>&nbsp;&nbsp;"+output;
		} else {
			output = "<img src='"+path+"images/butnfirstblank.gif' alt='first' />&nbsp;&nbsp;<img src='"+path+"images/butnprevblank.gif' alt='previous'/>&nbsp;&nbsp;"+output;
		}
		if (from+perPage < list.length){
			last = ( list.length-1*perPage < 0 ? 0 : list.length-1*perPage);
			output += "&nbsp;&nbsp;<a href='##' onClick='move(1);'>";
			output += "<img src='"+path+"images/butnnext.gif' alt='next' /></a>";
			output += "&nbsp;&nbsp;<a href='##' onClick='goFrom("+last+");'>";
			output += "<img src='"+path+"images/butnlast.gif' alt='last' /></a>";
		} else {
			output += "&nbsp;&nbsp;<img src='"+path+"images/butnnextblank.gif' alt='next' />";
			output += "&nbsp;&nbsp;<img src='"+path+"images/butnlastblank.gif' alt='last' />";		
		}
	}
	document.getElementById("browseBar_counter").innerHTML = output;
}

function browseBar_jump(gLabel){
	output = gLabel+"&nbsp;<select id='browseBar_selectJump' onChange='goFrom(parseInt(this.value));'>";
	for (i = 1; i <= list.length; i+=perPage){
		if (i-1 == from){ output += "<option value='"+(i-1)+"' selected>"+i+"</option>"; }
		else { output += "<option value='"+(i-1)+"'>"+i+"</option>"; }
	}
	document.getElementById("browseBar_jump").innerHTML = output+"</select>";
}
	
function browseBar_content(output){ document.getElementById('browseBar_content').innerHTML = output; }

var browseBar_showThumbs = 1;
function browseBar_thumb(){
	browseBar_showThumbs = (browseBar_showThumbs == 1 ? 0 : 1);
	display();
}

function browseBar_customize(id, variable, newVal){
	eval('document.getElementById("'+id+'").style.'+variable+' = "'+newVal+'"');
}
function browseBar_select(gLabel,gAll,rName){
	output = gLabel+" <select id='browseBar_selectSpecific' onChange='specific = this.value; goFrom(0);'>";
	output += "<option value='NONE'>"+gAll+"</option>";
	for (i = 0; i < list.length; i++){
		call = xml.getVAL(xml.getTAG(list[i], rName, 0));
		output += "<option value='"+call+"'>"+call+"</option>";
	}
	document.getElementById("browseBar_select").innerHTML = output + "</select>";
}

function browseBar_filterCall(){
	text = document.getElementById("browseBar_inputFilter").value.toLowerCase();
	list = [];
	if (filter == 'NONE'){ list = mainList;	}
	else{
		for (l = 0; l < mainList.length; l++){
			myNode = xml.xpSingle(mainList[l],filter);
			if (myNode && (xml.getVAL(myNode)).toLowerCase().indexOf(text) != -1){
				list.push(mainList[l]);
			}
		}
	}
	goFrom(0);
}

var initialBrowseBarFilterClick = 1
function callBrowseBarFilterClick(){
	if (initialBrowseBarFilterClick == 1){
		initialBrowseBarFilterClick = 0;
		document.getElementById("browseBar_inputFilter").value="";
	}
}

function browseBar_filter(gLabel,gAll,gSelectLabel,gSelectValue){
	output = gLabel+"&nbsp;&nbsp;<input onMouseUp='callBrowseBarFilterClick()' onKeyUp='browseBar_filterCall()' type='text' id='browseBar_inputFilter' value='keyword(s)'/>&nbsp; in the &nbsp;<select id='browseBar_selectFilter' onChange='filter = this.value; browseBar_filterCall();'>";
	output += "<option value='NONE'>"+gAll+"</option>";
	for (i = 0; i < gSelectLabel.length; i++){
		output += "<option value='"+gSelectValue[i]+"'>"+gSelectLabel[i]+"</option>";	
	}
	document.getElementById("browseBar_filter").innerHTML = output + "</select>";	
}

function getSafeOutput(record, xpPath){
	myVAL = xml.xpSingle(record,xpPath);
	if (myVAL){ myVAL = xml.getVAL(myVAL); }
	else { myVAL = ""; }	
	return myVAL;
}

function browseBar(bWidth,bThumbs,bCounter,bJump,bSelect,bPage,bFilter){
	//Use unified stylesheets!
	output = "<table class='browseBar_table' width='"+bWidth+"' align='center' cellpadding='0' cellspacing='0'>";
	output += "<tr><td colspan="+(bThumbs+bCounter+bJump+bSelect+bPage+bCounter)+"><table class='browseBar_table2' width='100%'><tr>";
	output += "<td height='38' align='center' valign='middle' class='browseBar_td2'>";
	output += "<div id='browseBar_sort'></div></td>"
	if (bFilter){
		output += "<td class='browseBar_td2'>";
		output += "<div id='browseBar_filter'></div></td>";	
	}
	output += "</tr></table></td></tr>";
	
	output += "<tr>";
	var cols = 0;
	if (bThumbs){
		output += "<td colspan='1' height='30' align='left' valign='middle' class='browseBar_td'>&nbsp;";
		output += "<a href='##' onClick='browseBar_thumb()'>Toggle Img.</a></td>";
		cols++;
	}
	if (bCounter){
		output += "<td colspan='2' align='left' valign='middle' class='browseBar_td'>";
		output += "<div id='browseBar_counter'></div></td>";
		cols += 2;
	}
	if (bJump){
		output += "<td colspan='1' align='center' valign='middle' class='browseBar_td'>";
		output += "<div id='browseBar_jump'></div></td>";
		cols++;
	}
	if (bSelect){
		output += "<td colspan='1' align='center' class='browseBar_td'>";
		output += "<div id='browseBar_select'></div></td>";
		cols++;
	}
	if (bPage){
		output += "<td colspan='1' align='center' valign='middle' class='browseBar_td'>";
		output += "<div id='browseBar_page'></div></td>";
		cols++;
	}
	output += "</tr><tr><td colspan='"+cols+"'><div id='browseBar_content'></div></td></tr></table>";

	document.getElementById('browseBar').innerHTML = output;
}