1/* global define, require */ 2/** 3 * placeholder - HTML5 input placeholder polyfill 4 * Copyright (c) 2012 DIY Co 5 * 6 * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this 7 * file except in compliance with the License. You may obtain a copy of the License at: 8 * http://www.apache.org/licenses/LICENSE-2.0 9 * 10 * Unless required by applicable law or agreed to in writing, software distributed under 11 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF 12 * ANY KIND, either express or implied. See the License for the specific language 13 * governing permissions and limitations under the License. 14 * 15 * @author Brian Reavis <[email protected]> 16 * 17 * HYBRID SOLUTIONS INCORPORATED FIXES 18 * 19 * Fixed an issue with incorrect left alignment of the placeholder 20 * https://github.com/diy/jquery-placeholder/pull/28 21 * 22 * Fixed toggle function ignoring whitespace 23 * https://github.com/diy/jquery-placeholder/pull/29 24 * 25 * Add UMD support 26 * https://github.com/johnhunter/jquery-placeholder/commit/dd61c83064eb14bc1ccd3cc60b541b4c64c4770b 27 * 28 * Hybrid Solutions Fix - 05/06/2015 29 * Now allows the usage of transformX for animation effects 30 * 31 */ 32 33(function (factory) { 34 if (typeof define === 'function' && define.amd) { 35 define(['jquery'], factory); 36 } else if (typeof exports === 'object') { 37 factory(require('jquery')); 38 } else { 39 factory(jQuery); 40 } 41}(function ($) { 42 43 var NATIVE_SUPPORT = ('placeholder' in document.createElement('input')); 44 var CSS_PROPERTIES = [ 45 '-moz-box-sizing', '-webkit-box-sizing', 'box-sizing', 46 'padding-top', 'padding-right', 'padding-bottom', 'padding-left', 47 'margin-top', 'margin-right', 'margin-bottom', 'margin-left', 48 'border-top-width', 'border-right-width', 'border-bottom-width', 'border-left-width', 49 'line-height', 'font-size', 'font-family'/*, 'width'*/, 'height', 50 'top', 'left', 'right', 'bottom' 51 ]; 52 53 54 var defaults = { 55 force: false, // force all browsers to use polyfill 56 hideOnInput: true, // hide placeholder on text input instead of on focus (consistent with recent browsers) 57 placeholderClass: 'placeholder' 58 }; 59 60 // used with hideOnInput 61 var ignoreKeys = [ 62 27, // Escape 63 33, // Page up 64 34, // Page down 65 35, // End 66 36, // Home 67 37, // Left 68 38, // Up 69 39, // Right 70 40 // Down 71 ]; 72 var deleteKeys = [ 73 8, // Backspace 74 46 // Delete 75 ]; 76 77 var setupPlaceholder = function(input, options) { 78 //var i, evt, text, styles, zIndex, marginTop, dy, attrNode;
79 var i, text, styles, zIndex, marginTop, dy, marginLeft, dx, attrNode; 80 var $input = $(input), $placeholder; 81 82 try { 83 attrNode = $input[0].getAttributeNode('placeholder'); 84 if (!attrNode) { return; } 85 86 // Fixes a bug in IE 7, where the plugin was not detecting the placeholder attribute of an input. 87 //text = $input[0].getAttribute('placeholder'); 88 text = $input.attr('placeholder'); 89 90 if (!text || !text.length) { return; } 91 $input[0].setAttribute('placeholder', ''); 92 $input.data('placeholder', text); 93 } catch (e) { 94 return; 95 } 96 97 // enumerate textbox styles for mimicking 98 styles = {}; 99 for (i = 0; i < CSS_PROPERTIES.length; i++) { 100 styles[CSS_PROPERTIES[i]] = $input.css(CSS_PROPERTIES[i]); 101 } 102 zIndex = parseInt($input.css('z-index'), 10); 103 if (isNaN(zIndex) || !zIndex) { zIndex = 1; } 104 105 // create the placeholder 106 $placeholder = $('<span>').addClass(options.placeholderClass).html(text); 107 $placeholder.css(styles); 108 $placeholder.css({ 109 'cursor': $input.css('cursor') || 'text', 110 'display': 'block', 111 'position': 'absolute', 112 'overflow': 'hidden', 113 'z-index': zIndex + 1, 114 'background': 'none', 115 'border-top-style': 'solid', 116 'border-right-style': 'solid', 117 'border-bottom-style': 'solid', 118 'border-left-style': 'solid', 119 'border-top-color': 'transparent', 120 'border-right-color': 'transparent', 121 'border-bottom-color': 'transparent', 122 'border-left-color': 'transparent' 123 }); 124 $placeholder.insertBefore($input); 125 126 // compensate for y difference caused by absolute / relative difference (line-height factor) 127 dy = $input.offset().top - $placeholder.offset().top; 128 marginTop = parseInt($placeholder.css('margin-top'), 10); 129 if (isNaN(marginTop)) { marginTop = 0; } 130 $placeholder.css('margin-top', marginTop + dy); 131 132 // compensate for x difference caused by absolute / relative difference 133 dx = $input.offset().left - $placeholder.offset().left; 134 marginLeft = parseInt($placeholder.css('margin-left')); 135 136 // Hybrid Solutions 137 // Allows transformX to be applied without affecting automatic initial positioning 138 var matrix = $placeholder.css("-webkit-transform") || 139 $placeholder.css("-moz-transform") || 140 $placeholder.css("-ms-transform") || 141 $placeholder.css("-o-transform") || 142 $placeholder.css("transform") || 143 "FAILED"; 144 145 if (matrix!= undefined && matrix!= null && matrix!= "FAILED") { 146 matrix = matrix.substr(7, matrix.length - 8).split(', '); 147 var value = matrix[4]; // TransformX value 148 if (value!= undefined) 149 dx+= value; 150 } 151 152 if (isNaN(marginLeft)) marginLeft = 0; 153 $placeholder.css('margin-left', marginLeft + dx); 154 155 // Event handlers + add to document 156 157 // Hybrid solutions fix - 05.07.2015 158 $input.on('mousedown', function() { 159 if (!$input.is(':enabled')) { return; } 160 window.setTimeout(function(){ 161 $placeholder.addClass('active'); 162 }, 0); 163 }); 164 165 // Hybrid solutions fix - 08.07.2015 166 // Support for IE 9. 167 // Since input is behind placeholder, and IE 9 doesn't support 168 // disabling mouse events using css pointer events, it's necessary 169 // to also have a click event on placeholder itself with a manual 170 // trigger of the focus event for the input control. 171 $placeholder.on('mousedown', function() { 172 if (!$placeholder.hasClass('active')) 173 { 174 $placeholder.addClass('active'); 175 $input.trigger('focus'); 176 } 177 }); 178 179 if (options.hideOnInput) { 180 $input.on('keydown.placeholder', function(e) { 181 if ($.inArray(e.keyCode, deleteKeys) !== -1) { 182 window.setTimeout(function(){ 183 if (!$input.val()) { 184 $placeholder.show(); 185 } 186 }, 0); 187 return; 188 } 189 if ($.inArray(e.keyCode, ignoreKeys) !== -1) { return; } 190 $placeholder.hide(); 191 }); 192 193 // Hybrid solutions fix - 08.07.2015 194 // Enable placeholder styling also when tab key is used 195 $input.focus(function() { 196 if (!$placeholder.hasClass('active')) 197 $placeholder.addClass('active'); 198 }); 199 } 200 else { 201 $input.on('focus.placeholder', function() { 202 $placeholder.hide(); 203 }); 204 } 205 206 $input.on('blur.placeholder', function() { 207 208 // If whitespace is not a valid value, then the developer should use some 209 // validation mechanism to prevent it from being submitted and alert the 210 // user. It shouldn't be the responsibility of a placeholder plugin. 211 212 //$placeholder.toggle(!$.trim($input.val()).length); 213 $placeholder.toggle(!$input.val().length); 214 215 $placeholder.removeClass('active'); 216 }); 217 218 $input[0].onpropertychange = function() { 219 if (event.propertyName === 'value') { 220 $input.trigger('focus.placeholder'); 221 } 222 }; 223 224 $input.trigger('blur.placeholder'); 225 }; 226 227 // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 228 229 $.fn.placeholder = function(options) { 230 var $this = this; 231 options = $.extend({}, defaults, options || {}); 232 233 if (NATIVE_SUPPORT && !options.force) { 234 return this; 235 } 236 237 window.setTimeout(function() { 238 $this.each(function() { 239 var tagName = this.tagName.toLowerCase(); 240 if (tagName === 'input' || tagName === 'textarea') { 241 setupPlaceholder(this, options); 242 } 243 }); 244 }, 0); 245 246 return this; 247 }; 248 249}));
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.