Home | History | Annotate | Download | only in paper-button 
      1 
      2     Polymer('paper-button', {
      3 
      4       publish: {
      5 
      6         /**
      7          * The label of the button.
      8          *
      9          * @attribute label
     10          * @type string
     11          * @default ''
     12          */
     13         label: '',
     14 
     15         /**
     16          * If true, the button will be styled as a "raised" button.
     17          *
     18          * @attribute raisedButton
     19          * @type boolean
     20          * @default false
     21          */
     22         raisedButton: {value: false, reflect: true},
     23 
     24         /**
     25          * (optional) The URL of an image for an icon to use in the button.
     26          * Should not use `icon` property if you are using this property.
     27          *
     28          * @attribute iconSrc
     29          * @type string
     30          * @default ''
     31          */
     32          iconSrc: '',
     33 
     34          /**
     35           * (optional) Specifies the icon name or index in the set of icons
     36           * available in the icon set. If using this property, load the icon
     37           * set separately where the icon is used. Should not use `src`
     38           * if you are using this property.
     39           *
     40           * @attribute icon
     41           * @type string
     42           * @default ''
     43           */
     44          icon: ''
     45 
     46       },
     47 
     48       z: 1,
     49 
     50       attached: function() {
     51         if (this.textContent && !this.textContent.match(/\s+/)) {
     52           console.warn('Using textContent to label the button is deprecated. Use the "label" property instead');
     53           this.label = this.textContent;
     54         }
     55       },
     56 
     57       activeChanged: function() {
     58         this.super();
     59 
     60         if (this.active) {
     61           // FIXME: remove when paper-ripple can have a default 'down' state.
     62           if (!this.lastEvent) {
     63             var rect = this.getBoundingClientRect();
     64             this.lastEvent = {
     65               x: rect.left + rect.width / 2,
     66               y: rect.top + rect.height / 2
     67             }
     68           }
     69           this.$.ripple.downAction(this.lastEvent);
     70         } else {
     71           this.$.ripple.upAction();
     72         }
     73         this.adjustZ();
     74       },
     75 
     76       focusedChanged: function() {
     77         this.super();
     78         this.adjustZ();
     79       },
     80 
     81       disabledChanged: function() {
     82         this.super();
     83         this.adjustZ();
     84       },
     85 
     86       // waitForSpillCompleted: function(callback) {
     87       //   this.async(callback, null, (this.$.ink.spillCompleted ? 0 : this.duration));
     88       // },
     89 
     90       // resetInk: function() {
     91       //   this.active = false;
     92       //   this.$.ink.reset();
     93       // },
     94 
     95       insideButton: function(x, y) {
     96         var rect = this.getBoundingClientRect();
     97         return (rect.left <= x) && (x <= rect.right) && (rect.top <= y) && (y <= rect.bottom);
     98       },
     99 
    100       adjustZ: function() {
    101         if (this.focused) {
    102           this.classList.add('paper-shadow-animate-z-1-z-2');
    103         } else {
    104           this.classList.remove('paper-shadow-animate-z-1-z-2');
    105 
    106           if (this.active) {
    107             this.z = 2;
    108           } else if (this.disabled) {
    109             this.z = 0;
    110           } else {
    111             this.z = 1;
    112           }
    113 
    114         }
    115       },
    116 
    117       downAction: function(e) {
    118         this.super(e);
    119         this.lastEvent = e;
    120       },
    121 
    122       labelChanged: function() {
    123         this.setAttribute('aria-label', this.label);
    124       }
    125 
    126     });
    127