<!-- @license Copyright (c) 2015 The Polymer Project Authors. All rights reserved. This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as part of the polymer project is also subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt --> <link rel="import" href="../polymer/polymer.html"> <script> /** * @demo demo/index.html * @polymerBehavior */ Polymer.IronControlState = { properties: { /** * If true, the element currently has focus. */ focused: { type: Boolean, value: false, notify: true, readOnly: true, reflectToAttribute: true }, /** * If true, the user cannot interact with this element. */ disabled: { type: Boolean, value: false, notify: true, observer: '_disabledChanged', reflectToAttribute: true }, _oldTabIndex: { type: Number }, _boundFocusBlurHandler: { type: Function, value: function() { return this._focusBlurHandler.bind(this); } } }, observers: [ '_changedControlState(focused, disabled)' ], ready: function() { this.addEventListener('focus', this._boundFocusBlurHandler, true); this.addEventListener('blur', this._boundFocusBlurHandler, true); }, _focusBlurHandler: function(event) { // NOTE(cdata): if we are in ShadowDOM land, `event.target` will // eventually become `this` due to retargeting; if we are not in // ShadowDOM land, `event.target` will eventually become `this` due // to the second conditional which fires a synthetic event (that is also // handled). In either case, we can disregard `event.path`. if (event.target === this) { var focused = event.type === 'focus'; this._setFocused(focused); } else if (!this.shadowRoot) { this.fire(event.type, {sourceEvent: event}, { node: this, bubbles: event.bubbles, cancelable: event.cancelable }); } }, _disabledChanged: function(disabled, old) { this.setAttribute('aria-disabled', disabled ? 'true' : 'false'); this.style.pointerEvents = disabled ? 'none' : ''; if (disabled) { this._oldTabIndex = this.tabIndex; this.focused = false; this.tabIndex = -1; } else if (this._oldTabIndex !== undefined) { this.tabIndex = this._oldTabIndex; } }, _changedControlState: function() { // _controlStateChanged is abstract, follow-on behaviors may implement it if (this._controlStateChanged) { this._controlStateChanged(); } } }; </script>