// Universal attach event function
function addEvent(obj, evType, fn){
	if( obj.addEventListener ) {
		obj.addEventListener( evType, fn, true );
		return true;
	} else if( obj.attachEvent ) {
		var r = obj.attachEvent( "on"+evType, fn );
		return r;
	}
	return false;
}

// Initialises advanced search form
function initSearchForm() {
	// Get all li elements in the form
	var priceList = document.getElementById( "pricesection" ).getElementsByTagName( "li" );
	var genderList = document.getElementById( "gendersection" ).getElementsByTagName( "li" );
	var materialList = document.getElementById( "materialsection" ).getElementsByTagName( "li" );
	var categoryList = document.getElementById( "categorysection" ).getElementsByTagName( "li" );
	var i, j, inputField, branch;

	for(i=0;i < priceList.length;i++) {
		// Attach priceClick event to each 'input' elements
		inputField = priceList[i].getElementsByTagName( "input" )[0];
		flagLabel( inputField );
		inputField.onclick = priceClick;
	}

	for(i=0;i < genderList.length;i++) {
		// Attach genderClick event to each 'input' elements
		inputField = genderList[i].getElementsByTagName( "input" )[0];
		flagLabel( inputField );
		inputField.onclick = genderClick;
	}

	for(i=0;i < materialList.length;i++) {
		inputField = materialList[i].getElementsByTagName( "input" )[0];

		// Attach expand event to all LI elements with a class name starting with 'branch'
		if( materialList[i].className.indexOf("branch") == 0 ) {
			materialList[i].onclick = expand;
			branch = materialList[i].getElementsByTagName( "ul" )[0];
			if( getBranchState( branch ) != "clean" ) {
				materialList[i].className = "branch-open";
				branch.style.display = "block";
			}
		}
		
		// Attach handleInputClick event to each 'input' elements
		flagLabel( inputField );
		inputField.onclick = materialClick;
	}

	for(i=0;i < categoryList.length;i++) {
		inputField = categoryList[i].getElementsByTagName( "input" )[0];

		// Attach expand event to all LI elements with a class name starting with 'branch'
		if( categoryList[i].className.indexOf("branch") == 0 ) {
			if( getBranchState( categoryList[i].getElementsByTagName("ul")[0] ) != "clean" ) categoryList[i].className = "branch-open";
			categoryList[i].onclick = expand;
		}
		
		// Attach handleInputClick event to each 'input' elements
		flagLabel( inputField );
		inputField.onclick = categoryClick;
	}

	// Attach event to Modify search/Hide search form button
	if(document.getElementById("showhide"))	document.getElementById("showhide").onclick = showHide;
}

// Run init code when page loads
addEvent( window, "load", initSearchForm );

// Shows/Hides the "Modify your search/Hide search form" buttom
function showHide(e) {
	// Get event object
	if (!e) var e = window.event;
	// Get event target
	var tg = (e.target) ? e.target : e.srcElement;
	tg.blur();
	
	var tableObj = document.getElementById("advancedsearch").getElementsByTagName("table")[0];
	if( tableObj.className == "" ) {
		tableObj.className = "hidden";
		document.getElementById("showhide").innerHTML = "Modify your search";
	} else {
		tableObj.className = "";
		document.getElementById("showhide").innerHTML = "Hide advanced search";
	}
	return false;
}

// Helper function: returns the state of a branch (full, clean or partial)
function getBranchState( branchObj ) {
	var checkBoxes = branchObj.getElementsByTagName( "input" );
	var counter = 0;
	for(var i=0;i < checkBoxes.length;i++) {
		if( checkBoxes[i].checked ) counter++;
	}
	if( counter == checkBoxes.length ) return "full";
	if( counter > 0 ) return "partial";
	return "clean";
}

// Helper function: returns the state of a branch (full, clean or partial)
function getSectionState( sectionID ) {
	var checkBoxes = document.getElementById( sectionID ).getElementsByTagName( "input" );
	var counter = 0;
	for(var i=1;i < checkBoxes.length;i++) {
		if( checkBoxes[i].checked ) counter++;
	}
	if( counter == checkBoxes.length - 1 ) return "full";
	if( counter > 0 ) return "partial";
	return "clean";
}

// Helper function: sets all checkboxes in a section
function setSection( sectionID, value ) {
	var checkBoxes = document.getElementById( sectionID ).getElementsByTagName( "input" );
	for(var i=0;i < checkBoxes.length;i++) {
		if( checkBoxes[i].value.length > 0 ) {
			checkBoxes[i].checked = value;
			checkBoxes[i].disabled = false;
			flagLabel( checkBoxes[i] );
		}
	}
}

// Helper function: clears all checkboxes in a branch
function setBranch( branchObj, value ) {
	var checkBoxes = branchObj.getElementsByTagName( "input" );
	for(var i=0;i < checkBoxes.length;i++) {
		if( checkBoxes[i].value.length > 0 && checkBoxes[i].value != "0" ) {
			if( value == -1 ) checkBoxes[i].disabled = true;
			else {
				checkBoxes[i].disabled = false;
				checkBoxes[i].checked = value;
				flagLabel( checkBoxes[i] );
			}
		}
	}
}

// Helper function: sets parent box
function setParent( targetInput, value ) {
	var parentCheckBox = targetInput.parentNode.parentNode.parentNode.getElementsByTagName("input")[0];
	if( value == undefined ) parentCheckBox.disabled = false;
	else if( value == -1 ) parentCheckBox.disabled = true;
	else {
		parentCheckBox.disabled = false;
		parentCheckBox.checked = value;
		flagLabel( parentCheckBox );
	}
}

// Helper function: returns the checkbox/radio button being clicked
function getTargetInput( targetObj ) {
	if( targetObj.tagName.toLowerCase() == "input" ) return targetObj;
	return document.getElementById( targetObj.getAttribute( "for" ) );
}

// Helper function: disables all checkboxes in the target's section
function disableSection( targetInput, disable ) {
	var checkBoxes = targetInput.parentNode.parentNode.getElementsByTagName( "input" );
	for(var i=0;i<checkBoxes.length;i++) {
		if( checkBoxes[i].type == "checkbox" && checkBoxes[i].value.length != 0 ) checkBoxes[i].disabled = disable;
	}
}

// Helper function: highlight the the checkbox/radio button label
function flagLabel( targetInput ) {
	if( targetInput.type == "radio" ) {
		var radioGroup = targetInput.form[targetInput.name];
		for(var i=0;i<radioGroup.length;i++) {
			if( radioGroup[i].checked ) radioGroup[i].parentNode.getElementsByTagName("label")[0].className = "checked";
			else radioGroup[i].parentNode.getElementsByTagName("label")[0].className = "";
		}
	} else {
		var targetLabel = targetInput.parentNode.getElementsByTagName("label")[0];
		if( targetInput.checked ) targetLabel.className = "checked";
		else targetLabel.className = "";
	}
}

// Handles expand/collpase of tree branches
function expand(e) {
	// Get event object
	if (!e) var e = window.event;
	// Get event target
	var tg = (e.target) ? e.target : e.srcElement;
	
	var ulObj;
	
	// If the event target is an LI element and its class name starts with 'branch' (a collapsable branch)
	if( tg.tagName.toLowerCase() == "li" && tg.className.indexOf("branch") == 0 ) {
		// Get the nested UL element
		ulObj = tg.getElementsByTagName( "ul" )[0];
		// Expand in any case
		if( tg.className == "branch-closed" ) { //ulObj.style.display == "none" || ulObj.style.display.length == 0 ) {
			//ulObj.style.display = "block";
			tg.className = "branch-open";
		// Collapse only if the branch is clean
		} else if( getBranchState( ulObj ) == "clean" ) {
			//ulObj.style.display = "none";
			tg.className = "branch-closed";
		}
	}
}

function priceClick(e) {
	// Get event object
	if (!e) var e = window.event;
	// Get event target
	var tg = (e.target) ? e.target : e.srcElement;
	
	var targetInput = getTargetInput( tg );
	// If the target box is a 'don't mind' box, untick the entire section
	if( targetInput.value.length == 0 ) setSection( "pricesection", false );
	else {
		var sectionState = getSectionState( "pricesection" );
		var selectAll = document.getElementById( "nopricerange" );
		selectAll.checked = (sectionState == "clean");
		flagLabel( selectAll );
	}
	// Update the label appearance
	flagLabel( targetInput );
	// Fetch results from database
	getTotalResults();
}

function genderClick(e) {
	// Get event object
	if (!e) var e = window.event;
	// Get event target
	var tg = (e.target) ? e.target : e.srcElement;
	
	var targetInput = getTargetInput( tg );
	// Update the label appearance
	flagLabel( targetInput );
	// Fetch results from database
	getTotalResults();
}

function materialClick(e) {
	// Get event object
	if (!e) var e = window.event;
	// Get event target
	var tg = (e.target) ? e.target : e.srcElement;
	
	var targetInput = getTargetInput( tg );

	// Tick parent box if a sub box is ticked
	if( targetInput.checked ) {
		if( targetInput.className == "subBox" ) setParent( targetInput, 1 );
	} else {
		// Clear branch if the parent box was unticked
		if( targetInput.parentNode.className.indexOf( "branch" ) == 0 ) setBranch( targetInput.parentNode.getElementsByTagName("ul")[0], 0 );
	}

	// If the target box is a 'don't mind' box, untick the entire section
	if( targetInput.value.length == 0 ) setSection( "materialsection", false );
	else {
		var sectionState = getSectionState( "materialsection" );
		var selectAll = document.getElementById( "nomaterial" );
		selectAll.checked = (sectionState == "clean");
		flagLabel( selectAll );
	}

	// Update the label appearance
	flagLabel( targetInput );
	// Fetch results from database
	getTotalResults();
}

function categoryClick(e) {
	// Get event object
	if (!e) var e = window.event;
	// Get event target
	var tg = (e.target) ? e.target : e.srcElement;
	
	var targetInput = getTargetInput( tg );

	// If the target box is a 'don't mind' box, untick the entire section
	if( targetInput.value.length == 0 ) setSection( "categorysection", false );
	else {
		var sectionState = getSectionState( "categorysection" );
		var selectAll = document.getElementById( "nocategory" );
		selectAll.checked = (sectionState == "clean");
		flagLabel( selectAll );
	}

	if( targetInput.parentNode.className.indexOf( "branch" ) == 0 ) {
		// Disable sub branch if the parent is ticked
		setBranch( targetInput.parentNode.getElementsByTagName("ul")[0], targetInput.checked?-1:0 );
	}
	else if( targetInput.className == "subBox" && targetInput.checked ) {
		// Untick parent when a sub box is ticked
		setParent( targetInput, 0 );
	}

	// Update the label appearance
	flagLabel( targetInput );
	// Fetch results from database
	getTotalResults();
}

// Builds a search string and calls the database
function getTotalResults() {
	var url = "index.cfm?event=catalogue.getSearchResult&";
	var checkBoxes = document.getElementById( "advancedsearch" ).getElementsByTagName("input");
	var categoryIDs = "";
	var materialIDs = "";
	var priceRange = "";
	var gender = "";
	for(var i=0;i<checkBoxes.length;i++) {
		if( ( checkBoxes[i].type == "checkbox" || checkBoxes[i].type == "radio" ) && checkBoxes[i].checked && !checkBoxes[i].disabled ) {
			switch(checkBoxes[i].name) {
				case "categoryIDs":
					categoryIDs = categoryIDs + checkBoxes[i].value + ",";
					break;
				case "materialIDs":
					materialIDs = materialIDs + checkBoxes[i].value + ",";
					break;
				case "priceRange":
					priceRange = priceRange + checkBoxes[i].value + ",";
					break;
				case "gender":
					gender = checkBoxes[i].value;
					break;
			}
		}
	}
	url = url + "categoryIDs=" + categoryIDs + "&materialIDs=" + materialIDs + "&priceRange=" + priceRange + "&gender=" + gender;
	//self.location = url;
	loadXMLDoc(url);
}

var req;

function loadXMLDoc(url) {
	// branch for native XMLHttpRequest object
	if (window.XMLHttpRequest) {
		req = new XMLHttpRequest();
		req.onreadystatechange = processReqChange;
		req.open("GET", url, true);
		req.send(null);
		// branch for IE/Windows ActiveX version
	} else if (window.ActiveXObject) {
		req = new ActiveXObject("Microsoft.XMLHTTP");
		if (req) {
			req.onreadystatechange = processReqChange;
			req.open("GET", url, true);
			req.send();
		}
	}
}

var prevTotal = 0;

function processReqChange() {
	// only if req shows "loaded"
	if (req.readyState == 4) {
		// only if "OK"
		if (req.status == 200) {
			var total = req.responseXML.getElementsByTagName( "total" )[0].firstChild.nodeValue;
			document.getElementById("showresults").disabled = (total == 0);
			countUp(prevTotal, total);
			prevTotal = total;
		} else alert( "There was a problem retrieving the search results.\nClick 'Show results' to view your search results now.");
	}
}

function countUp(counter, target) {
	counter = parseInt(counter);
	target = parseInt(target);
	var span = document.getElementById( "results" ).getElementsByTagName("span")[0];
	if( counter == 1 ) resultString = counter + " result";
	else resultString = counter + " results";
	span.innerHTML = resultString;
	if( counter == target ) return;
	if( counter < target ) {
		counter = counter + 31;
		if( counter > target ) counter = target;
	} else {
		counter = counter - 31;
		if( counter < target ) counter = target;
	}
	setTimeout( "countUp(" + counter + ", " + target + ")", 1 );
}