$(document).ready(function() {
	createDropDown();

	$(".select-language dt").mouseenter(function() {
	  $(".select-language dd ul").stop(true, true).slideDown(100);
		$(".select-language dt").removeClass("down-arrow").addClass("up-arrow");
	});

	$(".select-language").mouseleave(function() {
		$(".select-language dd ul").stop(true, true).slideUp(200, function() {
			$(".select-language dt").removeClass("up-arrow").addClass("down-arrow");
		});
	});

	$(".select-language dd ul li a").click(function() {
	 var text = $(this).html();
	 var language = $(this).find("span.value").text();
	 $(".select-language dt a").html('<div class="' + language + '-flag">' + text + '</div>');
	 $(".select-language dd ul").hide();
	 $(".select-language dt").removeClass("up-arrow").addClass("down-arrow");

	 var source = $("#lang-select");
	 source.val($(this).find("span.value").html());
	});
});

function createDropDown(){
	var source = $("#lang-select");
	var selected = source.find("option[selected]");
	var options = $("option", source);

	$("#language-selection").append('<dl id="target" class="select-language"></dl>');
	$("#target").append('<dt class="down-arrow"><a href="http://www.submate.com/'+localePath(selected.val())+'"><div class="' + selected.val() + '-flag">' + selected.text() + '<span class="value">' + selected.val() + '</span></div></a></dt>');
	$("#target").append('<dd><ul></ul></dd>');

	options.each(function(index, option){
	  $("#target dd ul").append('<li class="' + $(option).val() + '-flag"><a href="http://www.submate.com/' + localePath($(option).val()) + '">' +
	    $(this).text() + '<span class="value">' +
	    $(this).val() + '</span></a></li>');
	});
}

function localePath(locale){
    return "?locale="+locale
}