Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(36)

Side by Side Diff: third_party/polymer/v1_0/components/paper-input/paper-input-behavior.html

Issue 1269803005: Remove third_party/polymer from .gitignore (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 5 years, 4 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 <!--
2 @license
3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt
7 Code distributed by Google as part of the polymer project is also
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt
9 -->
10 <link rel="import" href="../polymer/polymer.html">
11 <link rel="import" href="../iron-behaviors/iron-control-state.html">
12
13 <script>
14
15 /**
16 * Use `Polymer.PaperInputBehavior` to implement inputs with `<paper-input-con tainer>`. This
17 * behavior is implemented by `<paper-input>`. It exposes a number of properti es from
18 * `<paper-input-container>` and `<input is="iron-input">` and they should be bound in your
19 * template.
20 *
21 * The input element can be accessed by the `inputElement` property if you nee d to access
22 * properties or methods that are not exposed.
23 * @polymerBehavior Polymer.PaperInputBehavior
24 */
25 Polymer.PaperInputBehaviorImpl = {
26
27 properties: {
28
29 /**
30 * The label for this input. Bind this to `<paper-input-container>`'s `lab el` property.
31 */
32 label: {
33 type: String
34 },
35
36 /**
37 * The value for this input. Bind this to the `<input is="iron-input">`'s `bindValue`
38 * property, or the value property of your input that is `notify:true`.
39 */
40 value: {
41 notify: true,
42 type: String
43 },
44
45 /**
46 * Set to true to disable this input. Bind this to both the `<paper-input- container>`'s
47 * and the input's `disabled` property.
48 */
49 disabled: {
50 type: Boolean,
51 value: false
52 },
53
54 /**
55 * Returns true if the value is invalid. Bind this to both the `<paper-inp ut-container>`'s
56 * and the input's `invalid` property.
57 */
58 invalid: {
59 type: Boolean,
60 value: false
61 },
62
63 /**
64 * Set to true to prevent the user from entering invalid input. Bind this to the
65 * `<input is="iron-input">`'s `preventInvalidInput` property.
66 */
67 preventInvalidInput: {
68 type: Boolean
69 },
70
71 /**
72 * Set this to specify the pattern allowed by `preventInvalidInput`. Bind this to the
73 * `<input is="iron-input">`'s `allowedPattern` property.
74 */
75 allowedPattern: {
76 type: String
77 },
78
79 /**
80 * The type of the input. The supported types are `text`, `number` and `pa ssword`. Bind this
81 * to the `<input is="iron-input">`'s `type` property.
82 */
83 type: {
84 type: String
85 },
86
87 /**
88 * The datalist of the input (if any). This should match the id of an exis ting <datalist>. Bind this
89 * to the `<input is="iron-input">`'s `list` property.
90 */
91 list: {
92 type: String
93 },
94
95 /**
96 * A pattern to validate the `input` with. Bind this to the `<input is="ir on-input">`'s
97 * `pattern` property.
98 */
99 pattern: {
100 type: String
101 },
102
103 /**
104 * Set to true to mark the input as required. Bind this to the `<input is= "iron-input">`'s
105 * `required` property.
106 */
107 required: {
108 type: Boolean,
109 value: false
110 },
111
112 /**
113 * The maximum length of the input value. Bind this to the `<input is="iro n-input">`'s
114 * `maxlength` property.
115 */
116 maxlength: {
117 type: Number
118 },
119
120 /**
121 * The error message to display when the input is invalid. Bind this to th e
122 * `<paper-input-error>`'s content, if using.
123 */
124 errorMessage: {
125 type: String
126 },
127
128 /**
129 * Set to true to show a character counter.
130 */
131 charCounter: {
132 type: Boolean,
133 value: false
134 },
135
136 /**
137 * Set to true to disable the floating label. Bind this to the `<paper-inp ut-container>`'s
138 * `noLabelFloat` property.
139 */
140 noLabelFloat: {
141 type: Boolean,
142 value: false
143 },
144
145 /**
146 * Set to true to always float the label. Bind this to the `<paper-input-c ontainer>`'s
147 * `alwaysFloatLabel` property.
148 */
149 alwaysFloatLabel: {
150 type: Boolean,
151 value: false
152 },
153
154 /**
155 * Set to true to auto-validate the input value. Bind this to the `<paper- input-container>`'s
156 * `autoValidate` property.
157 */
158 autoValidate: {
159 type: Boolean,
160 value: false
161 },
162
163 /**
164 * Name of the validator to use. Bind this to the `<input is="iron-input"> `'s `validator`
165 * property.
166 */
167 validator: {
168 type: String
169 },
170
171 // HTMLInputElement attributes for binding if needed
172
173 /**
174 * Bind this to the `<input is="iron-input">`'s `autocomplete` property.
175 */
176 autocomplete: {
177 type: String,
178 value: 'off'
179 },
180
181 /**
182 * Bind this to the `<input is="iron-input">`'s `autofocus` property.
183 */
184 autofocus: {
185 type: Boolean
186 },
187
188 /**
189 * Bind this to the `<input is="iron-input">`'s `inputmode` property.
190 */
191 inputmode: {
192 type: String
193 },
194
195 /**
196 * Bind this to the `<input is="iron-input">`'s `minlength` property.
197 */
198 minlength: {
199 type: Number
200 },
201
202 /**
203 * Bind this to the `<input is="iron-input">`'s `name` property.
204 */
205 name: {
206 type: String
207 },
208
209 /**
210 * A placeholder string in addition to the label. If this is set, the labe l will always float.
211 */
212 placeholder: {
213 type: String,
214 // need to set a default so _computeAlwaysFloatLabel is run
215 value: ''
216 },
217
218 /**
219 * Bind this to the `<input is="iron-input">`'s `readonly` property.
220 */
221 readonly: {
222 type: Boolean,
223 value: false
224 },
225
226 /**
227 * Bind this to the `<input is="iron-input">`'s `size` property.
228 */
229 size: {
230 type: Number
231 },
232
233 // Nonstandard attributes for binding if needed
234
235 /**
236 * Bind this to the `<input is="iron-input">`'s `autocapitalize` property.
237 */
238 autocapitalize: {
239 type: String,
240 value: 'none'
241 },
242
243 /**
244 * Bind this to the `<input is="iron-input">`'s `autocorrect` property.
245 */
246 autocorrect: {
247 type: String,
248 value: 'off'
249 },
250
251 _ariaDescribedBy: {
252 type: String,
253 value: ''
254 }
255
256 },
257
258 listeners: {
259 'addon-attached': '_onAddonAttached'
260 },
261
262 observers: [
263 '_focusedControlStateChanged(focused)'
264 ],
265
266 /**
267 * Returns a reference to the input element.
268 */
269 get inputElement() {
270 return this.$.input;
271 },
272
273 attached: function() {
274 this._updateAriaLabelledBy();
275 },
276
277 _appendStringWithSpace: function(str, more) {
278 if (str) {
279 str = str + ' ' + more;
280 } else {
281 str = more;
282 }
283 return str;
284 },
285
286 _onAddonAttached: function(event) {
287 var target = event.path ? event.path[0] : event.target;
288 if (target.id) {
289 this._ariaDescribedBy = this._appendStringWithSpace(this._ariaDescribedB y, target.id);
290 } else {
291 var id = 'paper-input-add-on-' + Math.floor((Math.random() * 100000));
292 target.id = id;
293 this._ariaDescribedBy = this._appendStringWithSpace(this._ariaDescribedB y, id);
294 }
295 },
296
297 /**
298 * Validates the input element and sets an error style if needed.
299 */
300 validate: function() {
301 return this.inputElement.validate();
302 },
303
304 /**
305 * Restores the cursor to its original position after updating the value.
306 * @param {string} newValue The value that should be saved.
307 */
308 updateValueAndPreserveCaret: function(newValue) {
309 // Not all elements might have selection, and even if they have the
310 // right properties, accessing them might throw an exception (like for
311 // <input type=number>)
312 try {
313 var start = this.inputElement.selectionStart;
314 this.value = newValue;
315
316 // The cursor automatically jumps to the end after re-setting the value,
317 // so restore it to its original position.
318 this.inputElement.selectionStart = start;
319 this.inputElement.selectionEnd = start;
320 } catch (e) {
321 // Just set the value and give up on the caret.
322 this.value = newValue;
323 }
324 },
325
326 _computeAlwaysFloatLabel: function(alwaysFloatLabel, placeholder) {
327 return placeholder || alwaysFloatLabel;
328 },
329
330 _focusedControlStateChanged: function(focused) {
331 // IronControlState stops the focus and blur events in order to redispatch them on the host
332 // element, but paper-input-container listens to those events. Since there are more
333 // pending work on focus/blur in IronControlState, I'm putting in this hac k to get the
334 // input focus state working for now.
335 if (!this.$.container) {
336 this.$.container = Polymer.dom(this.root).querySelector('paper-input-con tainer');
337 if (!this.$.container) {
338 return;
339 }
340 }
341 if (focused) {
342 this.$.container._onFocus();
343 } else {
344 this.$.container._onBlur();
345 }
346 },
347
348 _updateAriaLabelledBy: function() {
349 var label = Polymer.dom(this.root).querySelector('label');
350 if (!label) {
351 this._ariaLabelledBy = '';
352 return;
353 }
354 var labelledBy;
355 if (label.id) {
356 labelledBy = label.id;
357 } else {
358 labelledBy = 'paper-input-label-' + new Date().getUTCMilliseconds();
359 label.id = labelledBy;
360 }
361 this._ariaLabelledBy = labelledBy;
362 }
363
364 };
365
366 /** @polymerBehavior */
367 Polymer.PaperInputBehavior = [Polymer.IronControlState, Polymer.PaperInputBeha viorImpl];
368
369 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698