promise animation

build/bundle.js

@@ -9442,6 +9442,7 @@ var AnimationQueue = Backbone.Model.extend({
     // ok so call the first animation, and then set a timeout to call the next.
     // since an animation is defined as taking a specific amount of time,
     // we can simply just use timeouts rather than promises / deferreds.
+
     // for graphical displays that require an unknown amount of time, use deferreds
     // but not animation queue (see the finishAnimation for that)
     var animations = this.get('animations');
@@ -9463,7 +9464,39 @@ var AnimationQueue = Backbone.Model.extend({
   }
 });
 
+var PromiseAnimation = Backbone.Model.extend({
+  defaults: {
+    deferred: null,
+    closure: null,
+    duration: 300
+  },
+
+  initialize: function(options) {
+    if (!options.closure || !options.deferred) {
+      throw new Error('need closure and deferred');
+    }
+    // TODO needed?
+    this.set('animation', options.animation);
+    this.set('deferred', options.deferred);
+  },
+
+  play: function() {
+    // a single animation is just something with a timeout, but now
+    // we want to resolve a deferred when the animation finishes
+    this.get('closure')();
+    setTimeout(_.bind(function() {
+      this.get('deferred').resolve();
+    }, this), this.get('duration'));
+  },
+
+  then: function() {
+    return this.get('deferred').promise.then();
+  }
+});
+
+
 exports.Animation = Animation;
+exports.PromiseAnimation = PromiseAnimation;
 exports.AnimationQueue = AnimationQueue;
 
 });
@@ -31460,6 +31493,7 @@ var AnimationQueue = Backbone.Model.extend({
     // ok so call the first animation, and then set a timeout to call the next.
     // since an animation is defined as taking a specific amount of time,
     // we can simply just use timeouts rather than promises / deferreds.
+
     // for graphical displays that require an unknown amount of time, use deferreds
     // but not animation queue (see the finishAnimation for that)
     var animations = this.get('animations');
@@ -31481,7 +31515,39 @@ var AnimationQueue = Backbone.Model.extend({
   }
 });
 
+var PromiseAnimation = Backbone.Model.extend({
+  defaults: {
+    deferred: null,
+    closure: null,
+    duration: 300
+  },
+
+  initialize: function(options) {
+    if (!options.closure || !options.deferred) {
+      throw new Error('need closure and deferred');
+    }
+    // TODO needed?
+    this.set('animation', options.animation);
+    this.set('deferred', options.deferred);
+  },
+
+  play: function() {
+    // a single animation is just something with a timeout, but now
+    // we want to resolve a deferred when the animation finishes
+    this.get('closure')();
+    setTimeout(_.bind(function() {
+      this.get('deferred').resolve();
+    }, this), this.get('duration'));
+  },
+
+  then: function() {
+    return this.get('deferred').promise.then();
+  }
+});
+
+
 exports.Animation = Animation;
+exports.PromiseAnimation = PromiseAnimation;
 exports.AnimationQueue = AnimationQueue;
 
 });

index.html

@@ -426,7 +426,7 @@
        For a much easier time perusing the source, see the individual files at:
           https://github.com/pcottle/learnGitBranching
   -->
-  <script src="build/bundle.min.67f82a44.js"></script>
+  <script src="build/bundle.js"></script>
 
   <!-- The advantage of github pages: super-easy, simple, slick static hostic.
        The downside? No raw logs to parse for analytics, so I have to include

src/js/visuals/animation/index.js

@@ -64,6 +64,7 @@ var AnimationQueue = Backbone.Model.extend({
     // ok so call the first animation, and then set a timeout to call the next.
     // since an animation is defined as taking a specific amount of time,
     // we can simply just use timeouts rather than promises / deferreds.
+
     // for graphical displays that require an unknown amount of time, use deferreds
     // but not animation queue (see the finishAnimation for that)
     var animations = this.get('animations');
@@ -85,5 +86,37 @@ var AnimationQueue = Backbone.Model.extend({
   }
 });
 
+var PromiseAnimation = Backbone.Model.extend({
+  defaults: {
+    deferred: null,
+    closure: null,
+    duration: 300
+  },
+
+  initialize: function(options) {
+    if (!options.closure || !options.deferred) {
+      throw new Error('need closure and deferred');
+    }
+    // TODO needed?
+    this.set('animation', options.animation);
+    this.set('deferred', options.deferred);
+  },
+
+  play: function() {
+    // a single animation is just something with a timeout, but now
+    // we want to resolve a deferred when the animation finishes
+    this.get('closure')();
+    setTimeout(_.bind(function() {
+      this.get('deferred').resolve();
+    }, this), this.get('duration'));
+  },
+
+  then: function() {
+    return this.get('deferred').promise.then();
+  }
+});
+
+
 exports.Animation = Animation;
+exports.PromiseAnimation = PromiseAnimation;
 exports.AnimationQueue = AnimationQueue;