$(document).ready(function() {
		createDropDown();
		
		$(".dropdown dt a").click(function() {
				$(".dropdown dd ul").toggle();
				$(".dropdown dt a").removeClass("dtahover"); /*soloper IE8*/
		});

		$(document).bind('click', function(e) {
				var $clicked = $(e.target);
				if (! $clicked.parents().hasClass("dropdown")) {
						$(".dropdown dd ul").hide();
						$(".dropdown dt a").addClass("dtahover"); /*soloper IE8*/
				}
		});
								
		$(".dropdown dd ul li a").click(function() {
				var text = $(this).html();
				$(".dropdown dt a").html(text);
				$(".dropdown dd ul").hide();
				
				var source = $("#source");
				
				//console.log("parent.location='"+$(this).find("span.value").html()+"'");				
				//source.val($(this).find("span.value").html())
				
				eval("parent.location='"+$(this).find("span.value").html()+"'");
		});
		
		
		$('input.field').addClass("idleField");
		$('input.field').focus(function() {
			$(this).removeClass("idleField").addClass("focusField");
			if (this.value == this.defaultValue) this.value = '';
			if (this.value != this.defaultValue)	this.select();			
		});
		$('input.field').blur(function() {
			if ($.trim(this.value) == '')	{
				this.value = (this.defaultValue ? this.defaultValue : '');
				$(this).removeClass("focusField").addClass("idleField");
			}
		});
		
		
});

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

		$(".select").append('<dl id="target" class="dropdown"></dl>')
		$("#target").append('<dt><a href="#">' + selected.text() + 
				'<span class="value">' + selected.val() + 
				'</span></a></dt>')
		$("#target").append('<dd><ul></ul></dd>')

		options.each(function(){
				$("#target dd ul").append('<li><a href="#">' + 
						$(this).text() + '<span class="value">' + 
						$(this).val() + '</span></a></li>');
		});
}