root / snf-cyclades-app / synnefo / ui / new_ui / ui / javascripts / foundation / foundation.placeholder.js @ e4a6c3b8
History | View | Annotate | Download (4.5 kB)
1 |
/*! http://mths.be/placeholder v2.0.7 by @mathias
|
---|---|
2 |
Modified to work with Zepto.js by ZURB
|
3 |
*/
|
4 |
;(function(window, document, $) { |
5 |
|
6 |
var isInputSupported = 'placeholder' in document.createElement('input'), |
7 |
isTextareaSupported = 'placeholder' in document.createElement('textarea'), |
8 |
prototype = $.fn,
|
9 |
valHooks = $.valHooks,
|
10 |
hooks, |
11 |
placeholder; |
12 |
|
13 |
if (isInputSupported && isTextareaSupported) {
|
14 |
|
15 |
placeholder = prototype.placeholder = function() { |
16 |
return this; |
17 |
}; |
18 |
|
19 |
placeholder.input = placeholder.textarea = true;
|
20 |
|
21 |
} else {
|
22 |
|
23 |
placeholder = prototype.placeholder = function() { |
24 |
var $this = this; |
25 |
$this
|
26 |
.filter((isInputSupported ? 'textarea' : ':input') + '[placeholder]') |
27 |
.not('.placeholder')
|
28 |
.bind({ |
29 |
'focus.placeholder': clearPlaceholder,
|
30 |
'blur.placeholder': setPlaceholder
|
31 |
}) |
32 |
.data('placeholder-enabled', true) |
33 |
.trigger('blur.placeholder');
|
34 |
return $this; |
35 |
}; |
36 |
|
37 |
placeholder.input = isInputSupported; |
38 |
placeholder.textarea = isTextareaSupported; |
39 |
|
40 |
hooks = { |
41 |
'get': function(element) { |
42 |
var $element = $(element); |
43 |
return $element.data('placeholder-enabled') && $element.hasClass('placeholder') ? '' : element.value; |
44 |
}, |
45 |
'set': function(element, value) { |
46 |
var $element = $(element); |
47 |
if (!$element.data('placeholder-enabled')) { |
48 |
return element.value = value;
|
49 |
} |
50 |
if (value == '') { |
51 |
element.value = value; |
52 |
// Issue #56: Setting the placeholder causes problems if the element continues to have focus.
|
53 |
if (element != document.activeElement) {
|
54 |
// We can't use `triggerHandler` here because of dummy text/password inputs :(
|
55 |
setPlaceholder.call(element); |
56 |
} |
57 |
} else if ($element.hasClass('placeholder')) { |
58 |
clearPlaceholder.call(element, true, value) || (element.value = value);
|
59 |
} else {
|
60 |
element.value = value; |
61 |
} |
62 |
// `set` can not return `undefined`; see http://jsapi.info/jquery/1.7.1/val#L2363
|
63 |
return $element; |
64 |
} |
65 |
}; |
66 |
|
67 |
isInputSupported || (valHooks.input = hooks); |
68 |
isTextareaSupported || (valHooks.textarea = hooks); |
69 |
|
70 |
$(function() { |
71 |
// Look for forms
|
72 |
$(document).delegate('form', 'submit.placeholder', function() { |
73 |
// Clear the placeholder values so they don't get submitted
|
74 |
var $inputs = $('.placeholder', this).each(clearPlaceholder); |
75 |
setTimeout(function() {
|
76 |
$inputs.each(setPlaceholder);
|
77 |
}, 10);
|
78 |
}); |
79 |
}); |
80 |
|
81 |
// Clear placeholder values upon page reload
|
82 |
$(window).bind('beforeunload.placeholder', function() { |
83 |
$('.placeholder').each(function() { |
84 |
this.value = ''; |
85 |
}); |
86 |
}); |
87 |
|
88 |
} |
89 |
|
90 |
function args(elem) { |
91 |
// Return an object of element attributes
|
92 |
var newAttrs = {},
|
93 |
rinlinejQuery = /^jQuery\d+$/;
|
94 |
$.each(elem.attributes, function(i, attr) { |
95 |
if (attr.specified && !rinlinejQuery.test(attr.name)) {
|
96 |
newAttrs[attr.name] = attr.value; |
97 |
} |
98 |
}); |
99 |
return newAttrs;
|
100 |
} |
101 |
|
102 |
function clearPlaceholder(event, value) { |
103 |
var input = this, |
104 |
$input = $(input); |
105 |
if (input.value == $input.attr('placeholder') && $input.hasClass('placeholder')) { |
106 |
if ($input.data('placeholder-password')) { |
107 |
$input = $input.hide().next().show().attr('id', $input.removeAttr('id').data('placeholder-id')); |
108 |
// If `clearPlaceholder` was called from `$.valHooks.input.set`
|
109 |
if (event === true) { |
110 |
return $input[0].value = value; |
111 |
} |
112 |
$input.focus();
|
113 |
} else {
|
114 |
input.value = '';
|
115 |
$input.removeClass('placeholder'); |
116 |
input == document.activeElement && input.select(); |
117 |
} |
118 |
} |
119 |
} |
120 |
|
121 |
function setPlaceholder() { |
122 |
var $replacement, |
123 |
input = this,
|
124 |
$input = $(input), |
125 |
$origInput = $input, |
126 |
id = this.id;
|
127 |
if (input.value == '') { |
128 |
if (input.type == 'password') { |
129 |
if (!$input.data('placeholder-textinput')) { |
130 |
try {
|
131 |
$replacement = $input.clone().attr({ 'type': 'text' }); |
132 |
} catch(e) {
|
133 |
$replacement = $('<input>').attr($.extend(args(this), { 'type': 'text' })); |
134 |
} |
135 |
$replacement
|
136 |
.removeAttr('name')
|
137 |
.data({ |
138 |
'placeholder-password': true, |
139 |
'placeholder-id': id
|
140 |
}) |
141 |
.bind('focus.placeholder', clearPlaceholder);
|
142 |
$input
|
143 |
.data({ |
144 |
'placeholder-textinput': $replacement, |
145 |
'placeholder-id': id
|
146 |
}) |
147 |
.before($replacement);
|
148 |
} |
149 |
$input = $input.removeAttr('id').hide().prev().attr('id', id).show(); |
150 |
// Note: `$input[0] != input` now!
|
151 |
} |
152 |
$input.addClass('placeholder'); |
153 |
$input[0].value = $input.attr('placeholder'); |
154 |
} else {
|
155 |
$input.removeClass('placeholder'); |
156 |
} |
157 |
} |
158 |
|
159 |
}(this, document, Foundation.zj));
|