
	(function($){  
		
		$.fn.dbselects = function(options) {
			
			var defaults = {
					width                : 'get',
					maxWidth             : 200,
					maxItemsBeforeScroll : 100,
					showNullValues       : false
			};
			
			var options = $.extend(defaults, options);
			
			var z = 999;
			
			return this.each(function() {  
				// get the current select box
				targetSelect = $(this);
				
				// hide the current select box
				targetSelect.hide();
				
				// insert the target div. this is where the new list will appear
				targetSelect.after('<div class="dbselect"></div>');
				
				// get the new target div
				var targetDiv = targetSelect.next('.dbselect');
				
				// insert the new foundation markup
				targetDiv.append('<dl class="dropdown"><dt><a class="dropdown_toggle" href="/"></a></dt><dd><div class="listOptions"><ul></ul></div></dd></dl>');
				
				// set the z-index, then decrease to allow multiple dbselects to overlap properly
				targetDiv.find('.dropdown').css('zIndex', z);
				z--;
				
				// parse all options within the current select and set indices
				var i = 0;
				var optionsList = '';
				targetSelect.find('option').each(function() {
					if(options.showNullValues == false) {
						if($(this).val() != "") {
							optionsList += '<li><a href="/"><span class="value">' + $(this).text() + '</span><span class="hidden index">' + i + '</span></a></li>';						
						}
					} else {
						optionsList += '<li><a href="/"><span class="value">' + $(this).text() + '</span><span class="hidden index">' + i + '</span></a></li>';
					}
						if($(this).attr('selected') == true) {
						targetDiv.find('a.dropdown_toggle').append('<span></span>').find('span').text($(this).text());
					}
					i++;
				});
				targetDiv.find('.listOptions UL').append(optionsList);
				
				// set the height of the options list, based on options.maxItemsBeforeScroll
				var optionsHeight = 3;
				var optionsLength = optionsLength = targetDiv.find('.listOptions li').length;
				var optionItemHeight = targetDiv.find('DIV.listOptions UL LI:eq(0)').height();
				
				//var temp = targetDiv.find('.listOptions LI');
				if(optionsLength >= options.maxItemsBeforeScroll) {
					targetDiv.find('.listOptions').css('height', (optionItemHeight * options.maxItemsBeforeScroll) + optionsHeight);
				} else {					
					targetDiv.find('.listOptions').css('height', (optionItemHeight * optionsLength) + optionsHeight);
				}
				
				// set the width
				if(options.width == 'auto') {
					// if
					
					// find the width of the widest element
					var allWidths = new Array();
					var padding = parseInt(targetDiv.find('a.dropdown_toggle').css('paddingRight'));
					allWidths.push(targetDiv.find('a.dropdown_toggle SPAN').width());
					var liWidth = 0;
					targetDiv.find('.listOptions li').each(function() {
						liWidth = $(this).find('span.value').width() + $(this).find('span.index').width() + padding;
						allWidths.push(liWidth);
					});
					allWidths = allWidths.sort(function(a, b){
					    return a - b;
					});
					
					var biggestWidth = allWidths[(allWidths.length - 1)] + padding;
					var newWidth = 0;
					
					if(biggestWidth >= options.maxWidth) {
						newWidth = options.maxWidth;
					} else {
						newWidth = biggestWidth;
					}
				} else if(options.width == 'get') {
					newWidth = parseInt(targetSelect.css('width'));
				} else {
					newWidth = options.width;
				}
				
				targetDiv.css('width', newWidth + 'px');
				targetDiv.find('.listOptions').css('width', newWidth + 'px');
				targetDiv.find('.dropdown').css('width', newWidth + 'px');
				
				// hide the options for now
				targetDiv.find('.listOptions').hide();
				
				// bind listeners to all the links
				$('.dropdown a.dropdown_toggle').live('click', function() {
					var optionSet = $(this).parent().parent().find('.listOptions');
					if(optionSet.css('display') == 'block') {
						$('.activedropdown').removeClass('activedropdown');
						optionSet.hide();
					} else {
						optionSet.parent().parent().addClass('activedropdown');
						optionSet.show();
					}
					return false;
				});
				
				$('.listOptions a').live('click', function(e) {
					if(e.target.nodeName.toUpperCase() == 'SPAN') {
						var thisDiv = $(this).parents('.dbselect');
					} else if(e.target.nodeName.toUpperCase() == 'A') {
						var thisDiv = $(this).parents('.dbselect');
					}
					$('.listOptions').hide();
					var realSelect = thisDiv.prev();
					if ( realSelect.attr('generated') == 'true' && realSelect.hasClass('error') ) {
						realSelect = thisDiv.prev().prev();
					}
					realSelect[0].selectedIndex = $(this).find('span.index').text();
					realSelect.trigger('change');
					thisDiv.find('.dropdown_toggle').empty().append('<span></span>').find('span').text($(this).find('span.value').text());
					return false;
				});
				
				$(document).mousedown(function(event) {
					if ($(event.target).parents('.activedropdown').length === 0) {
						$('.activedropdown').removeClass('activedropdown');
						$('.listOptions').hide();
					}
				});
			});
		};  	
	})(jQuery);