/*
* html5support.js
* Amiel Martin
* 2010-01-26
*
* Support certain HTML 5 attributes with javascript, but only if the browser doesn't already support them.
*/

var HTML5Support = (function($){
var // private members
// if no value is specified, find placeholder text in this html attribute
placeholder_attribute = 'placeholder',
// give the input field this class when the placeholder text is used
placeholder_klass = placeholder_attribute,
// this will become our HTML5Support object
h5 = {};

// public functions
$.extend(h5, {
supports_attribute: function(attribute, type) { // should we memoize this?
return attribute in document.createElement(type || 'input');
}
});

// private functions
function tabularosa() {
var self = $(this),
      // I've added three unprintable invisible characters to the end here.
      // That indicates without a doubt that the value in the box was put
      // there as a placeholder and not by the user. This is great for
      // situations when the placeholder might be "USA" and the user enters
      // the string "USA", and it disappears and gets a placeholder class.
      // I tried fixing it the right way, but that didn't seem to work across
      // refreshes in firefox.
value = self.attr(placeholder_attribute) + "\u00A0\u00A0\u00A0",
set_value = function() {
if ($.trim(self.val()) == '' || self.val() == value)
self.val(value).addClass(placeholder_klass);
},
clear_value = function() {
if (self.val() == value)
self.val('').removeClass(placeholder_klass);
};
self.focus(clear_value).blur(set_value).blur();
}

// this one is sort of hacky
function password_tabularosa() {
        var self = $(this),
            value = self.attr(placeholder_attribute),
            // setting the type attribute seems to work when the element is not in the dom (at least on firefox so far)
            placeholder_input = self.clone().attr('type', 'text').attr('id', '').val(value).addClass(placeholder_klass).css('display', 'none'),
            set_value = function() {
                if ($.trim(self.val()) == '') {
                    placeholder_input.show();
self.hide();
                }
            },
            clear_value = function() {
                placeholder_input.hide();
                self.show().focus();
            };
        self.after(placeholder_input);
        placeholder_input.focus(clear_value).blur(set_value);
        self.blur(set_value).blur();
}


// jquery plugins

$.fn.placeholder = function(value) {
if (h5.supports_attribute('placeholder')) return this;
return this.each(function() {
($(this).attr('type') == 'password') ? password_tabularosa.apply(this) : tabularosa.apply(this);
});
};

$.fn.autofocus = function() {
if (h5.supports_attribute('autofocus')) return this;
return this.focus();
};


$.autofocus = function() { $('[autofocus]').autofocus(); };
$.placeholder = function() { $('['+placeholder_attribute+']').placeholder(); };

$.html5support = function() { $.autofocus(); $.placeholder(); };

return h5;
})(jQuery);


