Merge pull request #7794 from tschaub/animation-complete

Call animation callback in a timeout

src/ol/View.js

@@ -289,7 +289,9 @@ View.prototype.animate = function(var_args) {
       this.setRotation(state.rotation);
     }
     if (callback) {
-      callback(true);
+      setTimeout(function() {
+        callback(true);
+      }, 0);
     }
     return;
   }
@@ -454,7 +456,9 @@ View.prototype.updateAnimations_ = function() {
       this.setHint(ViewHint.ANIMATING, -1);
       const callback = series[0].callback;
       if (callback) {
-        callback(true);
+        setTimeout(function() {
+          callback(true);
+        }, 0);
       }
     }
   }

test/spec/ol/view.test.js

@@ -426,15 +426,14 @@ describe('ol.View', function() {
       view.animate({
         zoom: 4,
         duration: 25
-      });
+      }, function(complete) {
-      expect(view.getAnimating()).to.eql(true);
+        expect(complete).to.be(true);
-
-      setTimeout(function() {
         expect(view.getCenter()).to.eql([0, 0]);
         expect(view.getZoom()).to.eql(4);
         expect(view.getAnimating()).to.eql(false);
         done();
-      }, 50);
+      });
+      expect(view.getAnimating()).to.eql(true);
     });
 
     it('allows duration to be zero', function(done) {
@@ -446,14 +445,13 @@ describe('ol.View', function() {
       view.animate({
         zoom: 4,
         duration: 0
-      });
+      }, function(complete) {
-
+        expect(complete).to.be(true);
-      setTimeout(function() {
         expect(view.getCenter()).to.eql([0, 0]);
         expect(view.getZoom()).to.eql(4);
         expect(view.getAnimating()).to.eql(false);
         done();
-      }, 10);
+      });
     });
 
     it('immediately completes for no-op animations', function() {
@@ -495,18 +493,17 @@ describe('ol.View', function() {
       const zoom = 3;
       const rotation = 0.4;
 
-      view.animate({
+      view.animate(
-        zoom: 1
+        {zoom: 1},
-      }, {
+        {center: [2, 3]},
-        center: [2, 3]
+        {rotation: 4},
-      }, {
+        {
-        rotation: 4
+          zoom: zoom,
-      }, {
+          center: center,
-        zoom: zoom,
+          rotation: rotation,
-        center: center,
+          duration: 25
-        rotation: rotation,
+        }
-        duration: 25
+      );
-      });
       expect(view.getAnimating()).to.eql(false);
       expect(view.getCenter()).to.eql(center);
       expect(view.getZoom()).to.eql(zoom);
@@ -559,7 +556,8 @@ describe('ol.View', function() {
       view.animate({
         rotation: Math.PI / 180 * 359,
         duration: 0
-      }, function() {
+      }, function(complete) {
+        expect(complete).to.be(true);
         expect(view.getRotation()).to.roughlyEqual(Math.PI / 180 * -1, 1e-12);
         done();
       });
@@ -574,7 +572,8 @@ describe('ol.View', function() {
       view.animate({
         rotation: Math.PI / 180 * -181,
         duration: 0
-      }, function() {
+      }, function(complete) {
+        expect(complete).to.be(true);
         expect(view.getRotation()).to.roughlyEqual(Math.PI / 180 * 179, 1e-12);
         done();
       });
@@ -595,6 +594,32 @@ describe('ol.View', function() {
       });
     });
 
+    it('allows the callback to trigger another animation', function(done) {
+      const view = new View({
+        center: [0, 0],
+        zoom: 0
+      });
+
+      function firstCallback(complete) {
+        expect(complete).to.be(true);
+
+        view.animate({
+          zoom: 2,
+          duration: 10
+        }, secondCallback);
+      }
+
+      function secondCallback(complete) {
+        expect(complete).to.be(true);
+        done();
+      }
+
+      view.animate({
+        zoom: 1,
+        duration: 25
+      }, firstCallback);
+    });
+
     it('calls callback with false when animation is interrupted', function(done) {
       const view = new View({
         center: [0, 0],