awesome pull animation now

build/bundle.js

@@ -7851,7 +7851,8 @@ GitEngine.prototype.getTargetGraphDifference = function(
   });
 };
 
-GitEngine.prototype.fetch = function() {
+GitEngine.prototype.fetch = function(options) {
+  options = options || {};
   var localBranch = this.refs['o/master'];
   var remoteBranch = this.origin.refs['master'];
 
@@ -7918,7 +7919,14 @@ GitEngine.prototype.fetch = function() {
     return AnimationFactory.playRefreshAnimation(this.gitVisuals);
   }, this));
 
+  if (!options.dontResolvePromise) {
     this.animationQueue.thenFinish(chain, deferred);
+  }
+  return {
+    chain: chain,
+    deferred: deferred,
+    lastCommitID: commitsToMake.pop().id
+  };
 };
 
 GitEngine.prototype.pullStarter = function() {
@@ -7928,15 +7936,58 @@ GitEngine.prototype.pullStarter = function() {
     });
   }
   this.acceptNoGeneralArgs();
+  // eventually args go here
+  this.pull();
+};
+
+GitEngine.prototype.pull = function() {
+  var localBranch = this.refs['master'];
+  var remoteBranch = this.refs['o/master'];
 
   // no matter what fetch
-  this.fetch();
+  var pendingFetch = this.fetch({
+    dontResolvePromise: true
+  });
+  var chain = pendingFetch.chain;
+  var deferred = pendingFetch.deferred;
+
   // then either rebase or merge
   if (this.commandOptions['--rebase']) {
     this.rebaseFinisher('o/master', 'master');
   } else {
-    this.merge('o/master');
+    chain = chain.then(function() {
+      return AnimationFactory.getDelayedPromise(700);
+    });
+    
+    chain = chain.then(_.bind(function() {
+      // highlight last commit on o/master
+      var commit = this.refs[pendingFetch.lastCommitID];
+      return AnimationFactory.playHighlightPromiseAnimation(
+        commit,
+        localBranch
+      );
+    }, this));
+
+    chain = chain.then(_.bind(function() {
+      return AnimationFactory.playHighlightPromiseAnimation(
+        this.getCommitFromRef('master'),
+        remoteBranch
+      );
+    }, this));
+
+    chain = chain.then(function() {
+      return AnimationFactory.getDelayedPromise(700);
+    });
+    chain = chain.then(_.bind(function() {
+      var newCommit = this.merge('o/master');
+      return AnimationFactory.playCommitBirthPromiseAnimation(
+        newCommit,
+        this.gitVisuals
+      );
+    }, this));
   }
+
+  this.animationQueue.thenFinish(chain, deferred);
 };
 
 GitEngine.prototype.cloneStarter = function() {
@@ -9200,6 +9251,7 @@ exports.Ref = Ref;
 
 require.define("/src/js/visuals/animation/animationFactory.js",function(require,module,exports,__dirname,__filename,process,global){var _ = require('underscore');
 var Backbone = require('backbone');
+var Q = require('q');
 
 var Animation = require('./index').Animation;
 var PromiseAnimation = require('./index').PromiseAnimation;
@@ -9333,6 +9385,12 @@ AnimationFactory.playHighlightPromiseAnimation = function(commit, destObj) {
   return animation.getPromise();
 };
 
+AnimationFactory.getDelayedPromise = function(amount) {
+  var deferred = Q.defer();
+  setTimeout(deferred.resolve, amount || 1000);
+  return deferred.promise;
+};
+
 AnimationFactory.delay = function(animationQueue, time) {
   time = time || GRAPHICS.defaultAnimationTime;
   animationQueue.add(new Animation({
@@ -23776,7 +23834,8 @@ GitEngine.prototype.getTargetGraphDifference = function(
   });
 };
 
-GitEngine.prototype.fetch = function() {
+GitEngine.prototype.fetch = function(options) {
+  options = options || {};
   var localBranch = this.refs['o/master'];
   var remoteBranch = this.origin.refs['master'];
 
@@ -23843,7 +23902,14 @@ GitEngine.prototype.fetch = function() {
     return AnimationFactory.playRefreshAnimation(this.gitVisuals);
   }, this));
 
+  if (!options.dontResolvePromise) {
     this.animationQueue.thenFinish(chain, deferred);
+  }
+  return {
+    chain: chain,
+    deferred: deferred,
+    lastCommitID: commitsToMake.pop().id
+  };
 };
 
 GitEngine.prototype.pullStarter = function() {
@@ -23853,15 +23919,58 @@ GitEngine.prototype.pullStarter = function() {
     });
   }
   this.acceptNoGeneralArgs();
+  // eventually args go here
+  this.pull();
+};
+
+GitEngine.prototype.pull = function() {
+  var localBranch = this.refs['master'];
+  var remoteBranch = this.refs['o/master'];
 
   // no matter what fetch
-  this.fetch();
+  var pendingFetch = this.fetch({
+    dontResolvePromise: true
+  });
+  var chain = pendingFetch.chain;
+  var deferred = pendingFetch.deferred;
+
   // then either rebase or merge
   if (this.commandOptions['--rebase']) {
     this.rebaseFinisher('o/master', 'master');
   } else {
-    this.merge('o/master');
+    chain = chain.then(function() {
+      return AnimationFactory.getDelayedPromise(700);
+    });
+    
+    chain = chain.then(_.bind(function() {
+      // highlight last commit on o/master
+      var commit = this.refs[pendingFetch.lastCommitID];
+      return AnimationFactory.playHighlightPromiseAnimation(
+        commit,
+        localBranch
+      );
+    }, this));
+
+    chain = chain.then(_.bind(function() {
+      return AnimationFactory.playHighlightPromiseAnimation(
+        this.getCommitFromRef('master'),
+        remoteBranch
+      );
+    }, this));
+
+    chain = chain.then(function() {
+      return AnimationFactory.getDelayedPromise(700);
+    });
+    chain = chain.then(_.bind(function() {
+      var newCommit = this.merge('o/master');
+      return AnimationFactory.playCommitBirthPromiseAnimation(
+        newCommit,
+        this.gitVisuals
+      );
+    }, this));
   }
+
+  this.animationQueue.thenFinish(chain, deferred);
 };
 
 GitEngine.prototype.cloneStarter = function() {
@@ -31342,6 +31451,7 @@ require("/src/js/views/rebaseView.js");
 
 require.define("/src/js/visuals/animation/animationFactory.js",function(require,module,exports,__dirname,__filename,process,global){var _ = require('underscore');
 var Backbone = require('backbone');
+var Q = require('q');
 
 var Animation = require('./index').Animation;
 var PromiseAnimation = require('./index').PromiseAnimation;
@@ -31475,6 +31585,12 @@ AnimationFactory.playHighlightPromiseAnimation = function(commit, destObj) {
   return animation.getPromise();
 };
 
+AnimationFactory.getDelayedPromise = function(amount) {
+  var deferred = Q.defer();
+  setTimeout(deferred.resolve, amount || 1000);
+  return deferred.promise;
+};
+
 AnimationFactory.delay = function(animationQueue, time) {
   time = time || GRAPHICS.defaultAnimationTime;
   animationQueue.add(new Animation({

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.774546c0.js"></script>
+  <script src="build/bundle.min.4369b0c9.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/git/index.js

@@ -809,7 +809,8 @@ GitEngine.prototype.getTargetGraphDifference = function(
   });
 };
 
-GitEngine.prototype.fetch = function() {
+GitEngine.prototype.fetch = function(options) {
+  options = options || {};
   var localBranch = this.refs['o/master'];
   var remoteBranch = this.origin.refs['master'];
 
@@ -876,7 +877,14 @@ GitEngine.prototype.fetch = function() {
     return AnimationFactory.playRefreshAnimation(this.gitVisuals);
   }, this));
 
+  if (!options.dontResolvePromise) {
     this.animationQueue.thenFinish(chain, deferred);
+  }
+  return {
+    chain: chain,
+    deferred: deferred,
+    lastCommitID: commitsToMake.pop().id
+  };
 };
 
 GitEngine.prototype.pullStarter = function() {
@@ -886,15 +894,58 @@ GitEngine.prototype.pullStarter = function() {
     });
   }
   this.acceptNoGeneralArgs();
+  // eventually args go here
+  this.pull();
+};
+
+GitEngine.prototype.pull = function() {
+  var localBranch = this.refs['master'];
+  var remoteBranch = this.refs['o/master'];
 
   // no matter what fetch
-  this.fetch();
+  var pendingFetch = this.fetch({
+    dontResolvePromise: true
+  });
+  var chain = pendingFetch.chain;
+  var deferred = pendingFetch.deferred;
+
   // then either rebase or merge
   if (this.commandOptions['--rebase']) {
     this.rebaseFinisher('o/master', 'master');
   } else {
-    this.merge('o/master');
+    chain = chain.then(function() {
+      return AnimationFactory.getDelayedPromise(700);
+    });
+    
+    chain = chain.then(_.bind(function() {
+      // highlight last commit on o/master
+      var commit = this.refs[pendingFetch.lastCommitID];
+      return AnimationFactory.playHighlightPromiseAnimation(
+        commit,
+        localBranch
+      );
+    }, this));
+
+    chain = chain.then(_.bind(function() {
+      return AnimationFactory.playHighlightPromiseAnimation(
+        this.getCommitFromRef('master'),
+        remoteBranch
+      );
+    }, this));
+
+    chain = chain.then(function() {
+      return AnimationFactory.getDelayedPromise(700);
+    });
+    chain = chain.then(_.bind(function() {
+      var newCommit = this.merge('o/master');
+      return AnimationFactory.playCommitBirthPromiseAnimation(
+        newCommit,
+        this.gitVisuals
+      );
+    }, this));
   }
+
+  this.animationQueue.thenFinish(chain, deferred);
 };
 
 GitEngine.prototype.cloneStarter = function() {

src/js/visuals/animation/animationFactory.js

@@ -1,5 +1,6 @@
 var _ = require('underscore');
 var Backbone = require('backbone');
+var Q = require('q');
 
 var Animation = require('./index').Animation;
 var PromiseAnimation = require('./index').PromiseAnimation;
@@ -133,6 +134,12 @@ AnimationFactory.playHighlightPromiseAnimation = function(commit, destObj) {
   return animation.getPromise();
 };
 
+AnimationFactory.getDelayedPromise = function(amount) {
+  var deferred = Q.defer();
+  setTimeout(deferred.resolve, amount || 1000);
+  return deferred.promise;
+};
+
 AnimationFactory.delay = function(animationQueue, time) {
   time = time || GRAPHICS.defaultAnimationTime;
   animationQueue.add(new Animation({