https://avaaz.org/campaign/static/js/jquery.infieldlabel.js?1747848700

1/*
2 * jquery.infieldlabel
3 * A simple jQuery plugin for adding labels that sit over a form field and fade away when the fields are populated.
4 *
5 * Copyright (c) 2009 - 2013 Doug Neiner <[email protected]> (http://code.dougneiner.com)
6 * Source: https://github.com/dcneiner/In-Field-Labels-jQuery-Plugin
7 * Dual licensed MIT or GPL
8 *   MIT (http://www.opensource.org/licenses/mit-license)
9 *   GPL (http://www.opensource.org/licenses/gpl-license)
10 *
11 * @version 0.1.4
12 */
13(function ($) {
14    $.InFieldLabelsSetPosition = function() {
15        $('.set-label-position').filter(':visible').each(function(){
16            $(this).trigger('setLabelPosition');
17        }).removeClass('set-label-position');
18    }
19
20  $.InFieldLabels = function (label, field, options) {
21    // To avoid scope issues, use 'base' instead of 'this'
22    // to reference this class from internal events and functions.
23    var base = this;
24
25    // Access to jQuery and DOM versions of each element
26    base.$label = $(label);
27    base.label  = label;
28
29    base.$field = $(field);
30    base.field  = field;
31
32    base.$label.data("InFieldLabels", base);
33    base.showing = true;
34
35    base.init = function () {
36      var initialSet;
37
38      // Merge supplied options with default options
39      base.options = $.extend({}, $.InFieldLabels.defaultOptions, options);
40
41      // Add provided class name to the label, if set
42      if ( base.options.className ) {
43        base.$label.addClass(base.options.className);
44      }
45
46      // Check if the field is already filled in
47      // add a short delay to handle autocomplete
48      setTimeout(function() {
49        if (base.$field.val() !== "") {
50          base.$label.hide();
51          base.showing = false;
52        } else {
53          base.$label.show();
54          base.showing = true;
55        }
56      }, 200);
57      if (base.$label.data('context')) {
58          base.$label.click(function (e) {
59              e.preventDefault();
60              base.$field.trigger('focus');
61          });
62      }
63      base.$field.focus(function () {
64        base.fadeOnFocus();
65      }).blur(function () {
66        base.checkForEmpty(true);
67      }).bind('keydown.infieldlabel', function (e) {
68        // Use of a namespace (.infieldlabel) allows us to
69        // unbind just this method later
70        base.hideOnChange(e);
71      }).bind('paste', function () {
72        // Since you can not paste an empty string we can assume
73        // that the field is not empty and the label can be cleared.
74        base.setOpacity(0.0);
75      }).change(function () {
76        base.checkForEmpty();
77      }).bind('onPropertyChange', function () {
78        base.checkForEmpty();
79      }).bind('keyup.infieldlabel', function () {
80        base.checkForEmpty();
81      });
82
83      if ( base.options.pollDuration > 0 ) {
84        initialSet = setInterval( function () {
85        if (base.$field.val() !== "") {
86          base.$label.hide();
87          base.showing = false;
88          clearInterval( initialSet );
89        }
90      }, base.options.pollDuration );
91
92      }
93    };
94
95    // If the label is currently showing
96    // then fade it down to the amount
97    // specified in the settings
98    base.fadeOnFocus = function () {
99      if (base.showing) {
100        base.setOpacity(base.options.fadeOpacity);
101      }
102    };
103
104    base.setOpacity = function (opacity) {
105      base.$label.stop().animate({ opacity: opacity }, base.options.fadeDuration);
106      base.showing = (opacity > 0.0);
107    };
108
109    // Checks for empty as a fail safe
110    // set blur to true when passing from
111    // the blur event
112    base.checkForEmpty = function (blur) {
113      if (base.$field.val() === "") {
114        base.prepForShow();
115        base.setOpacity(blur ? 1.0 : base.options.fadeOpacity);
116      } else {
117        base.setOpacity(0.0);
118      }
119    };
120
121    base.prepForShow = function () {
122      if (!base.showing) {
123        // Prepare for a animate in...
124        base.$label.css({opacity: 0.0}).show();
125
126        // Reattach the keydown event
127        base.$field.bind('keydown.infieldlabel', function (e) {
128          base.hideOnChange(e);
129        });
130      }
131    };
132
133    base.hideOnChange = function (e) {
134      if (
135          (e.keyCode === 16) || // Skip Shift
136          (e.keyCode === 9) // Skip Tab
137        ) {
138        return;
139      }
140
141      if (base.showing) {
142        base.$label.hide();
143        base.showing = false;

144      }
145
146      // Remove keydown event to save on CPU processing
147      base.$field.unbind('keydown.infieldlabel');
148    };
149
150    // Run the initialization method
151    base.init();
152  };
153
154  $.InFieldLabels.defaultOptions = {
155    fadeOpacity: 0.5, // Once a field has focus, how transparent should the label be
156    fadeDuration: 300, // How long should it take to animate from 1.0 opacity to the fadeOpacity
157    pollDuration: 0, // If set to a number greater than zero, this will poll until content is detected in a field
158    enabledInputTypes: [ "text", "search", "tel", "url", "email", "password", "number", "textarea" ],
159    className: false // Class assigned to enhanced labels
160  };
161
162
163  $.fn.inFieldLabels = function (options) {
164    var allowed_types = options && options.enabledInputTypes || $.InFieldLabels.defaultOptions.enabledInputTypes;
165
166    return this.each(function () {
167      // Find input or textarea based on for= attribute
168      // The for attribute on the label must contain the ID
169      // of the input or textarea element
170      var for_attr = $(this).attr('for'), field, restrict_type, context;
171      if (!for_attr) {
172        return; // Nothing to attach, since the for field wasn't used
173      }
174      // Find the referenced input or textarea element
175      if ($(this).data('context')) {
176          field = $('#' + for_attr, $(this).data('context')).get(0);
177      } else {
178          field = document.getElementById( for_attr );
179      }
180
181      if ( !field ) {
182        return; // No element found
183      }
184
185      // Restrict input type
186      restrict_type = $.inArray( field.type, allowed_types );
187
188      if ( restrict_type === -1 && field.nodeName !== "TEXTAREA" ) {
189        return; // Again, nothing to attach
190      }
191
192      // Only create object for matched input types and textarea
193      (new $.InFieldLabels(this, field, options));
194    });
195  };
196
197}(jQuery));