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

Side by Side Diff: polymer_1.0.4/bower_components/paper-input/paper-input-behavior.html

Issue 1205703007: Add polymer 1.0 to npm_modules (Closed) Base URL: https://chromium.googlesource.com/infra/third_party/npm_modules.git@master
Patch Set: Renamed folder to 1.0.4 Created 5 years, 5 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 _ariaDescribedBy: {
234 type: String,
235 value: ''
236 }
237
238 },
239
240 listeners: {
241 'addon-attached': '_onAddonAttached'
242 },
243
244 /**
245 * Returns a reference to the input element.
246 */
247 get inputElement() {
248 return this.$.input;
249 },
250
251 attached: function() {
252 this._updateAriaLabelledBy();
253 },
254
255 _appendStringWithSpace: function(str, more) {
256 if (str) {
257 str = str + ' ' + more;
258 } else {
259 str = more;
260 }
261 return str;
262 },
263
264 _onAddonAttached: function(event) {
265 var target = event.path ? event.path[0] : event.target;
266 if (target.id) {
267 this._ariaDescribedBy = this._appendStringWithSpace(this._ariaDescribedB y, target.id);
268 } else {
269 var id = 'paper-input-add-on-' + Math.floor((Math.random() * 100000));
270 target.id = id;
271 this._ariaDescribedBy = this._appendStringWithSpace(this._ariaDescribedB y, id);
272 }
273 },
274
275 /**
276 * Validates the input element and sets an error style if needed.
277 */
278 validate: function() {
279 return this.inputElement.validate();
280 },
281
282 /**
283 * Restores the cursor to its original position after updating the value.
284 * @param {string} newValue The value that should be saved.
285 */
286 updateValueAndPreserveCaret: function(newValue) {
287 // Not all elements might have selection, and even if they have the
288 // right properties, accessing them might throw an exception (like for
289 // <input type=number>)
290 try {
291 var start = this.inputElement.selectionStart;
292 this.value = newValue;
293
294 // The cursor automatically jumps to the end after re-setting the value,
295 // so restore it to its original position.
296 this.inputElement.selectionStart = start;
297 this.inputElement.selectionEnd = start;
298 } catch (e) {
299 // Just set the value and give up on the caret.
300 this.value = newValue;
301 }
302 },
303
304 _computeAlwaysFloatLabel: function(alwaysFloatLabel, placeholder) {
305 return placeholder || alwaysFloatLabel;
306 },
307
308 _updateAriaLabelledBy: function() {
309 var label = Polymer.dom(this.root).querySelector('label');
310 if (!label) {
311 this._ariaLabelledBy = '';
312 return;
313 }
314 var labelledBy;
315 if (label.id) {
316 labelledBy = label.id;
317 } else {
318 labelledBy = 'paper-input-label-' + new Date().getUTCMilliseconds();
319 label.id = labelledBy;
320 }
321 this._ariaLabelledBy = labelledBy;
322 }
323
324 };
325
326 Polymer.PaperInputBehavior = [Polymer.IronControlState, Polymer.PaperInputBeha viorImpl];
327
328 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698