/// <reference path="~/Scripts/jquery-1.3.2-vsdoc2.js">

/* 
    Search Placeholder
    adds a "search" icon (magnifying glass that will auto-show/hide on focus 
    
    main thing to watch out for is positioning of the icon - the location is actually based on the parent of the textbox...
*/

(function($) {
    /* initialise placeholder + events - and the search icon - one day we may want to add a "busy" status too... */
    $.fn.addSearchIcon = function(options) {
        this.each(function() {
            var $search = $(this);
            var $placeholderIcon = $('<span class="ui-icon ui-icon-search search-placeholder search-placeholder-icon"></span>');
            var $placeholderText = $('<span class="search-placeholder search-placeholder-text">Search</span>');

            $placeholderIcon.hide();
            $placeholderText.hide();
            $placeholderIcon.insertBefore(this);
            $placeholderText.insertBefore(this);

            if ($search.val() == "") {
                $placeholderIcon.show();
                $placeholderText.show();
            }

            $search.focus(function(event) {
                $placeholderIcon.hide();
                $placeholderText.hide();
            });

            $search.blur(function(event) {
                if ($search.val() == "") {
                    $placeholderIcon.show();
                    $placeholderText.show();
                }
            });

            $placeholderIcon.click(function(event) {
                $search.focus()
            });
            $placeholderText.click(function(event) {
                $search.focus()
            });
        });
    }
})(jQuery);