OLD | NEW |
1 <!-- | 1 <!-- |
2 @license | 2 @license |
3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. | 3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. |
4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt | 4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt |
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt |
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt |
7 Code distributed by Google as part of the polymer project is also | 7 Code distributed by Google as part of the polymer project is also |
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt | 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt |
9 --> | 9 --> |
10 | 10 |
11 <link rel="import" href="../polymer/polymer.html"> | 11 <link rel="import" href="../polymer/polymer.html"> |
12 <link rel="import" href="../iron-behaviors/iron-button-state.html"> | 12 <link rel="import" href="../iron-behaviors/iron-button-state.html"> |
| 13 <link rel="import" href="paper-ripple-behavior.html"> |
13 | 14 |
14 <script> | 15 <script> |
15 | 16 |
16 /** @polymerBehavior Polymer.PaperButtonBehavior */ | 17 /** @polymerBehavior Polymer.PaperButtonBehavior */ |
17 Polymer.PaperButtonBehaviorImpl = { | 18 Polymer.PaperButtonBehaviorImpl = { |
18 | 19 |
19 properties: { | 20 properties: { |
20 | 21 |
21 _elevation: { | 22 /** |
22 type: Number | 23 * The z-depth of this element, from 0-5. Setting to 0 will remove the |
| 24 * shadow, and each increasing number greater than 0 will be "deeper" |
| 25 * than the last. |
| 26 * |
| 27 * @attribute elevation |
| 28 * @type number |
| 29 * @default 1 |
| 30 */ |
| 31 elevation: { |
| 32 type: Number, |
| 33 reflectToAttribute: true, |
| 34 readOnly: true |
23 } | 35 } |
24 | 36 |
25 }, | 37 }, |
26 | 38 |
27 observers: [ | 39 observers: [ |
28 '_calculateElevation(focused, disabled, active, pressed, receivedFocusFrom
Keyboard)' | 40 '_calculateElevation(focused, disabled, active, pressed, receivedFocusFrom
Keyboard)', |
| 41 '_computeKeyboardClass(receivedFocusFromKeyboard)' |
29 ], | 42 ], |
30 | 43 |
31 hostAttributes: { | 44 hostAttributes: { |
32 role: 'button', | 45 role: 'button', |
33 tabindex: '0' | 46 tabindex: '0', |
| 47 animated: true |
34 }, | 48 }, |
35 | 49 |
36 _calculateElevation: function() { | 50 _calculateElevation: function() { |
37 var e = 1; | 51 var e = 1; |
38 if (this.disabled) { | 52 if (this.disabled) { |
39 e = 0; | 53 e = 0; |
40 } else if (this.active || this.pressed) { | 54 } else if (this.active || this.pressed) { |
41 e = 4; | 55 e = 4; |
42 } else if (this.receivedFocusFromKeyboard) { | 56 } else if (this.receivedFocusFromKeyboard) { |
43 e = 3; | 57 e = 3; |
44 } | 58 } |
45 this._elevation = e; | 59 this._setElevation(e); |
| 60 }, |
| 61 |
| 62 _computeKeyboardClass: function(receivedFocusFromKeyboard) { |
| 63 this.classList.toggle('keyboard-focus', receivedFocusFromKeyboard); |
| 64 }, |
| 65 |
| 66 /** |
| 67 * In addition to `IronButtonState` behavior, when space key goes down, |
| 68 * create a ripple down effect. |
| 69 * |
| 70 * @param {!KeyboardEvent} event . |
| 71 */ |
| 72 _spaceKeyDownHandler: function(event) { |
| 73 Polymer.IronButtonStateImpl._spaceKeyDownHandler.call(this, event); |
| 74 if (this.hasRipple()) { |
| 75 this._ripple.uiDownAction(); |
| 76 } |
| 77 }, |
| 78 |
| 79 /** |
| 80 * In addition to `IronButtonState` behavior, when space key goes up, |
| 81 * create a ripple up effect. |
| 82 * |
| 83 * @param {!KeyboardEvent} event . |
| 84 */ |
| 85 _spaceKeyUpHandler: function(event) { |
| 86 Polymer.IronButtonStateImpl._spaceKeyUpHandler.call(this, event); |
| 87 if (this.hasRipple()) { |
| 88 this._ripple.uiUpAction(); |
| 89 } |
46 } | 90 } |
| 91 |
47 }; | 92 }; |
48 | 93 |
49 /** @polymerBehavior Polymer.PaperButtonBehavior */ | 94 /** @polymerBehavior */ |
50 Polymer.PaperButtonBehavior = [ | 95 Polymer.PaperButtonBehavior = [ |
51 Polymer.IronButtonState, | 96 Polymer.IronButtonState, |
52 Polymer.IronControlState, | 97 Polymer.IronControlState, |
| 98 Polymer.PaperRippleBehavior, |
53 Polymer.PaperButtonBehaviorImpl | 99 Polymer.PaperButtonBehaviorImpl |
54 ]; | 100 ]; |
55 | 101 |
56 </script> | 102 </script> |
OLD | NEW |