Move from Zebra striping to click-to-highlight

kappa123/client/static/main.css

@@ -23,7 +23,7 @@
     width: 30%;
 }
 
-.the_table tr:nth-child(even) {
+.the_table tr.selected {
     background-color: #efefef;
 }
 

kappa123/client/static/main.js

@@ -1,5 +1,12 @@
 // custom javascript
 
-$( document ).ready(function() {
-  console.log('Sanity Check!');
-});
+var elements = document.getElementsByClassName('run');
+for (idx in elements) {
+    var element = elements[idx];
+    element.onclick = toggleRow;
+}
+
+function toggleRow(e) {
+    var row = e.currentTarget;
+    row.className == "run selected" ? row.className = "run" : row.className = "run selected"
+}

kappa123/client/templates/main/home.html

@@ -13,7 +13,7 @@
                 <th scope="col">Runners</th>
             </tr>
             {% for run in runs %}
-            <tr class="{{run["class"]}}">
+            <tr class="run {{run["class"]}}">
                 <td>{{run["time"]}} &rarr; {{run["estimate"]}}</td>
                 <td>{{run["name"]}} <span class="de-emphasis">{{run["category"]}}</span></td>
                 <td>{{run["runners"]}}</td>