jQuery(document).ready(function() {

	// --- language dropdown --- //

	// turn select into dl
	createDropDown();
	
	var $dropTrigger = jQuery(".dropdown dt a");
	var $languageList = jQuery(".dropdown dd ul");
	
	var $expanded = false;
	// open and close list when button is clicked
	
	jQuery(".dropdown dt a, #navCountry").click(function() {
		if($expanded==false) {
			$languageList.slideDown(200);
			$dropTrigger.addClass("active");
			$expanded=true;
		} else {
			$languageList.slideUp(200);
			$dropTrigger.removeAttr("class");
			$expanded=false;
		}
		
		return false;
	});

/*
	$dropTrigger.toggle(function() {
		$languageList.slideDown(200);
		$dropTrigger.addClass("active");
	}, function() {
		$languageList.slideUp(200);
		jQuery(this).removeAttr("class");
	});
*/
	// close list when anywhere else on the screen is clicked
	jQuery(document).bind('click', function(e) {
		var $clicked = jQuery(e.target);
		if (! $clicked.parents().hasClass("dropdown"))
			$languageList.slideUp(200);
			$dropTrigger.removeAttr("class");
			$expanded=false;
	});

	// when a language is clicked, make the selection and then hide the list
	jQuery(".dropdown dd ul li a").click(function() {
		var clickedValue = jQuery(this).parent().attr("class");
		var clickedTitle = jQuery(this).find("em").html();
		jQuery("#target dt").removeClass().addClass(clickedValue);
		jQuery("#target dt em").html(clickedTitle);
		$languageList.hide();
		$dropTrigger.removeAttr("class");
		$expanded=false;
		return false;
	});
});

	// actual function to transform select to definition list
	function createDropDown(){
		var $form = jQuery("div#country-select form");
		$form.hide();
		var source = jQuery("#country-options");
		source.removeAttr("autocomplete");
		var selected = source.find("option:selected");
		var options = jQuery("option", source);
		jQuery("#country-select").append('<dl id="target" class="dropdown"></dl>')
		jQuery("#target").append('<dt class="' + selected.val() + '"><a href="#"><em>' + selected.text() + '</em><span class="flag"></span></a></dt>')
		jQuery("#target").append('<dd><ul></ul></dd>')
		options.each(function(){
			jQuery("#target dd ul").append('<li class="' + jQuery(this).val() + '"><a href="' + jQuery(this).attr("title") + '"><em>' + jQuery(this).text() + '</em><span class="flag"></span></a></li>');
		});
	}