Home | History | Annotate | Download | only in paper-focusable 
      1 
      2     Polymer('paper-focusable', {
      3 
      4       publish: {
      5 
      6         /**
      7          * If true, the button is currently active either because the
      8          * user is holding down the button, or the button is a toggle
      9          * and is currently in the active state.
     10          *
     11          * @attribute active
     12          * @type boolean
     13          * @default false
     14          */
     15         active: {value: false, reflect: true},
     16 
     17         /**
     18          * If true, the element currently has focus due to keyboard
     19          * navigation.
     20          *
     21          * @attribute focused
     22          * @type boolean
     23          * @default false
     24          */
     25         focused: {value: false, reflect: true},
     26 
     27         /**
     28          * If true, the user is currently holding down the button.
     29          *
     30          * @attribute pressed
     31          * @type boolean
     32          * @default false
     33          */
     34         pressed: {value: false, reflect: true},
     35 
     36         /**
     37          * If true, the user cannot interact with this element.
     38          *
     39          * @attribute disabled
     40          * @type boolean
     41          * @default false
     42          */
     43         disabled: {value: false, reflect: true},
     44 
     45         /**
     46          * If true, the button toggles the active state with each tap.
     47          * Otherwise, the button becomes active when the user is holding
     48          * it down.
     49          *
     50          * @attribute isToggle
     51          * @type boolean
     52          * @default false
     53          */
     54         isToggle: {value: false, reflect: false}
     55 
     56       },
     57 
     58       disabledChanged: function() {
     59         if (this.disabled) {
     60           this.removeAttribute('tabindex');
     61         } else {
     62           this.setAttribute('tabindex', 0);
     63         }
     64       },
     65 
     66       downAction: function() {
     67         this.pressed = true;
     68         this.focused = false;
     69 
     70         if (this.isToggle) {
     71           this.active = !this.active;
     72         } else {
     73           this.active = true;
     74         }
     75       },
     76 
     77       // Pulling up the context menu for an item should focus it; but we need to
     78       // be careful about how we deal with down/up events surrounding context
     79       // menus. The up event typically does not fire until the context menu
     80       // closes: so we focus immediately.
     81       //
     82       // This fires _after_ downAction.
     83       contextMenuAction: function(e) {
     84         // Note that upAction may fire _again_ on the actual up event.
     85         this.upAction(e);
     86         this.focusAction();
     87       },
     88 
     89       upAction: function() {
     90         this.pressed = false;
     91 
     92         if (!this.isToggle) {
     93           this.active = false;
     94         }
     95       },
     96 
     97       focusAction: function() {
     98         if (!this.pressed) {
     99           // Only render the "focused" state if the element gains focus due to
    100           // keyboard navigation.
    101           this.focused = true;
    102         }
    103       },
    104 
    105       blurAction: function() {
    106         this.focused = false;
    107       }
    108 
    109     });
    110 
    111