OLD | NEW |
(Empty) | |
| 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.dura
tion)); |
| 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 |
OLD | NEW |