Add transition.end.

README.md

@@ -357,6 +357,7 @@ Adds or removes a *listener* to each selected element for the specified event *t
 * `start` - when the transition starts.
 * `end` - when the transition ends.
 * `interrupt` - when the transition is interrupted.
+* `cancel` - when the transition is cancelled.
 
 See [The Life of a Transition](#the-life-of-a-transition) for more. Note that these are *not* native DOM events as implemented by [*selection*.on](https://github.com/d3/d3-selection#selection_on) and [*selection*.dispatch](https://github.com/d3/d3-selection#selection_dispatch), but transition events!
 

src/interrupt.js

@@ -16,7 +16,7 @@ export default function(node, name) {
     active = schedule.state > STARTING && schedule.state < ENDING;
     schedule.state = ENDED;
     schedule.timer.stop();
-    if (active) schedule.on.call("interrupt", node, node.__data__, schedule.index, schedule.group);
+    schedule.on.call(active ? "interrupt" : "cancel", node, node.__data__, schedule.index, schedule.group);
     delete schedules[i];
   }
 

src/transition/end.js

@@ -0,0 +1,26 @@
+import {set} from "./schedule";
+
+export default function() {
+  var on0, on1, that = this, id = that._id, size = that.size();
+  return new Promise(function(resolve, reject) {
+    var cancel = {value: reject},
+        end = {value: function() { if (--size === 0) resolve(); }};
+
+    that.each(function() {
+      var schedule = set(this, id),
+          on = schedule.on;
+
+      // If this node shared a dispatch with the previous node,
+      // just assign the updated shared dispatch and we’re done!
+      // Otherwise, copy-on-write.
+      if (on !== on0) {
+        on1 = (on0 = on).copy();
+        on1._.cancel.push(cancel);
+        on1._.interrupt.push(cancel);
+        on1._.end.push(end);
+      }
+
+      schedule.on = on1;
+    });
+  });
+}

src/transition/index.js

@@ -16,6 +16,7 @@ import transition_styleTween from "./styleTween";
 import transition_text from "./text";
 import transition_transition from "./transition";
 import transition_tween from "./tween";
+import transition_end from "./end";
 
 var id = 0;
 
@@ -60,5 +61,6 @@ Transition.prototype = transition.prototype = {
   tween: transition_tween,
   delay: transition_delay,
   duration: transition_duration,
-  ease: transition_ease
+  ease: transition_ease,
+  end: transition_end
 };

src/transition/schedule.js

@@ -1,7 +1,7 @@
 import {dispatch} from "d3-dispatch";
 import {timer, timeout} from "d3-timer";
 
-var emptyOn = dispatch("start", "end", "interrupt");
+var emptyOn = dispatch("start", "end", "cancel", "interrupt");
 var emptyTween = [];
 
 export var CREATED = 0;
@@ -82,20 +82,18 @@ function create(node, id, self) {
       if (o.state === STARTED) return timeout(start);
 
       // Interrupt the active transition, if any.
-      // Dispatch the interrupt event.
       if (o.state === RUNNING) {
         o.state = ENDED;
         o.timer.stop();
         o.on.call("interrupt", node, node.__data__, o.index, o.group);
         delete schedules[i];
       }
 
-      // Cancel any pre-empted transitions. No interrupt event is dispatched
-      // because the cancelled transitions never started. Note that this also
-      // removes this transition from the pending list!
+      // Cancel any pre-empted transitions.
       else if (+i < id) {
         o.state = ENDED;
         o.timer.stop();
+        o.on.call("cancel", node, node.__data__, o.index, o.group);
         delete schedules[i];
       }
     }