• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
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