11320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
21320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci    Polymer('paper-focusable', {
31320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
41320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      publish: {
51320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
61320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        /**
71320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * If true, the button is currently active either because the
81320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * user is holding down the button, or the button is a toggle
91320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * and is currently in the active state.
101320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         *
111320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @attribute active
121320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @type boolean
131320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @default false
141320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         */
151320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        active: {value: false, reflect: true},
161320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
171320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        /**
181320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * If true, the element currently has focus due to keyboard
191320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * navigation.
201320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         *
211320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @attribute focused
221320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @type boolean
231320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @default false
241320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         */
251320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        focused: {value: false, reflect: true},
261320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
271320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        /**
281320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * If true, the user is currently holding down the button.
291320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         *
301320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @attribute pressed
311320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @type boolean
321320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @default false
331320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         */
341320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        pressed: {value: false, reflect: true},
351320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
361320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        /**
371320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * If true, the user cannot interact with this element.
381320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         *
391320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @attribute disabled
401320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @type boolean
411320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @default false
421320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         */
431320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        disabled: {value: false, reflect: true},
441320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
451320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        /**
461320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * If true, the button toggles the active state with each tap.
471320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * Otherwise, the button becomes active when the user is holding
481320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * it down.
491320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         *
501320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @attribute isToggle
511320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @type boolean
521320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         * @default false
531320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci         */
541320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        isToggle: {value: false, reflect: false}
551320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
561320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      },
571320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
581320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      disabledChanged: function() {
591320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        if (this.disabled) {
601320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci          this.removeAttribute('tabindex');
611320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        } else {
621320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci          this.setAttribute('tabindex', 0);
631320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        }
641320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      },
651320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
661320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      downAction: function() {
671320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        this.pressed = true;
681320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        this.focused = false;
691320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
701320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        if (this.isToggle) {
711320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci          this.active = !this.active;
721320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        } else {
731320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci          this.active = true;
741320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        }
751320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      },
761320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
771320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      // Pulling up the context menu for an item should focus it; but we need to
781320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      // be careful about how we deal with down/up events surrounding context
791320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      // menus. The up event typically does not fire until the context menu
801320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      // closes: so we focus immediately.
811320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      //
821320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      // This fires _after_ downAction.
831320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      contextMenuAction: function(e) {
841320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        // Note that upAction may fire _again_ on the actual up event.
851320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        this.upAction(e);
861320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        this.focusAction();
871320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      },
881320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
891320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      upAction: function() {
901320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        this.pressed = false;
911320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
921320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        if (!this.isToggle) {
931320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci          this.active = false;
941320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        }
951320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      },
961320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
971320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      focusAction: function() {
981320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        if (!this.pressed) {
991320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci          // Only render the "focused" state if the element gains focus due to
1001320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci          // keyboard navigation.
1011320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci          this.focused = true;
1021320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        }
1031320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      },
1041320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
1051320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      blurAction: function() {
1061320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci        this.focused = false;
1071320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci      }
1081320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
1091320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci    });
1101320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci
1111320f92c476a1ad9d19dba2a48c72b75566198e9Primiano Tucci