/* --------------------------------------------------------------------*\
*                                                                       *
*  This file is a part of ArtWeb effects manager, created by ArtWeb OÜ. *
*                                                                       *
*  Any unauthorized use of this file is strictly prohibited.            *
*  For all questions concerning the usage of this code please send an   * 
*  email to info@art-web.ee or contact us on http://www.art-web.ee      *
*                                                                       *
/* --------------------------------------------------------------------*/

function artWebDropDown(selectorElement)
{
	this.importSelectData = function(selectorElement)
	{
		if (selectorElement.tagName == 'select' || selectorElement.tagName == 'SELECT')
		{
			this.selectorElement = selectorElement;
			for (var i = 0; i < selectorElement.options.length; i++)
			{
				var optionObject = new artWebDropDownOption(this, selectorElement.options[i]);
				if (selectorElement.selectedIndex == i)
				{
					this.value = optionObject.value;
					this.text = optionObject.text;
				}
				this.optionObjects.push(optionObject);
			}
		}
	}
	this.createDropDownShort = function()
	{
		var dropDownShort = document.createElement('a');
		dropDownShort.className = 'dropdown_short';
		dropDownShort.href = '';
		addHandler(dropDownShort, 'click', this.click);
		this.dropDownShort = dropDownShort;
		
		var domElement = document.createElement('span');
		domElement.className = 'dropdown_short_left';
		dropDownShort.appendChild(domElement);
		
		var domElement = document.createElement('span');
		domElement.className = 'dropdown_short_right';
		dropDownShort.appendChild(domElement);
		
		var domElement = document.createElement('span');
		domElement.className = 'dropdown_short_center';
		dropDownShort.appendChild(domElement);
		
		var domElement = document.createElement('span');
		domElement.className = 'dropdown_short_mark';
		dropDownShort.appendChild(domElement);
		
		this.createDropDownTitle();
		
		var parent = this.selectorElement.parentNode;
		parent.insertBefore(this.dropDownShort, this.selectorElement);
	}
	this.createDropDownTitle = function()
	{
		var dropDownTitle = document.createElement('span');
		dropDownTitle.className = 'dropdown_title';
		this.dropDownTitle = dropDownTitle;
		
		this.dropDownShort.appendChild(this.dropDownTitle);
		
		this.setTitle(this.text);
	}
	this.createDropDownList = function()
	{
		var domElement = document.createElement('span');
		domElement.className = 'dropdown_full';
		
		this.dropDownList = domElement;
		
		var parent = this.dropDownShort.parentNode;
		parent.insertBefore(this.dropDownList, this.dropDownShort);
		
		for (var i = 0; i < this.optionObjects.length; i++)
		{
			var optionObject = this.optionObjects[i];
			var optionElement = optionObject.domElement;
			
			this.dropDownList.appendChild(optionElement);
		}
	}
	this.hideSelectorElement = function()
	{
		this.selectorElement.style.display = 'none';
	}
	this.selectOption = function(optionObject)
	{
		this.value = optionObject.value;
		this.text = optionObject.text;
		
		this.setValue(this.value);
		this.setTitle(this.text);
		this.hideOptionsList();
		fireEvent(instance.selectorElement, 'change');
	}
	this.setTitle = function(text)
	{
		while(this.dropDownTitle.firstChild)
		{
			this.dropDownTitle.removeChild(this.dropDownTitle.firstChild);
		}
		var content = document.createTextNode(text);
		this.dropDownTitle.appendChild(content);		
	}
	this.setValue = function(value)
	{
		this.selectorElement.value = value;
	}
	this.click = function(event)
	{
		preventDefaultAction(event);
		cancelBubbling(event);
		if(instance.state=='closed')
		{
			instance.showOptionsList();
		}
		else
		{
			instance.hideOptionsList();
		}
	}
	this.showOptionsList = function()
	{
		artWebDropDownManager.hideLists();
		
		this.dropDownList.style.top = (this.dropDownShort.offsetTop+this.dropDownShort.offsetHeight)+'px';
		this.dropDownList.style.left = this.dropDownShort.offsetLeft+'px';
		this.dropDownList.style.display = 'block';
		var newWidth = this.dropDownList.offsetWidth;
		if (this.dropDownList.offsetWidth < this.dropDownList.scrollWidth)
		{
			newWidth = this.dropDownList.scrollWidth;
		}
		if (newWidth < this.dropDownShort.offsetWidth)
		{
			newWidth = this.dropDownShort.offsetWidth;
		}
		this.dropDownList.style.width = newWidth+'px';
		this.state = 'opened';
	}
	this.hideOptionsList = function()
	{
		this.dropDownList.style.display = 'none';
		this.state = 'closed';
	}
	var instance = this;
	this.selectorElement = null;
	this.dropDownShort = null;
	this.dropDownTitle = null;
	this.dropDownList = null;
	this.optionObjects = new Array();
	this.state = 'closed';
	this.value = '';
	this.text = '';

	this.importSelectData(selectorElement);
	this.createDropDownShort();
	this.createDropDownList();
	this.hideSelectorElement();
}
function artWebDropDownOption(dropDownObject, optionElement)
{
	this.importOptionData = function(optionElement)
	{
		if (optionElement.tagName == 'option' || optionElement.tagName == 'OPTION')
		{
			this.optionElement = optionElement;
			this.value = optionElement.value;
			this.text = optionElement.text;
			this.selected = optionElement.selected;
		}
	}
	this.createDomElement = function()
	{
		var domElement = document.createElement('span');
		domElement.className = 'dropdown_option';
		
		addHandler(domElement, 'click', this.click);
		addHandler(domElement, 'mouseover', this.mouseover);
		addHandler(domElement, 'mouseout', this.mouseout);
		this.domElement = domElement;
		
		var content = document.createTextNode(this.text);
		domElement.appendChild(content);
	}
	this.mouseover = function()
	{
		instance.domElement.className = 'dropdown_option dropdown_option_hovered';
	}
	this.mouseout = function()
	{
		instance.domElement.className = 'dropdown_option';
	}
	this.click = function(event)
	{
		preventDefaultAction(event);
		instance.dropDownObject.selectOption(instance);
	}
	var instance = this;
	this.dropDownObject = dropDownObject;
	this.value = null;
	this.text = null;
	this.selected = null;
	this.optionElement = null;
	this.domElement = null;
	
	this.importOptionData(optionElement);
	this.createDomElement();
}
artWebDropDownManager = new function()
{
	this.init = function()
	{
		var dropDownElements = _('select.artWebDropDown');
		for (var i = 0; i < dropDownElements.length; i++)
		{
			var dropDownObject = new artWebDropDown(dropDownElements[i]);
			instance.dropDownObjects.push(dropDownObject);
		}
		addHandler(document, 'click', instance.hideLists);
	}
	this.hideLists = function()
	{
		for (var i = 0; i < instance.dropDownObjects.length; i++)
		{
			var dropDownObject = instance.dropDownObjects[i];
			if (dropDownObject.state != 'closed')
			{
				dropDownObject.state = 'closed';
				dropDownObject.hideOptionsList();
			}
		}
		hide_loginpopup();
	}
	var instance = this;
	this.dropDownObjects = new Array();
}

addHandler(window, 'load', artWebDropDownManager.init);