now with toggling also, full functionality pretty much present

src/index.html

@@ -109,14 +109,15 @@
   </script>
 
   <script type="text/html" id="interactive-rebase-entry-template">
-    <li id="<%= id %>">
+    <li id="<%= id %>" class="rebaseEntry">
       <div class="wrapper">
-          <%= id %>
-        <div>
-          Options: Pick, Choose, Etc
-        </div>
-
         <i class="icon-align-justify"></i>
+        <span class="idwrapper">
+          <%= id %>
+        </span>
+        <a id="toggleButton" class="uiButton uiButtonPink">
+          Toggle Pick
+        </a>
       </div>
     </li>
   </script>

src/miscViews.js

@@ -101,21 +101,28 @@ var RebaseEntryView = Backbone.View.extend({
   tagName: 'li',
   template: _.template($('#interactive-rebase-entry-template').html()),
 
-  events: {
-    'click #toggleButton': 'toggle'
-  },
-
   toggle: function() {
     this.model.toggle();
+    
+    // toggle a class also
+    this.listEntry.toggleClass('notPicked', !this.model.get('pick'));
   },
 
   initialize: function(options) {
-    this.model.on('change', this.render, this);
     this.render();
   },
 
   render: function() {
     this.$el.append(this.template(this.model.toJSON()));
+    
+    // have to build some of this stuff up manually, lame.
+    // backbone needs a collectionview, this is ugly
+    var id = '#' + this.model.get('id');
+    this.listEntry = this.$(id);
+
+    this.$(id + ' #toggleButton').on('click', _.bind(function() {
+      this.toggle();
+    }, this));
   }
 });
 

src/style/main.css

@@ -325,6 +325,15 @@ p.commandLine span.prompt {
   cursor: pointer;
 }
 
+li.rebaseEntry {
+  margin: 10px;
+  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
+}
+
+li.rebaseEntry.notPicked {
+  opacity: 0.2;
+}
+
 /* button stuff from liquidGraph */
 .uiButton {
   border-top: 1px solid #96d1f8;