level toolbar thing

build/bundle.js

@@ -9648,6 +9648,42 @@ var ZoomAlertWindow = Backbone.View.extend({
   }
 });
 
+var LevelToolbar = BaseView.extend({
+  tagName: 'div',
+  template: _.template($('#level-toolbar-template').html()),
+
+  initialize: function(options) {
+    options = options || {};
+    this.JSON = {
+      levelName: options.levelName || 'Some level! (unknown name)'
+    };
+
+    this.beforeDestination = $($('#commandLineHistory div.toolbar')[0]);
+    this.render();
+
+    if (!options.wait) {
+      process.nextTick(_.bind(function() {
+        this.show();
+      }, this));
+    }
+  },
+
+  render: function() {
+    var HTML = this.template(this.JSON);
+
+    this.$el.html(HTML);
+    this.beforeDestination.after(this.el);
+  },
+
+  hide: function() {
+    this.$('div.toolbar').toggleClass('hidden', true);
+  },
+
+  show: function() {
+    this.$('div.toolbar').toggleClass('hidden', false);
+  }
+});
+
 var CanvasTerminalHolder = BaseView.extend({
   tagName: 'div',
   className: 'canvasTerminalHolder box flex1',
@@ -9700,6 +9736,7 @@ exports.ZoomAlertWindow = ZoomAlertWindow;
 exports.ConfirmCancelTerminal = ConfirmCancelTerminal;
 
 exports.CanvasTerminalHolder = CanvasTerminalHolder;
+exports.LevelToolbar = LevelToolbar;
 
 
 });
@@ -15123,7 +15160,6 @@ var CommandLineHistoryView = Backbone.View.extend({
     var toDestroy = [];
 
     this.collection.each(function(command) {
-      console.log('this command', command, command.get('status'));
       if (command.get('status') !== 'inqueue' &&
           command.get('status') !== 'processing') {
         toDestroy.push(command);
@@ -19332,7 +19368,6 @@ var CommandLineHistoryView = Backbone.View.extend({
     var toDestroy = [];
 
     this.collection.each(function(command) {
-      console.log('this command', command, command.get('status'));
       if (command.get('status') !== 'inqueue' &&
           command.get('status') !== 'processing') {
         toDestroy.push(command);
@@ -19721,6 +19756,42 @@ var ZoomAlertWindow = Backbone.View.extend({
   }
 });
 
+var LevelToolbar = BaseView.extend({
+  tagName: 'div',
+  template: _.template($('#level-toolbar-template').html()),
+
+  initialize: function(options) {
+    options = options || {};
+    this.JSON = {
+      levelName: options.levelName || 'Some level! (unknown name)'
+    };
+
+    this.beforeDestination = $($('#commandLineHistory div.toolbar')[0]);
+    this.render();
+
+    if (!options.wait) {
+      process.nextTick(_.bind(function() {
+        this.show();
+      }, this));
+    }
+  },
+
+  render: function() {
+    var HTML = this.template(this.JSON);
+
+    this.$el.html(HTML);
+    this.beforeDestination.after(this.el);
+  },
+
+  hide: function() {
+    this.$('div.toolbar').toggleClass('hidden', true);
+  },
+
+  show: function() {
+    this.$('div.toolbar').toggleClass('hidden', false);
+  }
+});
+
 var CanvasTerminalHolder = BaseView.extend({
   tagName: 'div',
   className: 'canvasTerminalHolder box flex1',
@@ -19773,6 +19844,7 @@ exports.ZoomAlertWindow = ZoomAlertWindow;
 exports.ConfirmCancelTerminal = ConfirmCancelTerminal;
 
 exports.CanvasTerminalHolder = CanvasTerminalHolder;
+exports.LevelToolbar = LevelToolbar;
 
 
 });

src/index.html

@@ -90,6 +90,15 @@
       </div>
   </script>
 
+  <script type="text/html" id="level-toolbar-template">
+    <div class="toolbar level-toolbar box vertical transitionAll hidden">
+      <div>
+        <i class="icon-bolt"></i>
+          You are on level <%= levelName %>
+      </div>
+    </div>
+  </script>
+
   <script type="text/html" id="modal-view-template">
     <div class="contentHolder box vertical center flex1">
     </div>

src/js/views/commandViews.js

@@ -331,7 +331,6 @@ var CommandLineHistoryView = Backbone.View.extend({
     var toDestroy = [];
 
     this.collection.each(function(command) {
-      console.log('this command', command, command.get('status'));
       if (command.get('status') !== 'inqueue' &&
           command.get('status') !== 'processing') {
         toDestroy.push(command);

src/js/views/index.js

@@ -341,6 +341,42 @@ var ZoomAlertWindow = Backbone.View.extend({
   }
 });
 
+var LevelToolbar = BaseView.extend({
+  tagName: 'div',
+  template: _.template($('#level-toolbar-template').html()),
+
+  initialize: function(options) {
+    options = options || {};
+    this.JSON = {
+      levelName: options.levelName || 'Some level! (unknown name)'
+    };
+
+    this.beforeDestination = $($('#commandLineHistory div.toolbar')[0]);
+    this.render();
+
+    if (!options.wait) {
+      process.nextTick(_.bind(function() {
+        this.show();
+      }, this));
+    }
+  },
+
+  render: function() {
+    var HTML = this.template(this.JSON);
+
+    this.$el.html(HTML);
+    this.beforeDestination.after(this.el);
+  },
+
+  hide: function() {
+    this.$('div.toolbar').toggleClass('hidden', true);
+  },
+
+  show: function() {
+    this.$('div.toolbar').toggleClass('hidden', false);
+  }
+});
+
 var CanvasTerminalHolder = BaseView.extend({
   tagName: 'div',
   className: 'canvasTerminalHolder box flex1',
@@ -393,4 +429,5 @@ exports.ZoomAlertWindow = ZoomAlertWindow;
 exports.ConfirmCancelTerminal = ConfirmCancelTerminal;
 
 exports.CanvasTerminalHolder = CanvasTerminalHolder;
+exports.LevelToolbar = LevelToolbar;
 

src/style/main.css

@@ -140,7 +140,7 @@ div.canvasTerminalHolder {
 }
 
 div.canvasTerminalHolder > div.terminal-window-holder {
-  margin: 50px 0;
+  margin: 100px 0;
   height: 100%;
   -webkit-transform: translate3d(0,0,0);
 }
@@ -204,6 +204,17 @@ div.toolbar {
   -webkit-box-pack: center;
 }
 
+div.toolbar.level-toolbar {
+  background-image: -webkit-linear-gradient(top, #79F179, #29EE31);
+  border-radius: 0;
+  height: 50px;
+}
+
+div.toolbar.level-toolbar.hidden {
+  opacity: 0;
+  height: 0px;
+}
+
 div.toolbar > div.controls {
   position: absolute;
   top: 9px;