promise animation

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;