Index: third_party/polymer/v0_8/components-chromium/paper-input/paper-input-container-extracted.js |
diff --git a/third_party/polymer/v0_8/components-chromium/paper-input/paper-input-container-extracted.js b/third_party/polymer/v0_8/components-chromium/paper-input/paper-input-container-extracted.js |
index 3d4abb4296a5b1d634836122c6582cdbd91de649..3b30b2cc5e100df0df99cdffda81ff67c431c592 100644 |
--- a/third_party/polymer/v0_8/components-chromium/paper-input/paper-input-container-extracted.js |
+++ b/third_party/polymer/v0_8/components-chromium/paper-input/paper-input-container-extracted.js |
@@ -5,12 +5,11 @@ |
is: 'paper-input-container', |
- enableCustomStyleProperties: true, |
- |
properties: { |
/** |
- * Set to true to disable the floating label. |
+ * Set to true to disable the floating label. The label disappears when the input value is |
+ * not null. |
*/ |
noLabelFloat: { |
type: Boolean, |
@@ -18,6 +17,14 @@ |
}, |
/** |
+ * Set to true to always float the floating label. |
+ */ |
+ alwaysFloatLabel: { |
+ type: Boolean, |
+ value: false |
+ }, |
+ |
+ /** |
* The attribute to listen for value changes on. |
*/ |
attrForValue: { |
@@ -26,7 +33,7 @@ |
}, |
/** |
- * Set to true to auto-validate the input value. |
+ * Set to true to auto-validate the input value when it changes. |
*/ |
autoValidate: { |
type: Boolean, |
@@ -34,6 +41,16 @@ |
}, |
/** |
+ * True if the input is invalid. This property is set automatically when the input value |
+ * changes if auto-validating, or when the `iron-input-valid` event is heard from a child. |
+ */ |
+ invalid: { |
+ observer: '_invalidChanged', |
+ type: Boolean, |
+ value: false |
+ }, |
+ |
+ /** |
* True if the input has focus. |
*/ |
focused: { |
@@ -54,11 +71,6 @@ |
value: false |
}, |
- _inputIsInvalid: { |
- type: Boolean, |
- value: false |
- }, |
- |
_inputSelector: { |
type: String, |
value: 'input,textarea,.paper-input-input' |
@@ -78,6 +90,13 @@ |
} |
}, |
+ _boundOnInput: { |
+ type: Function, |
+ value: function() { |
+ this._onInput.bind(this) |
+ } |
+ }, |
+ |
_boundValueChanged: { |
type: Function, |
value: function() { |
@@ -89,7 +108,7 @@ |
listeners: { |
'addon-attached': '_onAddonAttached', |
- 'input': '_onInput' |
+ 'iron-input-validate': '_onIronInputValidate' |
}, |
get _valueChangedEvent() { |
@@ -107,16 +126,20 @@ |
ready: function() { |
this.addEventListener('focus', this._boundOnFocus, true); |
this.addEventListener('blur', this._boundOnBlur, true); |
- this.addEventListener(this._valueChangedEvent, this._boundValueChanged, true); |
+ if (this.attrForValue) { |
+ this._inputElement.addEventListener(this._valueChangedEvent, this._boundValueChanged); |
+ } else { |
+ this.addEventListener('input', this._onInput); |
+ } |
}, |
attached: function() { |
- this._handleInput(this._inputElement); |
+ this._handleValue(this._inputElement); |
}, |
_onAddonAttached: function(event) { |
this._addons.push(event.target); |
- this._handleInput(this._inputElement); |
+ this._handleValue(this._inputElement); |
}, |
_onFocus: function() { |
@@ -128,43 +151,66 @@ |
}, |
_onInput: function(event) { |
- this._handleInput(event.target); |
+ this._handleValue(event.target); |
}, |
_onValueChanged: function(event) { |
- this._handleInput(event.target); |
+ this._handleValue(event.target); |
}, |
- _handleInput: function(inputElement) { |
+ _handleValue: function(inputElement) { |
var value = inputElement[this._propertyForValue] || inputElement.value; |
- var valid = inputElement.checkValidity(); |
+ |
+ if (this.autoValidate) { |
+ var valid; |
+ if (inputElement.validate) { |
+ valid = inputElement.validate(value); |
+ } else { |
+ valid = inputElement.checkValidity(); |
+ } |
+ this.invalid = !valid; |
+ } |
// type="number" hack needed because this.value is empty until it's valid |
- if (value || inputElement.type === 'number' && !valid) { |
+ if (value || (inputElement.type === 'number' && !inputElement.checkValidity())) { |
this._inputHasContent = true; |
} else { |
this._inputHasContent = false; |
} |
- if (this.autoValidate) { |
- this._inputIsInvalid = !valid; |
+ this.updateAddons({ |
+ inputElement: inputElement, |
+ value: value, |
+ invalid: this.invalid |
+ }); |
+ }, |
+ |
+ _onIronInputValidate: function(event) { |
+ this.invalid = this._inputElement.invalid; |
+ }, |
+ |
+ _invalidChanged: function() { |
+ if (this._addons) { |
+ this.updateAddons({invalid: this.invalid}); |
} |
+ }, |
- // notify add-ons |
- for (var addon, i = 0; addon = this._addons[i]; i++) { |
- // need to set all of these, or call method... thanks input type="number"! |
- addon.inputElement = inputElement; |
- addon.value = value; |
- addon.invalid = !valid; |
+ /** |
+ * Call this to update the state of add-ons. |
+ * @param {Object} state Add-on state. |
+ */ |
+ updateAddons: function(state) { |
+ for (var addon, index = 0; addon = this._addons[index]; index++) { |
+ addon.update(state); |
} |
}, |
- _computeInputContentClass: function(noLabelFloat, focused, _inputHasContent, _inputIsInvalid) { |
+ _computeInputContentClass: function(noLabelFloat, alwaysFloatLabel, focused, invalid, _inputHasContent) { |
var cls = 'input-content'; |
if (!noLabelFloat) { |
- if (_inputHasContent) { |
+ if (alwaysFloatLabel || _inputHasContent) { |
cls += ' label-is-floating'; |
- if (_inputIsInvalid) { |
+ if (invalid) { |
cls += ' is-invalid'; |
} else if (focused) { |
cls += " label-is-highlighted"; |
@@ -178,9 +224,9 @@ |
return cls; |
}, |
- _computeUnderlineClass: function(focused, _inputIsInvalid) { |
+ _computeUnderlineClass: function(focused, invalid) { |
var cls = 'underline'; |
- if (_inputIsInvalid) { |
+ if (invalid) { |
cls += ' is-invalid'; |
} else if (focused) { |
cls += ' is-highlighted' |
@@ -188,9 +234,9 @@ |
return cls; |
}, |
- _computeAddOnContentClass: function(focused, _inputIsInvalid) { |
+ _computeAddOnContentClass: function(focused, invalid) { |
var cls = 'add-on-content'; |
- if (_inputIsInvalid) { |
+ if (invalid) { |
cls += ' is-invalid'; |
} else if (focused) { |
cls += ' is-highlighted' |