/*
 * Modify <select> elements with jQuery 1.2.6
 * customSelect version 1.0.2
 * Add parameters to choose the theme
 * Add dynamically CSS in the head section
 */
jQuery.fn.customSelect = function(options){
	if(jQuery(this).is('select')){
		//Options
		var defaults = {
			theme:'default',
			themepath:''
		};
		options = jQuery.extend(defaults, options);
		if(options.theme == ""){
			options.theme = 'default';
		}
		
		
		/* Check if the css are load */
		if(jQuery(".custom-select-main").size() < 1){
			jQuery('head').append('<link href="'+options.themepath+'jquery-select-theme/jquery.select.css" type="text/css" rel="stylesheet">');
		}
		if(jQuery(".custom-select-"+options.theme).size() < 1){
			jQuery('head').append('<link href="'+options.themepath+'jquery-select-theme/'+options.theme+'-style/style.css" type="text/css" rel="stylesheet">');
		}

		var input = jQuery(this);
		var inputid = jQuery(this).attr("id");

		//Text value of the selected option
		var optionselectedvalue = jQuery('select#'+inputid+' :selected').text();
		var optionselected = jQuery("select#"+inputid + " option:selected").val();
		var optionsoftheselect = input.children();
		
		var newselectcontent = "";
		optionsoftheselect.each(function(index) {
			if(jQuery(this).val() == optionselected){
				newselectcontent = newselectcontent + "<div id='"+jQuery(this).val()+"-"+index +"' class='custom-select-option custom-select-option-selected'><a tabindex='0' href='#'>" + jQuery(this).text() + "</a></div>";
			} else {
				newselectcontent = newselectcontent + "<div id='"+jQuery(this).val()+"-"+index +"' class='custom-select-option'><a tabindex='0' href='#'>" + jQuery(this).text() + "</a></div>";
			}
		});


		//Build the link
		if(optionselectedvalue == ""){
			optionselectedvalue = "&nbsp;";
		}
		var newlink = '<div id="custom-select-link-' + inputid + '" class="custom-select-link"><span tabindex="0">'+optionselectedvalue+'</span></div>';
		
		//Build the pseudo select
		var newselect = '<div id="custom-select-' + inputid + '" class="custom-select">'+newselectcontent+'</div>';

		//Build the link and the pseudo select in a DIV
		jQuery(input).wrap('<div class="custom-select-'+options.theme+' custom-select-main" />');
		jQuery(newlink+newselect).insertBefore(input);
		
		//hide the select
		jQuery(input).hide();

		// Execute events on custom div
		jQuery(this).executeStyledSelectEvents();
	}
}

jQuery.fn.updateStyledDiv = function(){
	var inputid = jQuery(this).attr("id");

	//Text value of the selected option
	var optionselectedvalue = jQuery("select#"+inputid + " option:selected").val();
	var optionsoftheselect = jQuery("select#"+inputid).children();

	var newselectcontent = "";
	optionsoftheselect.each(function(index) {
		if(jQuery(this).val() == optionselectedvalue){
			newselectcontent = newselectcontent + "<div id='"+jQuery(this).val()+"-"+index +"' class='custom-select-option custom-select-option-selected'><a tabindex='0' href='#'>" + jQuery(this).text() + "</a></div>";
		} else {
			newselectcontent = newselectcontent + "<div id='"+jQuery(this).val()+"-"+index +"' class='custom-select-option'><a tabindex='0' href='#'>" + jQuery(this).text() + "</a></div>";
		}
	});

	//Build the link
	if(optionselectedvalue == "" || optionselectedvalue == "empty"){
		optionselectedvalue = "&nbsp;";
	}
	
	//Update of Custom Select Link
	jQuery("#custom-select-link-" + inputid).html("<span tabindex='0'>" + optionselectedvalue + "</span>");
	
	//update the pseudo select
	jQuery("#custom-select-" + inputid).html(newselectcontent);
	
	jQuery(this).executeStyledSelectEvents();
}


jQuery.fn.executeStyledSelectEvents = function(){
	var inputid = jQuery(this).attr("id");
	//Show menu
	jQuery('div#custom-select-link-' + inputid).unbind("click");
	jQuery('div#custom-select-link-' + inputid).click(
		function(event) {
			jQuery('div#custom-select-link-' + inputid).toggleClass('custom-select-link-hover');
			jQuery('div#custom-select-' + inputid).toggleClass('custom-select-hover');
		}
	);
	
	jQuery('div#custom-select-link-' + inputid).unbind("keyup");
	jQuery('div#custom-select-link-' + inputid).keyup(
		function(event) {
			if (event.which==13) {
				jQuery('div#custom-select-link-' + inputid).toggleClass('custom-select-link-hover');
				jQuery('div#custom-select-' + inputid).toggleClass('custom-select-hover');
			}
		}
	);
	
	//Select the right div and set the select option
	
	jQuery('div#custom-select-' + inputid + " div").mousedown(
		function(event) {
			//Get index
			var currentIndexArray = jQuery(this).attr("id").split("-");
			jQuery(this).selectedOption(inputid,currentIndexArray[0]);
			jQuery("select#"+inputid).change();
		}
	);
	
	jQuery('div#custom-select-' + inputid + " div").keyup(
			function(event) {
				if (event.which==13) {
					//Get index
					var currentIndexArray = jQuery(this).attr("id").split("-");
					jQuery(this).selectedOption(inputid,currentIndexArray[0]);
					jQuery("select#"+inputid).change();
					// hide menu
					jQuery('div#custom-select-' + inputid).toggleClass('custom-select-hover');
					jQuery('div#custom-select-link-' + inputid).toggleClass('custom-select-link-hover');
				}
			}
		);
	
	//Add mouse over effect
	jQuery('div#custom-select-' + inputid + " div a").hover(
		function(event) {
			//console.info("add class",jQuery(this).text());
			jQuery(this).addClass('custom-select-option-hover');
		},
		function(event) {
			//Set the new select on the div
			//console.info("remove class");
			jQuery(this).removeClass('custom-select-option-hover');
		}				
	);

	//Click menu
	jQuery(document).mousedown(function(event){
		if(jQuery('div#custom-select-' + inputid).hasClass("custom-select-hover"))
			{
				//console.log("self close has class");
				jQuery('div#custom-select-' + inputid).toggleClass('custom-select-hover');
				jQuery('div#custom-select-link-' + inputid).toggleClass('custom-select-link-hover');
			}
	});
	
	jQuery(document).keyup(function(event){
		// Touche Echap
		if (event.which==27) {
			if(jQuery('div#custom-select-' + inputid).hasClass("custom-select-hover"))
				{
					//console.log("self close has class");
					jQuery('div#custom-select-' + inputid).toggleClass('custom-select-hover');
					jQuery('div#custom-select-link-' + inputid).toggleClass('custom-select-link-hover');
				}
		}
	});
	
	//Delete Class Disabled on Custom select link
	jQuery('div#custom-select-link-' + inputid).removeClass("disabled");
}

jQuery.fn.disableStyledSelect = function(text){
	var inputid = jQuery(this).attr("id");
	
	// Disable the custim select link
	jQuery('div#custom-select-link-' + inputid).addClass("disabled");
	jQuery('div#custom-select-link-' + inputid).unbind("click");
	
	jQuery('div#custom-select-link-' + inputid).html("<span tabindex'0' >"+text+"</span>")
}

jQuery.fn.selectedOption= function (inputid,selectedValue){
	//Set the new value of the real select
	jQuery("select#"+inputid+" option[value="+selectedValue+"]").attr("selected", "selected");
	//remove the old select of the div
	jQuery('div#custom-select-' + inputid).children().removeClass('custom-select-option-selected');
	//Set the new select on the div
	jQuery('div#custom-select-' + inputid + ' #'+selectedValue+"-"+jQuery("select#"+inputid).get(0).selectedIndex).addClass('custom-select-option-selected');
	//Set the link
	jQuery('div#custom-select-link-' + inputid + ' span').text(jQuery("select#"+inputid+" :selected").text());
}
