/**
 * The language chooser
 *
 * @copyright	bitExpert AG <info@bitExpert.de>
 * @version	$Revision: 645 $
 * @date	$Date: 2009-12-11 21:04:32 +0100 (Fr, 11 Dez 2009) $
 *
 * Depends:
 *	ui.core.js
 */
(function($) {

	$.widget('ui.chooser', {
		config : {},
		_init: function()
		{
			var widget = this;

			$(document).bind('change' + this.element[0].id + 'Selection', function(event){
				widget._changeSelection(event);
			});

			widget.element.change(function(){
				widget._updateSelection();
			});

			// hide the unstyled select box
			$('#' + this.element[0].id).hide();

			widget._initCurrentSelection();
			$('body').append(widget._decorateAvailableOptions());
			// $('div.container').append(widget._decorateAvailableOptions());
		},
		_initCurrentSelection: function()
		{
			var widget = this;

			// init our custom chooser
			var curOpt = widget._getCurOpt();

			// add the current selected option
			var thisChooser = $('<a class="curLang langLink external" id="current' + this.element[0].id + 'Selection" href="#"></a>');
			thisChooser.html(curOpt.name);

			// add the listener for the hover event
			if(widget._getAvailableOptions().length > 1)
			{
				thisChooser.hover(
					function()
					{
						$(widget.element).unbind('click');
						widget._showOptions();
						return false;
					},
					function()
					{
						$(widget.element).unbind('click').bind('click', function() {
							widget._hideOptions();
							return false;
						});
						return false;
					}
				);

				thisChooser.click(function(){
					widget._toggleOptions();
					return false;
				});
			}

			// insert the language chooser into the DOM tree
			thisChooser.insertAfter(widget.element);
		},
		_getCurOpt: function()
		{
			var widget = this;
			var selectedOption = widget.element.children('option:selected');

			return {
				name: selectedOption.html(),
				id: selectedOption.attr('value')
			};
		},
		_setCurOpt: function(option)
		{
			$('#current' + this.element[0].id + 'Selection').html(option.name);
		},
		_getCountryCode: function(option)
		{
			return language.id.substring(option.id.indexOf('_')+1).toLowerCase();
		},
		_getAvailableOptions: function()
		{
			var widget = this;

			var aOptions = [];

			widget.element.children('option').each(function(){
				aOptions.push({name: $(this).html(), id: $(this).attr('value')});
			});

			return aOptions;
		},
		_decorateAvailableOptions: function()
		{
			var widget = this;

			var availOpts = widget._getAvailableOptions();

			// create the container for the language chooser
			var chooserDiv = $('<div id="' + this.element[0].id + 'Div"></div>');
			var chooserBtm = $('<div id="' + this.element[0].id + 'Btm"></div>');
			var chooserTop = $('<div id="' + this.element[0].id + 'Top"></div>');
			var chooserCnt = $('<div id="' + this.element[0].id + 'Cnt"></div>');

			// create an unordered list for the selectable languages
			var optionsList = $('<ul id="' + this.element[0].id + 'OptionsList"></ul>');

			for(var i = 0; i < availOpts.length; i++)
			{
				var listItem = $('<li></li>');
				var optLink = widget._getDecoratedOptionLink(availOpts[i]);
				listItem.append(optLink);

				optionsList.append(listItem);
			}

			chooserDiv.append(chooserTop);
			chooserDiv.append(chooserCnt);
			chooserCnt.append(optionsList);
			chooserDiv.append(chooserBtm);
			chooserDiv.mouseleave(function(){
				widget._hideOptions();
			});

			return chooserDiv;
		},
		_getDecoratedOptionLink: function(option)
		{
			var widget = this;

			var link = $('<a></a>');
			$(link).addClass('optLink');
			$(link).html(option.name);
			$(link).attr('id', 'opt_' + option.id);

			var e = new jQuery.Event('change' + this.element[0].id + 'Selection');
			e.optName = option.name;
			e.optId   = option.id;

			$(link).click(function(){
				$(document).trigger(e);
				return false;
			});

			return link;
		},
		_decorateCurrentSelection: function()
		{
			var widget      = this;
			var option    = widget._getCurOpt();
			var countryCode = widget._getCountryCode(option);

			$('#current' + this.element[0].id + 'Selection').css({'background-image': 'url("' + imagePath + countryCode + '.gif")'});
		},
		_updateSelection: function()
		{
			var widget  = this;
			var newOpt = widget._getCurOpt();
			widget._setCurOpt(newOpt);

		},
		_changeSelection: function(event)
		{
			var widget = this;

			widget.element.children('option:selected').removeAttr('selected');
			var availOpts = widget.element.children('option');
			
			for(var i = 0; i < availOpts.length; i++)
			{			
				if(event.optId === $(availOpts[i]).val())
				{
					$(availOpts[i]).attr('selected', 'selected');
					$('#' + this.element[0].id).parents('form:first').submit();
					return true;
				}
			}

			widget._hideOptions();

			return false;
		},
		_showOptions: function()
		{
			// get the position of the hovered link
			var offsetPos = $('#current' + this.element[0].id + 'Selection').offset();
			
			// set the position of the option list
			$('#' + this.element[0].id + 'Div').css('position', 'absolute');
			$('#' + this.element[0].id + 'Div').css('left', offsetPos.left + 'px');
			$('#' + this.element[0].id + 'Div').css('top', offsetPos.top + 'px');
			
			$('#' + this.element[0].id + 'Div').stop(true, true).fadeIn();
			
		},
		_hideOptions: function()
		{
			$('#' + this.element[0].id + 'Div').stop(true, true).fadeOut();
		},
		_toggleOptions: function()
		{
			$('#' + this.element[0].id + 'Div').stop(true, true).slideToggle();
		}
	});
})(jQuery);