/*

    Note: This was an exercise in both jQuery and UI. However, we have never
    been able to test the feature, and therefore do not know empirically if it
    would help or hinder usability.

    Here we add some helpful interaction feedback. A user may fill out a
    form that has inputs with placeholder text where those inputs are allowed
    to be empty. A user may question whether that placeholder text will be
    submitted along with their other data. To mitigate this concern, we
    remove placeholder text when a submit element is hovered or focused.

    The placeholder is then shown again when the submit element is un-hovered
    and -focused.

    Usage::

        $('form').placehold();

        // With a custom submitter selector.
        $('form').placehold({'submitters': $('button[type=submit]')});

*/

(function($) {
  $.fn.placehold = function(options) {

    // Settings
    var settings = $.extend({
      submitters: $('button[type=submit],input[type=submit]')
    }, options);

    // Iterate and return each form selected.
    return $(this).each(function() {
      var submitters = settings.submitters;

      // Hide placeholder text
      submitters.bind('focus mouseenter submit', function() {
        $(this).closest('form').find('*[placeholder]').each(function() {
          $(this).data('placeholder', $(this).attr('placeholder'));
          $(this).attr('placeholder', '');
        });
      });

      // Re-show the placeholder text
      submitters.bind('blur mouseleave', function() {
        // Make an Array of all elements being focused or hovered.
        var foverd_array = $.makeArray($('*:focus,*:hover'));

        // Re-show the placeholder text only if the submit mechanism is being
        // neither hovered over nor focused on.
        if (foverd_array.indexOf(this) == -1) {
          $(this).closest('form').find('*').each(function() {
            if ($(this).data('placeholder')) {
              $(this).attr('placeholder', $(this).data('placeholder'));
            }
          });
        }
      });

    });
  };
})(jQuery);