OLD | NEW |
---|---|
1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 // Counter used to give webkit animations unique names. | 5 // Counter used to give webkit animations unique names. |
6 var animationCounter = 0; | 6 var animationCounter = 0; |
7 | 7 |
8 function addAnimation(code) { | 8 function addAnimation(code) { |
9 var name = 'anim' + animationCounter; | 9 var name = 'anim' + animationCounter; |
10 animationCounter++; | 10 animationCounter++; |
(...skipping 46 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
57 * Fades out an element. Used for both printing options and error messages | 57 * Fades out an element. Used for both printing options and error messages |
58 * appearing underneath the textfields. | 58 * appearing underneath the textfields. |
59 * @param {HTMLElement} el The element to be faded out. | 59 * @param {HTMLElement} el The element to be faded out. |
60 */ | 60 */ |
61 function fadeOutElement(el) { | 61 function fadeOutElement(el) { |
62 if (!el.classList.contains('visible')) | 62 if (!el.classList.contains('visible')) |
63 return; | 63 return; |
64 el.style.height = 'auto'; | 64 el.style.height = 'auto'; |
65 var height = el.offsetHeight; | 65 var height = el.offsetHeight; |
66 el.style.height = height + 'px'; | 66 el.style.height = height + 'px'; |
67 var animName = addAnimation(''); | 67 el.offsetHeight; // Should force an update of the computed style. |
Noam Samuel
2014/01/15 22:08:44
Should this have a TODO attached to it to remove i
| |
68 var eventTracker = new EventTracker(); | 68 var eventTracker = new EventTracker(); |
69 eventTracker.add(el, 'webkitTransitionEnd', | 69 eventTracker.add(el, 'webkitTransitionEnd', |
70 onFadeOutTransitionEnd.bind(el, animName, eventTracker), | 70 onFadeOutTransitionEnd.bind(el, eventTracker), |
71 false); | 71 false); |
72 el.classList.add('closing'); | 72 el.classList.add('closing'); |
73 el.classList.remove('visible'); | 73 el.classList.remove('visible'); |
74 } | 74 } |
75 | 75 |
76 /** | 76 /** |
77 * Executes when a fade out animation ends. | 77 * Executes when a fade out animation ends. |
78 * @param {string} animationName The name of the animation to be removed. | |
79 * @param {EventTracker} eventTracker The |EventTracker| object that was used | 78 * @param {EventTracker} eventTracker The |EventTracker| object that was used |
80 * for adding this listener. | 79 * for adding this listener. |
81 * @param {WebkitTransitionEvent} event The event that triggered this listener. | 80 * @param {WebkitTransitionEvent} event The event that triggered this listener. |
82 * @this {HTMLElement} The element where the transition occurred. | 81 * @this {HTMLElement} The element where the transition occurred. |
83 */ | 82 */ |
84 function onFadeOutTransitionEnd(animationName, eventTracker, event) { | 83 function onFadeOutTransitionEnd(eventTracker, event) { |
85 if (event.propertyName != 'height') | 84 if (event.propertyName != 'height') |
86 return; | 85 return; |
87 fadeInOutCleanup(animationName); | |
88 eventTracker.remove(this, 'webkitTransitionEnd'); | 86 eventTracker.remove(this, 'webkitTransitionEnd'); |
89 this.hidden = true; | 87 this.hidden = true; |
90 } | 88 } |
91 | 89 |
92 /** | 90 /** |
93 * Executes when a fade in animation ends. | 91 * Executes when a fade in animation ends. |
94 * @param {EventTracker} eventTracker The |EventTracker| object that was used | 92 * @param {EventTracker} eventTracker The |EventTracker| object that was used |
95 * for adding this listener. | 93 * for adding this listener. |
96 * @param {WebkitAnimationEvent} event The event that triggered this listener. | 94 * @param {WebkitAnimationEvent} event The event that triggered this listener. |
97 * @this {HTMLElement} The element where the transition occurred. | 95 * @this {HTMLElement} The element where the transition occurred. |
(...skipping 65 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
163 while (el.childNodes.length > 0) | 161 while (el.childNodes.length > 0) |
164 div.appendChild(el.firstChild); | 162 div.appendChild(el.firstChild); |
165 el.appendChild(div); | 163 el.appendChild(div); |
166 } | 164 } |
167 | 165 |
168 div.className = ''; | 166 div.className = ''; |
169 div.classList.add('collapsible'); | 167 div.classList.add('collapsible'); |
170 for (var i = 0; i < classes.length; i++) | 168 for (var i = 0; i < classes.length; i++) |
171 div.classList.add(classes[i]); | 169 div.classList.add(classes[i]); |
172 } | 170 } |
OLD | NEW |