root / snf-cyclades-app / synnefo / ui / new_ui / ui / javascripts / foundation / foundation.placeholder.js @ b3c1328b
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));
|