From 92854f7056808a8af3b1e66e483c7baa3d863f6d Mon Sep 17 00:00:00 2001 From: Georgios Kalpakas Date: Wed, 19 Nov 2014 17:04:26 +0200 Subject: [PATCH] docs(ngAnimate.$animate): fix classes during the various animation phases --- src/ngAnimate/animate.js | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/src/ngAnimate/animate.js b/src/ngAnimate/animate.js index c828b26b4085..7de87f334f2b 100644 --- a/src/ngAnimate/animate.js +++ b/src/ngAnimate/animate.js @@ -970,9 +970,9 @@ angular.module('ngAnimate', ['ng']) * | 3. $animate waits for the next digest to start the animation | class="my-animation ng-animate" | * | 4. the .ng-leave class is added to the element | class="my-animation ng-animate ng-leave" | * | 5. $animate scans the element styles to get the CSS transition/animation duration and delay | class="my-animation ng-animate ng-leave" | - * | 6. $animate blocks all CSS transitions on the element to ensure the .ng-leave class styling is applied right away | class="my-animation ng-animate ng-leave” | + * | 6. $animate blocks all CSS transitions on the element to ensure the .ng-leave class styling is applied right away | class="my-animation ng-animate ng-leave" | * | 7. $animate waits for a single animation frame (this performs a reflow) | class="my-animation ng-animate ng-leave" | - * | 8. $animate removes the CSS transition block placed on the element | class="my-animation ng-animate ng-leave” | + * | 8. $animate removes the CSS transition block placed on the element | class="my-animation ng-animate ng-leave" | * | 9. the .ng-leave-active class is added (this triggers the CSS transition/animation) | class="my-animation ng-animate ng-leave ng-leave-active" | * | 10. $animate waits for the animation to complete (via events and timeout) | class="my-animation ng-animate ng-leave ng-leave-active" | * | 11. The animation ends and all generated CSS classes are removed from the element | class="my-animation" | @@ -1016,9 +1016,9 @@ angular.module('ngAnimate', ['ng']) * | 4. $animate runs the JavaScript-defined animations detected on the element | class="my-animation ng-animate" | * | 5. the .ng-move class is added to the element | class="my-animation ng-animate ng-move" | * | 6. $animate scans the element styles to get the CSS transition/animation duration and delay | class="my-animation ng-animate ng-move" | - * | 7. $animate blocks all CSS transitions on the element to ensure the .ng-move class styling is applied right away | class="my-animation ng-animate ng-move” | + * | 7. $animate blocks all CSS transitions on the element to ensure the .ng-move class styling is applied right away | class="my-animation ng-animate ng-move" | * | 8. $animate waits for a single animation frame (this performs a reflow) | class="my-animation ng-animate ng-move" | - * | 9. $animate removes the CSS transition block placed on the element | class="my-animation ng-animate ng-move” | + * | 9. $animate removes the CSS transition block placed on the element | class="my-animation ng-animate ng-move" | * | 10. the .ng-move-active class is added (this triggers the CSS transition/animation) | class="my-animation ng-animate ng-move ng-move-active" | * | 11. $animate waits for the animation to complete (via events and timeout) | class="my-animation ng-animate ng-move ng-move-active" | * | 12. The animation ends and all generated CSS classes are removed from the element | class="my-animation" | @@ -1063,8 +1063,8 @@ angular.module('ngAnimate', ['ng']) * | 3. the .super-add class is added to the element | class="my-animation ng-animate super-add" | * | 4. $animate waits for a single animation frame (this performs a reflow) | class="my-animation ng-animate super-add" | * | 5. the .super and .super-add-active classes are added (this triggers the CSS transition/animation) | class="my-animation ng-animate super super-add super-add-active" | - * | 6. $animate scans the element styles to get the CSS transition/animation duration and delay | class="my-animation ng-animate super-add" | - * | 7. $animate waits for the animation to complete (via events and timeout) | class="my-animation super super-add super-add-active" | + * | 6. $animate scans the element styles to get the CSS transition/animation duration and delay | class="my-animation ng-animate super super-add super-add-active" | + * | 7. $animate waits for the animation to complete (via events and timeout) | class="my-animation ng-animate super super-add super-add-active" | * | 8. The animation ends and all generated CSS classes are removed from the element | class="my-animation super" | * | 9. The super class is kept on the element | class="my-animation super" | * | 10. The returned promise is resolved. | class="my-animation super" | @@ -1097,7 +1097,7 @@ angular.module('ngAnimate', ['ng']) * | 3. the .super-remove class is added to the element | class="my-animation super ng-animate super-remove" | * | 4. $animate waits for a single animation frame (this performs a reflow) | class="my-animation super ng-animate super-remove" | * | 5. the .super-remove-active classes are added and .super is removed (this triggers the CSS transition/animation) | class="my-animation ng-animate super-remove super-remove-active" | - * | 6. $animate scans the element styles to get the CSS transition/animation duration and delay | class="my-animation super ng-animate super-remove" | + * | 6. $animate scans the element styles to get the CSS transition/animation duration and delay | class="my-animation ng-animate super-remove super-remove-active" | * | 7. $animate waits for the animation to complete (via events and timeout) | class="my-animation ng-animate super-remove super-remove-active" | * | 8. The animation ends and all generated CSS classes are removed from the element | class="my-animation" | * | 9. The returned promise is resolved. | class="my-animation" | @@ -1122,11 +1122,11 @@ angular.module('ngAnimate', ['ng']) * * | Animation Step | What the element class attribute looks like | * |--------------------------------------------------------------------------------------------------------------------------------------|--------------------------------------------------------------------------------------| - * | 1. $animate.removeClass(element, ‘on’, ‘off’) is called | class="my-animation super off” | - * | 2. $animate runs the JavaScript-defined animations detected on the element | class="my-animation super ng-animate off” | - * | 3. the .on-add and .off-remove classes are added to the element | class="my-animation ng-animate on-add off-remove off” | - * | 4. $animate waits for a single animation frame (this performs a reflow) | class="my-animation ng-animate on-add off-remove off” | - * | 5. the .on, .on-add-active and .off-remove-active classes are added and .off is removed (this triggers the CSS transition/animation) | class="my-animation ng-animate on on-add on-add-active off-remove off-remove-active” | + * | 1. $animate.setClass(element, 'on', 'off') is called | class="my-animation off" | + * | 2. $animate runs the JavaScript-defined animations detected on the element | class="my-animation ng-animate off" | + * | 3. the .on-add and .off-remove classes are added to the element | class="my-animation ng-animate on-add off-remove off" | + * | 4. $animate waits for a single animation frame (this performs a reflow) | class="my-animation ng-animate on-add off-remove off" | + * | 5. the .on, .on-add-active and .off-remove-active classes are added and .off is removed (this triggers the CSS transition/animation) | class="my-animation ng-animate on on-add on-add-active off-remove off-remove-active" | * | 6. $animate scans the element styles to get the CSS transition/animation duration and delay | class="my-animation ng-animate on on-add on-add-active off-remove off-remove-active" | * | 7. $animate waits for the animation to complete (via events and timeout) | class="my-animation ng-animate on on-add on-add-active off-remove off-remove-active" | * | 8. The animation ends and all generated CSS classes are removed from the element | class="my-animation on" |