/** DROPDOWNLIST +++++++++++++++++++++++++++++++++++++++++++++++++++++++++ **/

//Add stylesheet
addEvent (window, "onload", function (e)
{
	var found = false;
	for (var s=0; s < document.styleSheets.length; s++)
	{
		var st = document.styleSheets [s];
		
		if (String(st.href).toLowerCase().endsWith ("dropdownlist.css"))
		{
			found = true;
			break;
		}
	}
	
	if (!found)
		importStylesheet(getVirtualPath () + "/multimed/dropdownList.css");
	
});


DropdownList = {
	//Variables
	lists : new Array ()
	
	
	,init : function (list, options, onclickEvent, autoResize)
	{	
		
		if (!list.id) list.id = generateNewGuid (true);
		DropdownList.lists.push (list.id);
		
		//Create panel 
		list.optionsPanel = DropdownList.createOptionsPanel (list);
		list.optionsPanel.listId = list.id;
		list.onclickEvent = onclickEvent;
		list.autoResize = (autoResize==true ? true : false);
		
		//Add event 
		addEvent (list.optionsPanel, "onclick", function (e)
		{
			e.cancelBubble = true;
			
			//Get the option 
			var selectedOption = e.srcElement;
			if (!selectedOption) return;
			if (selectedOption.tagName!="DIV")
			{
				while (selectedOption.tagName!="DIV" && selectedOption.parentNode)
				{
					selectedOption = selectedOption.parentNode;
				}
			}
			
			
			if (!String(selectedOption.className).startsWith ("option")) return;
			
			//Set selected index 
			var list = $(selectedOption.parentNode.listId);
			
			
			if (!selectedOption.optionDef.isNew) //Not for the "new" option 
				DropdownList.selectOption (list, selectedOption, false);
			
			
			selectedOption.parentNode.style.display = "none";
			
		});
		
		
		//Add options 
		for (var i=0; i < options.length; i++)
		{
			var option = DropdownList.createOption (options [i]);
			list.optionsPanel.appendChild (option);
		}
		
		
		
		//Hide 
		list.optionsPanel.style.display = "none";
		
		//Init events 
		addEvent (list, "onclick", DropdownList.displayOptions);
		addEvent (document.body, "onclick", function (e)
		{
			if ($(list.id))
				$(list.id).optionsPanel.style.display =  "none";
		}
		);
		
		//Resize event 
		addEvent (window, "onresize", function (e)
		{
			if (DropdownList.lists)
			{
				for (var listIndex = 0; listIndex < DropdownList.lists.length; listIndex++)
				{
					var currentList = $(DropdownList.lists[listIndex]);
					if (currentList && currentList.optionsPanel)
					{
						DropdownList.setOptionsPosition (currentList, currentList.optionsPanel);
					}
				}
			}
			
		});
		
		
		//Select first option 
		if (list.optionsPanel.childNodes.length>0)
		{
			DropdownList.selectOption (list, list.optionsPanel.childNodes[0], true);
		}
	}
	
	//Adding a new option 
	,addOption : function (list, optionDef, selectIt)
	{
		var option = DropdownList.createOption (optionDef);
		list.optionsPanel.appendChild (option);
		
		if (selectIt)
			DropdownList.selectOption (list, option, true);
	}
	
	//Create the options panel 
	,createOptionsPanel : function (list)
	{
		if (!list) return;
		var panel = document.createElement ("DIV");
		panel.className = "dropdownListOptions";
		panel.style.width = list.offsetWidth;
		panel.style.zIndex = 200000;
		DropdownList.setOptionsPosition (list, panel);
		document.body.appendChild (panel);
		
		
		return panel;
	}
	//Setting the position of the panel 
	,setOptionsPosition : function (list, optionsPanel)
	{
		if (!list || !optionsPanel) return;
		var listPos = getObjectPosition (list);
		
		
		
		optionsPanel.style.left = listPos [0] - 1;
		optionsPanel.style.top = listPos [1] + list.offsetHeight-2;
		
		//Refresh view 
		if (list.style.display == "inline")
		{
			list.style.display = "block";
			list.style.display = "inline";
		}
		else if (list.style.display == "block")
		{
			list.style.display = "inline";
			list.style.display = "block";
		}
			
		
		
	}
	
	//Create option 
	,createOption : function (optionDef)
	{
		var option = document.createElement ("DIV");
		option.className = "option";
		/* var iconPath =  
			"<img src=\"" + 
				(optionDef.icon?
				"../resources/menuIcons/" + optionDef.icon + "\"":
				"../../images/empty.gif\" style=\"display:none;width:16px\" ") + 
				" align=\"absmiddle\">";
		*/
		option.innerHTML = "<img src=\"" + getVirtualPath () + "images/checked.gif\" align=\"absmiddle\" style=\"margin-right:3px;visibility:hidden\">" + 
			"<span>" + optionDef.title + "</span>";
		
		option.title = (optionDef.optionText || optionDef.title);
		
		//Add events 
		addEvent (option, "onmouseover", DropdownList.optionMouseover);
		addEvent (option, "onmouseout", DropdownList.optionMouseout);
		
		option.optionDef = optionDef;
		
		
		return option;
	}
	
	//Displaying the options panel 
	,displayOptions : function (e)
	{
		
		if (!e) return;
		e.cancelBubble = true;
		var list = getEventSource (e);
		if (!list) return;
		if (list.tagName!="DIV") 
		{
			list = list.parentNode;
		}
		if (list.tagName!="DIV")
		{
			while (list.tagName!="DIV" && list.parentNode)
			{
				list = list.parentNode;
			}
		}	
		
		if (!list) return;
		
		//Set position
		DropdownList.setOptionsPosition (list, list.optionsPanel);
		
		
		//Display 
		list.optionsPanel.style.display = "";
	}
	
	//Mouse events
	,optionMouseover : function (e)
	{
		if (!e) return;
		var option = getEventSource (e);
		if (!option) return;
		if (option.tagName!="DIV")
		{
			while (option.tagName!="DIV" && option.parentNode)
			{
				option = option.parentNode;
			}
		}	 
		if (!option) return;
		option.className = "option mouseover";					
		
	}
	,optionMouseout : function (e)
	{
		if (!e) return;
		var option = getEventSource (e);
		if (!option) return;
		
		if (option.tagName!="DIV")
		{
			while (option.tagName!="DIV" && option.parentNode)
			{
				option = option.parentNode;
			}
		}
		if (!option) return;
		option.className = "option";
		
	}
	
	,selectOption : function (list, selectedOption, noOnchangeEvent)
	{
		var panel = list.optionsPanel;
		
		//Unselect last option 
		if (panel.selectedOption)
		{
			panel.selectedOption.firstChild.style.visibility = "hidden";
			panel.selectedOption.firstChild.style.selected  = false;
		}
		
		selectedOption.firstChild.style.visibility = "visible";
		selectedOption.firstChild.style.selected  = true;
		
		
		panel.selectedOption = selectedOption;
		
		
		//Update the list 			
		var optionText = selectedOption.lastChild.innerHTML;
		if (selectedOption.optionDef && selectedOption.optionDef.optionText)
			optionText = selectedOption.optionDef.optionText;
		/*else
		{
			//Remove some specific chars at the begin of the text
			var descendantArrow = document.createElement("SPAN");
			descendantArrow.innerHTML = "&#x2514;&#x2192;";
			
			optionText = optionText.removeFirstString("    ").removeFirstString(descendantArrow.innerText);
		}*/
		
		list.firstChild.innerHTML = optionText;
			
		
		if (noOnchangeEvent!=true && list.onclickEvent) 	list.onclickEvent (selectedOption.optionDef);
			
		
		//Adjust the width of the list 	
		if (list.autoResize && list.minWidth)
		{
			var span = list.firstChild;
			var spanWidth = span.offsetWidth;
			var newWidth = spanWidth + 50;
			if (newWidth < 50) newWidth = 50;
			if (newWidth < int (list.minWidth))
				newWidth = int (list.minWidth);
			
			list.style.width = newWidth;
			list.optionsPanel.style.width = newWidth;
		}	
	}
	
	,selectOptionByValue : function (list, val, caseSensitive)
	{
		if (!list || !list.optionsPanel) return;
		var found = false;
		
		for (var i=0; i < list.optionsPanel.childNodes.length; i++)
		{
			var option = list.optionsPanel.childNodes[i];
			
			if (!option.optionDef) continue;
			if (
				(caseSensitive && option.optionDef.value == val)
				||
				(!caseSensitive && String(option.optionDef.value).toLowerCase () == String (val).toLowerCase())
			)
			{
				if (option.optionDef.value == val)
				{
					found = true;
					
					DropdownList.selectOption (list, option, true);
					break;
				}
			}	
		}
		
		if (!found && list.optionsPanel.childNodes.length>0)
		{
			DropdownList.selectOption (list, list.optionsPanel.childNodes[0], true);
		}
	}
	
	,hideLists : function (e)
	{
		if (DropdownList.lists)
		{
			for (var listIndex = 0; listIndex < DropdownList.lists.length; listIndex++)
			{
				var currentList = $(DropdownList.lists[listIndex]);
				if (currentList && currentList.optionsPanel)
				{
					currentList.optionsPanel.style.display = "none";
				}
			}
		}
		
	}
	
};