// some config

var allMsgColor = "white";
var someMsgColor = "#AE9411";
var allMsgImg = "../_media/_i/alertIconWhite.gif";
var someMsgImg = "../_media/_i/alertIconFiltered.gif";
var allMsg = "Viewing all types of entries";
var someMsg = "Filtered List:"; // this gets prepended to the actual list
var navOnColor ="rgb(170,179,181)";
var navOffColor ="rgb(119,133,137)";
var navOnImg ="../_media/_i/filterbtn_on.gif";
var navOffImg ="../_media/_i/filterbtn_off.gif";

// This script drives the content filtering

// Step 0: register the onlick handlers and build the filter listing

var typeList = new Array(); // no time for object modeling :(
var statusList = new Array();
var labelList = new Array();
var pinsUp = 0;

function initFilter() {
for (var i=0; i < document.getElementById("filtercontent").childNodes.length; i++) {
	if (document.getElementById("filtercontent").childNodes[i].nodeName == "LI") { // grab the data from inside
		
		// IE/Mac doesn't seem to like push :/
		// typeList.push(document.getElementById("filtercontent").childNodes[i].childNodes[0].id);
		typeList.length++;
		typeList[typeList.length-1] =document.getElementById("filtercontent").childNodes[i].childNodes[0].id;
		
		statusList[typeList[pinsUp]] = 1;
		labelList[typeList[pinsUp]] = document.getElementById("filtercontent").childNodes[i].childNodes[0].title;
		pinsUp++;
		// Step 1: register the click		
		document.getElementById("filtercontent").childNodes[i].childNodes[0].onclick = function () {
		
			// Step 2: determine if this is an on or off click
			if (statusList[this.id]) {
				// Step 3: if its an off click then check if its the last pin down...
				if (pinsUp <= 1) {
					this.blur();
					return false;
				} else {
					// ... otherwise kill all the items in this section and update the filter designation, and the nav styles
					for (var j=0; j < document.getElementsByTagName("LI").length; j++) { // this is looping over all LIs but its still probably faster then nesting a few loops to traverse the tree
						if (document.getElementsByTagName("LI")[j].className.indexOf(this.id) != -1) {
							document.getElementsByTagName("LI")[j].style.display = "none";
						}
					}
					document.getElementById("filterimg").src = someMsgImg;
					document.getElementById("filterstatus").style.borderColor = someMsgColor;
					document.getElementById("filtermsg").style.color = someMsgColor;
					this.style.backgroundColor = navOffColor;
					this.childNodes[0].src = navOffImg;
					statusList[this.id] = 0;
					pinsUp--;
					var fullMsg = someMsg;
					for (var j=0; j < typeList.length; j++) {
						if (statusList[typeList[j]]) {
							fullMsg += " " + labelList[typeList[j]] + ",";
						}
					}
					document.getElementById("filtermsg").innerHTML = fullMsg.substr(0,(fullMsg.length-1));
				}
			} else {
				// Step 4: if it is an on click then show all the items in this group, update the nav, and the filter msg
				for (var j=0; j < document.getElementsByTagName("LI").length; j++) { // this is looping over all LIs but its still probably faster then nesting a few loops to traverse the tree
					if (document.getElementsByTagName("LI")[j].className.indexOf(this.id) != -1) {
						document.getElementsByTagName("LI")[j].style.display = "list-item";
					}
				}
				statusList[this.id] = 1;
				pinsUp++;
				this.style.backgroundColor = navOnColor;
				this.childNodes[0].src = navOnImg;
					
				// ... and if all the pins are up toggle the filter styles
				if (pinsUp >= typeList.length) {
					document.getElementById("filterimg").src = allMsgImg;
					document.getElementById("filterstatus").style.borderColor = allMsgColor;
					document.getElementById("filtermsg").style.color = allMsgColor;
					document.getElementById("filtermsg").innerHTML = allMsg;
					
				} else {
					var fullMsg = someMsg;
					for (var j=0; j < typeList.length; j++) {
						if (statusList[typeList[j]]) {
							fullMsg += " " + labelList[typeList[j]] + ",";
						}
					}
					document.getElementById("filtermsg").innerHTML = fullMsg.substr(0,(fullMsg.length-1));
				}
			}
			this.blur();
			return false;
		};
		
	}
}
}