(function($){

 	$.fn.extend({ 
 		
		//pass the options variable to the function
 		jqforms: function(options) {


			//Set the default values, use comma to separate the settings, example:
			var defaults = {
				relValue: "jQForms",
                imageFolder: "jQForms/images/",
                selectClass: "jqforms_select",
                selectHoverClass: "jqforms_select_hover",
                optionClass: "jqforms_options",
                optionHoverClass: "hover",
                displayClass: "jqforms_display"
			}
				
			var options = $.extend(defaults, options);
            
            function closeOptions() {
                $("." + options.optionClass).each(function() {
                    $(this).fadeOut(200);
                    var currentIndex = $(this).parent().prev().attr("selectedIndex");
                    selectIndex($(this).parent(), currentIndex);
                });
            };
            
            function openOptions(element) {
                var optionsElement = $(element).find("." + options.optionClass);
                if ($(optionsElement).css("display") == "none") {
                    $(element).find("." + options.optionClass).fadeIn(200);
                } else {
                    $(element).find("." + options.optionClass).fadeOut(200);    
                }
                var currentIndex = $(element).prev().attr("selectedIndex");
                selectIndex($(element), currentIndex);    
            };
            
            function selectIndex(element, index) {
	           //select right index
               var realSelect = $(element).prev();
               $(realSelect).attr("selectedIndex", index);
               
               //place right text inside display
               var display = $(element).find("." + options.displayClass);
               var optionsArr = $(element).find("." + options.optionClass + " div");
               
               var i = 0;
               $(optionsArr).each(function() {
                    $(this).removeClass(options.optionHoverClass);
                    
                    if (index == i) {
                        $(display).text($(this).text());
                        $(this).addClass(options.optionHoverClass);
                    }
                    
                    i++;
               });
            };
            
    		return this.each(function() {
				var o = options;
				
                //find all jQForms elements
                $(this).find("[rel=" + o.relValue + "]").each(function() {
                    var type = $(this).attr("type");
                    var tag = this.tagName.toLowerCase();
                    
                    if (tag == "select") {
                        //create new select box
                        var newSelect = $("<div></div>");
                        $(newSelect).addClass(o.selectClass);
                        
                        var options = $("<div></div>");
                        $(options).addClass(o.optionClass);
                        
                        //get options and append
                        var i = 0;
                        $(this).children("option").each(function() {
                            var option = $("<div>" + $(this).text() + "</div>");
                            $(option).attr("rel", i);                            
                            
                            option.appendTo($(options));
                            i++;
                        });
                        
                        $(options).appendTo($(newSelect));
                        $(newSelect).insertAfter($(this));
                        
                        $(newSelect).css({
                            "width": $(options).innerWidth() + "px"
                        });
                        
                        var selectOption = $("<div></div>").prependTo($(newSelect));
                        $(selectOption).addClass("jqforms_display");
                        
                        $(options).css({
                            display: "none"
                        });
                        
                        //fix width of options + hide
                        $(options).children().css({
                            paddingRight: "30px"
                        });
                        
                        //bind hover on options
                        $(options).children().mouseover(function(){
                            $(this).parent().children().removeClass(o.optionHoverClass);
                            $(this).addClass(o.optionHoverClass);
                        });
                        
                        //hide the current element
                        $(this).css({
                            "display": "none"
                        });
                        
                        //set to the right value
                        var currentIndex = this.selectedIndex;
                        selectIndex($(newSelect), currentIndex);
                        
                        //prevent text selection
                        $(newSelect).disableTextSelect();
                        
                        //bind hover
                        $(newSelect).hover(function () {
                            $(this).removeClass(o.selectClass);
                            $(this).addClass(o.selectHoverClass);
                        }, function () {
                            $(this).addClass(o.selectClass);
                            $(this).removeClass(o.selectHoverClass);
                        });
                        
                        //bind click                      
                        $(newSelect).click(function(event) {
                            event.stopPropagation();
                            openOptions($(this));
                        });
                        
                        //bind click options
                        var i = 0;
                        $(options).children().each(function () {
                            $(this).click(function() {
                                filter_maat($(this).text());
                                selectIndex($(this).parent().parent(), $(this).attr("rel"));
                            });
                            i++;
                        });
                        
                        $('html').click(function() {
                            closeOptions();
                        });
                    }
                });
			
    		});
    	}
	});
    $.extend($.fn.disableTextSelect = function() {
		return this.each(function(){
			if($.browser.mozilla){//Firefox
				$(this).css('MozUserSelect','none');
			}else if($.browser.msie){//IE
				$(this).bind('selectstart',function(){return false;});
			}else{//Opera, etc.
				$(this).mousedown(function(){return false;});
			}
		});
	});
})(jQuery);