jQuery.waMultiSelectUncheckAll = function(id)
{
        $(':checkbox', id).attr('checked','');          
}

jQuery.fn.waMultiSelect = function(options) {
       
    options = jQuery.extend({
        nameValueHash: []
        ,selectedValues: []                
    }, options);
    
    return this.each(function(){        
        $this = $(this);
        $this.addClass("waMultiSelect");
        var selectId = $this.attr('id');
        var popupId = selectId + "-pop";
        var jqPopupId = "#" + popupId;
        var ulId = selectId + "-optionList";
        
        //-------  build up the html
        // container for popup
        var html = [];
        html.push("<div id='" + popupId + "' class='waMultiSelectPopup' style='display:none;'>");
        
        // ok/submit button
        var onclick = "$('#" + popupId + "').hide();";
        html.push("<div class='buttonContainer'> <input type='button' value='Submit' class='button' onclick=\"" + onclick + "\" /> </div>");
               
        // 'select all' checkbox
        var selectAllId = "chk-" + selectId + "-all";
        html.push("<div class='selectAll'> <label for='" + selectAllId + "'><input type='checkbox' id='" + selectAllId + "' value='' title='Select All' />Select All</label> </div>");
                
        // list item checkboxes
        html.push("<ul id='" + ulId + "'>");
        var i = 0;
        for(var key in options.nameValueHash)
        {            
            var liId = "chk-" + selectId + "-" + i; 
            var value = options.nameValueHash[key];           
                                               
            html.push("<li> <label for='" + liId + "'><input type='checkbox' id=\"" + liId + "\" name=\"" + selectId + "\" value=\"" + value + "\" />" + key + "</label> </li>");
            i++;
        }                
        html.push("</ul> </div>");
        
        // append HTML        
        $this.after(html.join(''));
        
        //---------- set selected values
        if(options.selectedValues.length > 0)
        {
            $("ul :checkbox", "#" + popupId).setValue(options.selectedValues);
        }

        //---------- attach click handlers      
        // select click             
        $this.click(function(event) {                                     
            var $me = $(this);
            $me.blur();            
            
            var $popupDiv = $(jqPopupId);
            $popupDiv.toggle();
            if($popupDiv.is(':visible'))
            {
                $popupDiv.focus();
                $popupDiv.trigger('click');
            }
            else
            {
                event.preventDefault();
                event.stopPropagation();                
                return false;                       
            }
        });
        // 'select all' checkbox click
        $("#" + selectAllId).click(function() {            
            if($(this).is(':checked'))
            {
                $(':checkbox', jqPopupId).attr('checked','checked');
            }
            else
            {
                $(':checkbox', jqPopupId).attr('checked','');
            }
        });        
        // item checkbox click
        $(":checkbox",jqPopupId).click(function() {                       
            updateTitle($("#" + selectId), $("#" + ulId));            
        });        
        
        //---------- update title
        updateTitle($this, $(jqPopupId));
        
        //--------- fix for IE6 z-index
        $('div.waMultiSelectPopup').bgiframe({ opacity: false, src: '#' });
    });
    
    function updateTitle(theSelect, theList)
    {       
        // empty all <option> elements        
        theSelect.empty();
        // add 1 so we can use it for the "title"
        theSelect.append("<option></option>");   

		var $checkedOptions = $(':checkbox:checked', theList);
		var $allOptions = $(':checkbox', theList);
		
		$('option',theSelect).text("\u00A0");   // set to &nbsp; by default
				
		if($checkedOptions.length == $allOptions.length)
		{			
			$('option',theSelect).text('[ All ]');   
		}
		else if($checkedOptions.length > 0)
		{					
			$('option',theSelect).text($checkedOptions.length + " options selected");   			
		}                 
    }
};