/***************************************
   Default Text Plugin for inputs
   @author Karl Swedberg
   @version 0.5 (07/08/2008)
   @requires jQuery v1.2.6+
   
 ************************************** */
 
(function($) {
  $.fn.defaulttext = function(options) {
    var elText = { 
      title: function(input) {
        return $(input).attr('title');
      },
      label: function(input) {
        return $('label[for=' + input.id +']').text();
      }
    };
    var defText;
    var toggleClear = function(field) {
      var $sc = field.parent().find('a.search-clear');

      if (field.val() ) {
        if ($sc.css('left') == '-4000em') {$sc.css('left', '');}
      } else {
        $sc.css('left', '-4000em');
      } 
    };

    return this.each(function() {
      var $input = $(this);
      if (this.type === 'text' || this.nodeName.toLowerCase() === 'textarea') {
        var opts = $.extend({}, $.fn.defaulttext.defaults, options || {}, $.metadata ? $input.metadata() : $.meta ? $input.data() : {});
        // set the default text based on the value of the dtText option
        if (opts.dtText.constructor === Function) {
          defText = opts.dtText(this);
        } else if (opts.dtText && opts.dtText.constructor === String){
          defText = (/(title|label)/).test(opts.dtText) ? elText[opts.dtText](this) : opts.dtText;
          if (opts.dtText === 'label') {
            $('label[for= '+ this.id + ']').css({position: 'absolute', left: '-4000em'});
          }
        } 
        if (!defText) {return;}

        // create a search field
        // thx to Sven Fuchs for the inspiration
        // http://www.artweb-design.de/2007/4/16/safari-beautiful-search-input-tag-fixed
        var nsSearch = opts.search !== false && !$.browser.safari;        
        if ($.browser.safari && opts.search !== false) {
          this.type = 'search';
          this.setAttribute('placeholder',defText);
          this.setAttribute('autosave',opts.autosave);
          this.setAttribute('results',opts.results);
          if (opts.incremental) {this.setAttribute('incremental',opts.incremental);}
          return;
        } else if (nsSearch) {
          $input.wrap('<div class="search-wrapper"></div>').css({
            borderWidth: '0', 
            backgroundColor: 'transparent'
          });
          var $searchWrapper = $input.parent()
          .prepend('<a tabindex="-1" href="#" style="position:absolute;left:-4000em" class="search-clear"></a>')
            .prepend('<div class="search-left"></div>')
            .prepend('<div class="search-right"></div>');
          var capsWidth = $searchWrapper.find('div.search-left').width()*2,
            $clearButton = $searchWrapper.find('a.search-clear');
            
          $input.width($input.width() - capsWidth - parseInt(opts.offsetWidth,10));
          $searchWrapper.css({
            width: $input.width() + capsWidth
          });
          $clearButton.click(function() {
            $input.val('').focus();
            toggleClear($input);
            return false;
          });
          
          
          // toggle the clear button on DOM ready
          toggleClear($input);
          
          // toggle the clear button on user input of search field
          $input.bind('keyup', function() {
            toggleClear($input);
          });
        }

        if ($input.parent().css('position') == 'static') {
          $input.parent().css({position: 'relative'});
        }
        $(opts.dtTag).html(defText)
          .addClass(opts.dtClass)
          .css({
            position: 'absolute',
            top: $input.position().top,
            left: $input.position().left,
            display: 'none'
          })
          .insertBefore($input);

        // hide default text on focus
        $input.focus(function() {
          dtHide($input);
          if (nsSearch) {
            $searchWrapper.addClass('search-focused');
          }
        });
        $input.prev('.' + opts.dtClass).click(function() {
          dtHide($input);
          $input.focus();
        });

        // conditionally show default text on ready and input blur
        dtShow($input);
        $input.blur(function() {
          dtShow($input);
          if (nsSearch) {
            $searchWrapper.removeClass('search-focused');
          }

        });
      }
    });


    function dtHide(el) {
      el.prev().hide();
    }
    function dtShow(el) {
      if ($.trim(el.val()) == '') {
        el.prev().show();
      }
    }
  };
  $.fn.defaulttext.defaults = {
    dtTag: '<span></span>', 
    dtClass: 'default-text',
    dtText: 'label',            // 'label' uses text of input's label; 'title' uses input's title attribute. 
                                //  otherwise, use some other string or function
    search: false,
    autosave: location.hostname,
    results: '10',
    incremental: 'true',
    offsetWidth: 0
    
  };
})(jQuery);