From ed80087f734d3e4ea71c33415da5ec9b4f9319e8 Mon Sep 17 00:00:00 2001
From: feichao <len.may@foxmail.com>
Date: Fri, 16 Jun 2017 19:39:28 +0800
Subject: [PATCH] fix(progressCircular): requestAnimationFrame is still running
when using ng-show or ng-hide
---
.../js/progressCircularDirective.js | 17 +++++++++++++++++
1 file changed, 17 insertions(+)
diff --git a/src/components/progressCircular/js/progressCircularDirective.js b/src/components/progressCircular/js/progressCircularDirective.js
index 5134bdd9017..64f4e220ba9 100644
--- a/src/components/progressCircular/js/progressCircularDirective.js
+++ b/src/components/progressCircular/js/progressCircularDirective.js
@@ -211,6 +211,23 @@ function MdProgressCircularDirective($window, $mdProgressCircular, $mdTheming,
});
+
+ // When using ng-show or ng-hide,
+ // the animation won't stop because requestAnimationFrame is still running.
+ // Do this to stop requestAnimationFrame can save some usage of system resources.
+ scope.$watch(function() {
+ var style = $window.getComputedStyle(node);
+ return style && style.display;
+ }, function(newValue, oldValue) {
+ if(newValue && newValue !== oldValue) {
+ if(newValue === 'none') {
+ cleanupIndeterminateAnimation();
+ } else {
+ startIndeterminateAnimation();
+ }
+ }
+ });
+
function renderCircle(animateFrom, animateTo, easing, duration, iterationCount, maxValue) {
var id = ++lastAnimationId;
var startTime = $mdUtil.now();