// creates and manages an html select form element, from a
function FundMultiSelectList(id){
	var parts = id.split("_");
	this.listID = id;
	this.variableName = parts[1];
	//alert(this.listID + "ID");
	//alert(this.variableName + "ID");
	this.list = $(this.variableName + "ID");
	this.children = this.list.childNodes;
	this.listItems = new Array();
	this.select;
	this.selectedList = new Array();
	
	this.clear_list = function(){
		
		for(i = 0; i < this.selectedList.length; i++){

			// reset the css class
			this.highlight(this.selectedList[i], false);
			
			// update the select form field
			this.form_select(this.selectedList[i], false);
		}
		
		this.selectedList = new Array();
	}
	
	this.click = function(index){
		// if the item is already selected
		var position = this.is_selected(index);
		//alert(this.selectedList.join(","));
		if(position != -1){
			//alert("removing: length=" + this.selectedList.length);
			//alert("this.selectedList.splice(" + position + ",1);")
			
			// take the item out of the array
			this.selectedList.splice(position,1);
			// reset the css class
			this.highlight(index, false);
			// update the select form field
			this.form_select(index, false);
		}else{	// if new
			//alert("adding: length=" + this.selectedList.length);
			// add to the selected list
			this.selectedList.push(index);
			// highlight it
			this.highlight(index, true);
			// select the form field option
			this.form_select(index, true);
		}
	}
	
	this.form_select = function(index, selected){
		//alert("msoption-" + this.listID + "-" + index);
		//alert($("msoption-" + this.listID + "-" + index).selected);
		$("msoption-" + this.listID + "-" + index).selected = selected;
		//alert($("msoption-" + this.listID + "-" + index).selected);
	}
	
	this.highlight = function(index, color){
		var highlightClass = " highlight";
		var elem = $("msli-" + this.listID + "-" + index);

		if(color == true){
			elem.className += highlightClass;
		}else{
			var elemclass = elem.className;
			elem.className = elemclass.replace(highlightClass, "");
		}
	}
	
	// deciphers the next image, and displays it
	this.init = function(){		
		var multiSelect = "<select id='" + this.listID + "Select' name='" + this.variableName + "[]' multiple  style='display: none;'>";

		// loop through the list and read the values			
		for(i = 0; i < this.children.length; i++){
			if(this.children[i].nodeName == "LI"){	// make sure it is a list tag
				// add the list item
				this.listItems.push(this.children[i]);
				var currentIndex = this.listItems.length - 1;

				if (this.children[i].getAttribute("disabled") != 'disabled'){ //added by RJS 12/8/08 
				
					// set the id of the list item for later reference
					this.children[i].setAttribute("id", "msli-" + this.listID + "-" + currentIndex);
					//alert(this.children[i].id);
					// create the link for the list item, and wrap it with a link
					var link = document.createElement('a');
					link.setAttribute("href", "javascript:" + this.listID + ".click(" + currentIndex + ");");
					
					// store the contents of the list item
					var nodeText = this.children[i].firstChild.nodeValue;
					var linkText = document.createTextNode(nodeText);
					link.appendChild(linkText);
					
					var temp = (this.children[i].getAttribute("selected") != null ? " selected='selected'" : "");
					// update the multiselect string
					multiSelect += "<option id='msoption-" + this.listID + "-" + currentIndex + "' value='" + this.children[i].getAttribute("lid") + "'" + temp + ">" + nodeText + "</option>";
					//alert("<option id='msoption-" + this.listID + "-" + currentIndex + "' value='" + this.children[i].getAttribute("lid") + "'>" + nodeText + "</option>");
					// remove the plain text, add new text with link wrapper
					this.children[i].removeChild(this.children[i].firstChild);
					this.children[i].appendChild(link);
					
					// check if the value is selected
					if(this.children[i].getAttribute("selected") != null){
						// add to the selected list
						this.selectedList.push(currentIndex);
						
					}

				}
			}
		}
		// close the select
		multiSelect += "</select>";
		// put the hidden select after the list
		this.list.innerHTML += multiSelect;
		//this.list.outerHTML += multiSelect;
		// store reference to the new select box
		this.select = document.getElementById(this.listID + "Select");
		// show all the ones that are already selected
		this.show_all_selected();
	}
	
	this.is_selected = function(val){
		for(var i = 0; i < this.selectedList.length; i++){
			if(val == this.selectedList[i]){
				return i;
			}
		}
		return -1;
	}
	
	this.join = function(){
		var str = "";
		for(var i = 0; i < this.selectedList.length; i++){
			str += this.listItems[this.selectedList[i]].getAttribute("lid");
			if(i + 1 < this.selectedList.length){
				str += ",";
			}
		}
		return str;
	}
	
	this.show_all_selected = function(){
		
		for(var i = 0; i < this.selectedList.length; i++){
			// highlight it
			this.highlight(this.selectedList[i], true);
			// select the form field option
			this.form_select(this.selectedList[i], true);
		}
	}
	
	// run the constructor
	this.init();
}
