OLD | NEW |
1 <!-- | 1 <!-- |
2 Copyright (c) 2014 The Polymer Project Authors. All rights reserved. | 2 Copyright (c) 2014 The Polymer Project Authors. All rights reserved. |
3 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt | 3 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt |
4 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | 4 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt |
5 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | 5 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt |
6 Code distributed by Google as part of the polymer project is also | 6 Code distributed by Google as part of the polymer project is also |
7 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt | 7 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt |
8 --> | 8 --> |
9 | 9 |
10 <!-- | 10 <!-- |
(...skipping 93 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
104 | 104 |
105 <link rel="import" href="core-transition.html"> | 105 <link rel="import" href="core-transition.html"> |
106 | 106 |
107 <polymer-element name="core-transition-css" extends="core-transition" attributes
="transitionType"> | 107 <polymer-element name="core-transition-css" extends="core-transition" attributes
="transitionType"> |
108 <template> | 108 <template> |
109 <link no-shim rel="stylesheet" href="core-transition-overlay.css"> | 109 <link no-shim rel="stylesheet" href="core-transition-overlay.css"> |
110 </template> | 110 </template> |
111 <script> | 111 <script> |
112 | 112 |
113 Polymer('core-transition-css', { | 113 Polymer('core-transition-css', { |
114 | 114 |
115 /** | 115 /** |
116 * The class that will be applied to all animated nodes. | 116 * The class that will be applied to all animated nodes. |
117 * | 117 * |
118 * @attribute baseClass | 118 * @attribute baseClass |
119 * @type string | 119 * @type string |
120 * @default "core-transition" | 120 * @default "core-transition" |
121 */ | 121 */ |
122 baseClass: 'core-transition', | 122 baseClass: 'core-transition', |
123 | 123 |
124 /** | 124 /** |
(...skipping 67 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
192 | 192 |
193 teardown: function(node) { | 193 teardown: function(node) { |
194 node.classList.remove(this.baseClass); | 194 node.classList.remove(this.baseClass); |
195 if (this.transitionType) { | 195 if (this.transitionType) { |
196 node.classList.remove(this.baseClass + '-' + this.transitionType); | 196 node.classList.remove(this.baseClass + '-' + this.transitionType); |
197 } | 197 } |
198 }, | 198 }, |
199 | 199 |
200 transitionOpened: function(node, opened) { | 200 transitionOpened: function(node, opened) { |
201 this.listenOnce(node, this.completeEventName, function() { | 201 this.listenOnce(node, this.completeEventName, function() { |
202 node.classList.toggle(this.revealedClass, opened); | |
203 if (!opened) { | 202 if (!opened) { |
204 node.classList.remove(this.closedClass); | 203 node.classList.remove(this.closedClass); |
205 } | 204 } |
206 this.complete(node); | 205 this.complete(node); |
207 }); | 206 }); |
208 node.classList.toggle(this.openedClass, opened); | 207 node.classList.toggle(this.openedClass, opened); |
209 node.classList.toggle(this.closedClass, !opened); | 208 node.classList.toggle(this.closedClass, !opened); |
210 } | 209 } |
211 | 210 |
212 }); | 211 }); |
213 </script> | 212 </script> |
214 </polymer-element> | 213 </polymer-element> |
215 | 214 |
216 <core-transition-css id="core-transition-fade"></core-transition-css> | 215 <core-transition-css id="core-transition-fade"></core-transition-css> |
217 <core-transition-css id="core-transition-center" transitionType="center"></core-
transition-css> | 216 <core-transition-css id="core-transition-center" transitionType="center"></core-
transition-css> |
218 <core-transition-css id="core-transition-top" transitionType="top"></core-transi
tion-css> | 217 <core-transition-css id="core-transition-top" transitionType="top"></core-transi
tion-css> |
219 <core-transition-css id="core-transition-bottom" transitionType="bottom"></core-
transition-css> | 218 <core-transition-css id="core-transition-bottom" transitionType="bottom"></core-
transition-css> |
220 <core-transition-css id="core-transition-left" transitionType="left"></core-tran
sition-css> | 219 <core-transition-css id="core-transition-left" transitionType="left"></core-tran
sition-css> |
221 <core-transition-css id="core-transition-right" transitionType="right"></core-tr
ansition-css> | 220 <core-transition-css id="core-transition-right" transitionType="right"></core-tr
ansition-css> |
OLD | NEW |