1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 | // $Id: compact_forms.js,v 1.11 2011/01/09 05:51:15 sun Exp $ (function ($) { Drupal.compactForms = {}; /** * Compact Forms jQuery plugin. */ $.fn.compactForm = function (stars) { stars = stars || 0; this.each(function () { $(this).addClass('compact-form').find('label').each(function () { var context = this.form; var $label = $(this); if (!$label.attr('for')) { return; } var $field = $('#' + $label.attr('for'), context); if (!$field.length || !$field.is('input:text,input:password,textarea')) { return; } // Store the initial field value, in case the browser is going to // automatically fill it in upon focus. var initial_value = $field.val(); if (initial_value != '') { // Firefox doesn't like .hide() here for some reason. $label.css('display', 'none'); } $label.parent().addClass('compact-form-wrapper'); $label.addClass('compact-form-label'); $field.addClass('compact-form-field'); if (stars === 0) { $label.find('.form-required').hide(); } else if (stars === 2) { $label.find('.form-required').insertAfter($field).prepend(' '); } $field.focus(function () { // Some browsers (e.g., Firefox) are automatically inserting a stored // username and password into login forms. In case the password field is // manually emptied afterwards, and the user jumps back to the username // field (without changing it), and forth to the password field, then // the browser automatically re-inserts the password again. Therefore, // we also need to test against the initial field value. if ($field.val() === initial_value || $field.val() === '') { $label.fadeOut('fast'); } }); $field.blur(function () { if ($field.val() === '') { $label.fadeIn('slow'); } }); // Chrome adds passwords after page load, so we need to track changes. $field.change(function () { if ($field.get(0) != document.activeElement) { if ($field.val() === '') { $label.fadeIn('fast'); } else { $label.css('display', 'none'); } } }); }); }); }; /** * Attach compact forms behavior to all enabled forms upon page load. */ Drupal.behaviors.compactForms = { attach: function (context, settings) { if (!settings || !settings.compactForms) { return; } $('#' + settings.compactForms.forms.join(',#'), context).compactForm(settings.compactForms.stars); // Safari adds passwords without triggering any event after page load. // We therefore need to wait a bit and then check for field values. if ($.browser.safari) { setTimeout(Drupal.compactForms.fixSafari, 200); } } }; /** * Checks for field values and hides the corresponding label if non-empty. * * @todo Convert $.fn.compactForm to always use a function like this. */ Drupal.compactForms.fixSafari = function () { $('label.compact-form-label').each(function () { var $label = $(this); var context = this.form; if ($('#' + $label.attr('for'), context).val() != '') { $label.css('display', 'none'); } }); } })(jQuery); |