die for levels

build/bundle.js

@@ -4535,6 +4535,22 @@ var Sandbox = Backbone.View.extend({
     this.insertGitShim();
   },
 
+  releaseControl: function() {
+    // we will be handling commands that are submitted, mainly to add the sanadbox
+    // functionality (which is included by default in ParseWaterfall())
+    Main.getEventBaton().releaseBaton('commandSubmitted', this.commandSubmitted, this);
+    // we obviously take care of sandbox commands
+    Main.getEventBaton().releaseBaton('processSandboxCommand', this.processSandboxCommand, this);
+
+    this.releaseGitShim();
+  },
+
+  releaseGitShim: function() {
+    if (this.gitShim) {
+      this.gitShim.removeShim();
+    }
+  },
+
   insertGitShim: function() {
     // and our git shim goes in after the git engine is ready so it doesn't steal the baton
     // too early
@@ -4572,7 +4588,9 @@ var Sandbox = Backbone.View.extend({
 
   clear: function(command, deferred) {
     Main.getEvents().trigger('clearOldCommands');
-    command.finishWith(deferred);
+    if (command && deferred) {
+      command.finishWith(deferred);
+    }
   },
 
   delay: function(command, deferred) {
@@ -6334,6 +6352,7 @@ var ModalAlert = require('../views').ModalAlert;
 var MultiView = require('../views/multiView').MultiView;
 var CanvasTerminalHolder = require('../views').CanvasTerminalHolder;
 var ConfirmCancelTerminal = require('../views').ConfirmCancelTerminal;
+var LevelToolbar = require('../views').LevelToolbar;
 
 var TreeCompare = require('../git/treeCompare').TreeCompare;
 
@@ -6351,10 +6370,25 @@ var Level = Sandbox.extend({
     this.treeCompare = new TreeCompare();
 
     this.initGoalData(options);
+    this.initName(options);
+
     Sandbox.prototype.initialize.apply(this, [options]);
     this.startOffCommand();
   },
 
+  initName: function(options) {
+    this.levelName = options.levelName;
+    this.levelID = options.levelID;
+    if (!this.levelName || !this.levelID) {
+      this.levelName = 'Rebase Classic';
+      console.warn('REALLY BAD FORM need ids and names');
+    }
+
+    this.levelToolbar = new LevelToolbar({
+      levelName: this.levelName
+    });
+  },
+
   initGoalData: function(options) {
     this.goalTreeString = options.level.goalTree;
     this.solutionCommand = options.level.solutionCommand;
@@ -6375,6 +6409,12 @@ var Level = Sandbox.extend({
     Sandbox.prototype.takeControl.apply(this);
   },
 
+  releaseControl: function() {
+    Main.getEventBaton().releaseBaton('processLevelCommand', this.processLevelCommand, this);
+
+    Sandbox.prototype.releaseControl.apply(this);
+  },
+
   startOffCommand: function() {
     Main.getEventBaton().trigger(
       'commandSubmitted',
@@ -6586,6 +6626,22 @@ var Level = Sandbox.extend({
     });
   },
 
+  die: function() {
+    this.levelToolbar.die();
+    this.goalCanvasHolder.die();
+
+    this.mainVis.die();
+    this.goalVis.die();
+    this.releaseControl();
+
+    this.clear();
+
+    delete this.commandCollection;
+    delete this.mainVis;
+    delete this.goalVis;
+    delete this.goalCanvasHolder;
+  },
+
   getInstantCommands: function() {
     var hintMsg = (this.level.hint) ?
       this.level.hint :
@@ -6807,6 +6863,7 @@ var Visualization = Backbone.View.extend({
   tearDown: function() {
     // hmm -- dont think this will work to unbind the event listener...
     this.events.off('resize', this.myResize, this);
+    this.gitEngine.tearDown();
     this.gitVisuals.tearDown();
   },
 
@@ -7228,6 +7285,10 @@ GitEngine.prototype.getOrMakeRecursive = function(tree, createdSoFar, objID) {
   throw new Error('ruh rho!! unsupported tyep for ' + objID);
 };
 
+GitEngine.prototype.tearDown = function() {
+  this.removeAll();
+};
+
 GitEngine.prototype.removeAll = function() {
   this.branchCollection.reset();
   this.commitCollection.reset();
@@ -9320,7 +9381,7 @@ var BaseView = Backbone.View.extend({
   },
 
   tearDown: function() {
-    this.$el.html('');
+    this.$el.remove();
     if (this.container) {
       this.container.tearDown();
     }
@@ -9486,7 +9547,6 @@ var ModalView = Backbone.View.extend({
     // reason if this is done immediately, chrome might combine
     // the two changes and lose the ability to animate and it looks bad.
     process.nextTick(_.bind(function() {
-      console.log('STEALING KEYBOARD in modal');
       this.toggleShow(true);
     }, this));
   },
@@ -9650,6 +9710,7 @@ var ZoomAlertWindow = Backbone.View.extend({
 
 var LevelToolbar = BaseView.extend({
   tagName: 'div',
+  className: 'levelToolbarHolder',
   template: _.template($('#level-toolbar-template').html()),
 
   initialize: function(options) {
@@ -9668,6 +9729,8 @@ var LevelToolbar = BaseView.extend({
     }
   },
 
+  getAnimationTime: function() { return 700; },
+
   render: function() {
     var HTML = this.template(this.JSON);
 
@@ -9675,6 +9738,13 @@ var LevelToolbar = BaseView.extend({
     this.beforeDestination.after(this.el);
   },
 
+  die: function() {
+    this.hide();
+    setTimeout(_.bind(function() {
+      this.tearDown();
+    }, this), this.getAnimationTime());
+  },
+
   hide: function() {
     this.$('div.toolbar').toggleClass('hidden', true);
   },
@@ -9709,6 +9779,13 @@ var CanvasTerminalHolder = BaseView.extend({
     this.slideOut();
   },
 
+  die: function() {
+    this.slideOut();
+    setTimeout(_.bind(function() {
+      this.tearDown();
+    }, this));
+  },
+
   slideOut: function() {
     this.slideToggle(true);
   },
@@ -14477,6 +14554,10 @@ GitShim.prototype.insertShim = function() {
   this.eventBaton.stealBaton('processGitCommand', this.processGitCommand, this);
 };
 
+GitShim.prototype.removeShim = function() {
+  this.eventBaton.releaseBaton('processGitCommand', this.processGitCommand, this);
+};
+
 GitShim.prototype.processGitCommand = function(command, deferred) {
   this.beforeCB(command);
 
@@ -15696,6 +15777,10 @@ GitShim.prototype.insertShim = function() {
   this.eventBaton.stealBaton('processGitCommand', this.processGitCommand, this);
 };
 
+GitShim.prototype.removeShim = function() {
+  this.eventBaton.releaseBaton('processGitCommand', this.processGitCommand, this);
+};
+
 GitShim.prototype.processGitCommand = function(command, deferred) {
   this.beforeCB(command);
 
@@ -16068,6 +16153,10 @@ GitEngine.prototype.getOrMakeRecursive = function(tree, createdSoFar, objID) {
   throw new Error('ruh rho!! unsupported tyep for ' + objID);
 };
 
+GitEngine.prototype.tearDown = function() {
+  this.removeAll();
+};
+
 GitEngine.prototype.removeAll = function() {
   this.branchCollection.reset();
   this.commitCollection.reset();
@@ -17726,6 +17815,7 @@ var ModalAlert = require('../views').ModalAlert;
 var MultiView = require('../views/multiView').MultiView;
 var CanvasTerminalHolder = require('../views').CanvasTerminalHolder;
 var ConfirmCancelTerminal = require('../views').ConfirmCancelTerminal;
+var LevelToolbar = require('../views').LevelToolbar;
 
 var TreeCompare = require('../git/treeCompare').TreeCompare;
 
@@ -17743,10 +17833,25 @@ var Level = Sandbox.extend({
     this.treeCompare = new TreeCompare();
 
     this.initGoalData(options);
+    this.initName(options);
+
     Sandbox.prototype.initialize.apply(this, [options]);
     this.startOffCommand();
   },
 
+  initName: function(options) {
+    this.levelName = options.levelName;
+    this.levelID = options.levelID;
+    if (!this.levelName || !this.levelID) {
+      this.levelName = 'Rebase Classic';
+      console.warn('REALLY BAD FORM need ids and names');
+    }
+
+    this.levelToolbar = new LevelToolbar({
+      levelName: this.levelName
+    });
+  },
+
   initGoalData: function(options) {
     this.goalTreeString = options.level.goalTree;
     this.solutionCommand = options.level.solutionCommand;
@@ -17767,6 +17872,12 @@ var Level = Sandbox.extend({
     Sandbox.prototype.takeControl.apply(this);
   },
 
+  releaseControl: function() {
+    Main.getEventBaton().releaseBaton('processLevelCommand', this.processLevelCommand, this);
+
+    Sandbox.prototype.releaseControl.apply(this);
+  },
+
   startOffCommand: function() {
     Main.getEventBaton().trigger(
       'commandSubmitted',
@@ -17978,6 +18089,22 @@ var Level = Sandbox.extend({
     });
   },
 
+  die: function() {
+    this.levelToolbar.die();
+    this.goalCanvasHolder.die();
+
+    this.mainVis.die();
+    this.goalVis.die();
+    this.releaseControl();
+
+    this.clear();
+
+    delete this.commandCollection;
+    delete this.mainVis;
+    delete this.goalVis;
+    delete this.goalCanvasHolder;
+  },
+
   getInstantCommands: function() {
     var hintMsg = (this.level.hint) ?
       this.level.hint :
@@ -18193,6 +18320,22 @@ var Sandbox = Backbone.View.extend({
     this.insertGitShim();
   },
 
+  releaseControl: function() {
+    // we will be handling commands that are submitted, mainly to add the sanadbox
+    // functionality (which is included by default in ParseWaterfall())
+    Main.getEventBaton().releaseBaton('commandSubmitted', this.commandSubmitted, this);
+    // we obviously take care of sandbox commands
+    Main.getEventBaton().releaseBaton('processSandboxCommand', this.processSandboxCommand, this);
+
+    this.releaseGitShim();
+  },
+
+  releaseGitShim: function() {
+    if (this.gitShim) {
+      this.gitShim.removeShim();
+    }
+  },
+
   insertGitShim: function() {
     // and our git shim goes in after the git engine is ready so it doesn't steal the baton
     // too early
@@ -18230,7 +18373,9 @@ var Sandbox = Backbone.View.extend({
 
   clear: function(command, deferred) {
     Main.getEvents().trigger('clearOldCommands');
-    command.finishWith(deferred);
+    if (command && deferred) {
+      command.finishWith(deferred);
+    }
   },
 
   delay: function(command, deferred) {
@@ -18710,7 +18855,8 @@ var toGlobalize = {
   Views: require('../views'),
   MultiView: require('../views/multiView'),
   ZoomLevel: require('../util/zoomLevel'),
-  VisBranch: require('../visuals/visBranch')
+  VisBranch: require('../visuals/visBranch'),
+  Level: require('../level')
 };
 
 _.each(toGlobalize, function(module) {
@@ -19428,7 +19574,7 @@ var BaseView = Backbone.View.extend({
   },
 
   tearDown: function() {
-    this.$el.html('');
+    this.$el.remove();
     if (this.container) {
       this.container.tearDown();
     }
@@ -19594,7 +19740,6 @@ var ModalView = Backbone.View.extend({
     // reason if this is done immediately, chrome might combine
     // the two changes and lose the ability to animate and it looks bad.
     process.nextTick(_.bind(function() {
-      console.log('STEALING KEYBOARD in modal');
       this.toggleShow(true);
     }, this));
   },
@@ -19758,6 +19903,7 @@ var ZoomAlertWindow = Backbone.View.extend({
 
 var LevelToolbar = BaseView.extend({
   tagName: 'div',
+  className: 'levelToolbarHolder',
   template: _.template($('#level-toolbar-template').html()),
 
   initialize: function(options) {
@@ -19776,6 +19922,8 @@ var LevelToolbar = BaseView.extend({
     }
   },
 
+  getAnimationTime: function() { return 700; },
+
   render: function() {
     var HTML = this.template(this.JSON);
 
@@ -19783,6 +19931,13 @@ var LevelToolbar = BaseView.extend({
     this.beforeDestination.after(this.el);
   },
 
+  die: function() {
+    this.hide();
+    setTimeout(_.bind(function() {
+      this.tearDown();
+    }, this), this.getAnimationTime());
+  },
+
   hide: function() {
     this.$('div.toolbar').toggleClass('hidden', true);
   },
@@ -19817,6 +19972,13 @@ var CanvasTerminalHolder = BaseView.extend({
     this.slideOut();
   },
 
+  die: function() {
+    this.slideOut();
+    setTimeout(_.bind(function() {
+      this.tearDown();
+    }, this));
+  },
+
   slideOut: function() {
     this.slideToggle(true);
   },
@@ -22519,6 +22681,7 @@ var Visualization = Backbone.View.extend({
   tearDown: function() {
     // hmm -- dont think this will work to unbind the event listener...
     this.events.off('resize', this.myResize, this);
+    this.gitEngine.tearDown();
     this.gitVisuals.tearDown();
   },
 

src/index.html

@@ -94,7 +94,10 @@
     <div class="toolbar level-toolbar box vertical transitionAll hidden">
       <div>
         <i class="icon-bolt"></i>
-          You are on level <%= levelName %>
+          Level
+            <span class="levelToolbarSpan">
+              <%= levelName %>
+            </span>
       </div>
     </div>
   </script>

src/js/git/gitShim.js

@@ -27,6 +27,10 @@ GitShim.prototype.insertShim = function() {
   this.eventBaton.stealBaton('processGitCommand', this.processGitCommand, this);
 };
 
+GitShim.prototype.removeShim = function() {
+  this.eventBaton.releaseBaton('processGitCommand', this.processGitCommand, this);
+};
+
 GitShim.prototype.processGitCommand = function(command, deferred) {
   this.beforeCB(command);
 

src/js/git/index.js

@@ -257,6 +257,10 @@ GitEngine.prototype.getOrMakeRecursive = function(tree, createdSoFar, objID) {
   throw new Error('ruh rho!! unsupported tyep for ' + objID);
 };
 
+GitEngine.prototype.tearDown = function() {
+  this.removeAll();
+};
+
 GitEngine.prototype.removeAll = function() {
   this.branchCollection.reset();
   this.commitCollection.reset();

src/js/level/index.js

@@ -18,6 +18,7 @@ var ModalAlert = require('../views').ModalAlert;
 var MultiView = require('../views/multiView').MultiView;
 var CanvasTerminalHolder = require('../views').CanvasTerminalHolder;
 var ConfirmCancelTerminal = require('../views').ConfirmCancelTerminal;
+var LevelToolbar = require('../views').LevelToolbar;
 
 var TreeCompare = require('../git/treeCompare').TreeCompare;
 
@@ -35,10 +36,25 @@ var Level = Sandbox.extend({
     this.treeCompare = new TreeCompare();
 
     this.initGoalData(options);
+    this.initName(options);
+
     Sandbox.prototype.initialize.apply(this, [options]);
     this.startOffCommand();
   },
 
+  initName: function(options) {
+    this.levelName = options.levelName;
+    this.levelID = options.levelID;
+    if (!this.levelName || !this.levelID) {
+      this.levelName = 'Rebase Classic';
+      console.warn('REALLY BAD FORM need ids and names');
+    }
+
+    this.levelToolbar = new LevelToolbar({
+      levelName: this.levelName
+    });
+  },
+
   initGoalData: function(options) {
     this.goalTreeString = options.level.goalTree;
     this.solutionCommand = options.level.solutionCommand;
@@ -59,6 +75,12 @@ var Level = Sandbox.extend({
     Sandbox.prototype.takeControl.apply(this);
   },
 
+  releaseControl: function() {
+    Main.getEventBaton().releaseBaton('processLevelCommand', this.processLevelCommand, this);
+
+    Sandbox.prototype.releaseControl.apply(this);
+  },
+
   startOffCommand: function() {
     Main.getEventBaton().trigger(
       'commandSubmitted',
@@ -270,6 +292,22 @@ var Level = Sandbox.extend({
     });
   },
 
+  die: function() {
+    this.levelToolbar.die();
+    this.goalCanvasHolder.die();
+
+    this.mainVis.die();
+    this.goalVis.die();
+    this.releaseControl();
+
+    this.clear();
+
+    delete this.commandCollection;
+    delete this.mainVis;
+    delete this.goalVis;
+    delete this.goalCanvasHolder;
+  },
+
   getInstantCommands: function() {
     var hintMsg = (this.level.hint) ?
       this.level.hint :

src/js/level/sandbox.js

@@ -67,6 +67,22 @@ var Sandbox = Backbone.View.extend({
     this.insertGitShim();
   },
 
+  releaseControl: function() {
+    // we will be handling commands that are submitted, mainly to add the sanadbox
+    // functionality (which is included by default in ParseWaterfall())
+    Main.getEventBaton().releaseBaton('commandSubmitted', this.commandSubmitted, this);
+    // we obviously take care of sandbox commands
+    Main.getEventBaton().releaseBaton('processSandboxCommand', this.processSandboxCommand, this);
+
+    this.releaseGitShim();
+  },
+
+  releaseGitShim: function() {
+    if (this.gitShim) {
+      this.gitShim.removeShim();
+    }
+  },
+
   insertGitShim: function() {
     // and our git shim goes in after the git engine is ready so it doesn't steal the baton
     // too early
@@ -104,7 +120,9 @@ var Sandbox = Backbone.View.extend({
 
   clear: function(command, deferred) {
     Main.getEvents().trigger('clearOldCommands');
-    command.finishWith(deferred);
+    if (command && deferred) {
+      command.finishWith(deferred);
+    }
   },
 
   delay: function(command, deferred) {

src/js/util/debug.js

@@ -17,7 +17,8 @@ var toGlobalize = {
   Views: require('../views'),
   MultiView: require('../views/multiView'),
   ZoomLevel: require('../util/zoomLevel'),
-  VisBranch: require('../visuals/visBranch')
+  VisBranch: require('../visuals/visBranch'),
+  Level: require('../level')
 };
 
 _.each(toGlobalize, function(module) {

src/js/views/index.js

@@ -13,7 +13,7 @@ var BaseView = Backbone.View.extend({
   },
 
   tearDown: function() {
-    this.$el.html('');
+    this.$el.remove();
     if (this.container) {
       this.container.tearDown();
     }
@@ -179,7 +179,6 @@ var ModalView = Backbone.View.extend({
     // reason if this is done immediately, chrome might combine
     // the two changes and lose the ability to animate and it looks bad.
     process.nextTick(_.bind(function() {
-      console.log('STEALING KEYBOARD in modal');
       this.toggleShow(true);
     }, this));
   },
@@ -343,6 +342,7 @@ var ZoomAlertWindow = Backbone.View.extend({
 
 var LevelToolbar = BaseView.extend({
   tagName: 'div',
+  className: 'levelToolbarHolder',
   template: _.template($('#level-toolbar-template').html()),
 
   initialize: function(options) {
@@ -361,6 +361,8 @@ var LevelToolbar = BaseView.extend({
     }
   },
 
+  getAnimationTime: function() { return 700; },
+
   render: function() {
     var HTML = this.template(this.JSON);
 
@@ -368,6 +370,13 @@ var LevelToolbar = BaseView.extend({
     this.beforeDestination.after(this.el);
   },
 
+  die: function() {
+    this.hide();
+    setTimeout(_.bind(function() {
+      this.tearDown();
+    }, this), this.getAnimationTime());
+  },
+
   hide: function() {
     this.$('div.toolbar').toggleClass('hidden', true);
   },
@@ -402,6 +411,13 @@ var CanvasTerminalHolder = BaseView.extend({
     this.slideOut();
   },
 
+  die: function() {
+    this.slideOut();
+    setTimeout(_.bind(function() {
+      this.tearDown();
+    }, this));
+  },
+
   slideOut: function() {
     this.slideToggle(true);
   },

src/js/visuals/visualization.js

@@ -112,6 +112,7 @@ var Visualization = Backbone.View.extend({
   tearDown: function() {
     // hmm -- dont think this will work to unbind the event listener...
     this.events.off('resize', this.myResize, this);
+    this.gitEngine.tearDown();
     this.gitVisuals.tearDown();
   },
 

src/style/main.css

@@ -210,6 +210,11 @@ div.toolbar.level-toolbar {
   height: 50px;
 }
 
+span.levelToolbarSpan {
+  font-weight: 800;
+  font-style: italic;
+}
+
 div.toolbar.level-toolbar.hidden {
   opacity: 0;
   height: 0px;

todo.txt

@@ -3,12 +3,13 @@ Big things:
 
 Big Graphic things:
 ~~~~~~~~~~~~~~~~~~~~~~~~~
-[ ] show which level you are in! with a little thing on the top
 [ ] levels dropdown selection?
+[.] level teardown
+[ ] git demonstration view
+[ ] sandbox can launch and takedown levels
 
 Medium things:
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~
-[ ] move command history into sandbox / visualization?
 
 Commands
 ========
@@ -33,6 +34,8 @@ Big Bugs to fix:
 Done things:
 (I only started this on Dec 17th 2012 to get a better sense of what was done)
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+[x] great die for levels
+[x] show which level you are in! with a little thing on the top
 [x] allow command history to clear finished ones
 [x] put in some > into the rules for CSS
 [x] fix bug for multiview, i think its from the die() on everyone