Persist Clear Selection with some garbage code

This is getting to be a mess.

kappa123/client/static/main.js

@@ -3,10 +3,27 @@ var cacheEnabled = true;
 var persistCache = function() {
     if (cacheEnabled) {
         window.localStorage.setItem('cache', cache);
+        window.localStorage.setItem('hideUnselected', hideUnselected);
     }
 }
 
-var primeCache = function() {
+var loadPage = function() {
+    cache = [];
+
+    hideCheck = document.getElementById('showToggle');
+    hideCheck.onchange = updateHideUnselected;
+
+    // Add the row click handlers and prime the cache
+    var elements = document.getElementsByClassName('run');
+    for (var i=0; i<elements.length; i++) {
+        var element = elements[i];
+        element.onclick = toggleRow;
+
+        var id = element.id.replace("run-", "");
+        cache[id-1] = false;
+    }
+
+    // Restore the cache if you need to
     if (cacheEnabled) {
         var string = window.localStorage.getItem('cache') || "";
         var strCache = string.split(",");
@@ -15,20 +32,10 @@ var primeCache = function() {
             cache[cache.length] =  (item == 'true');
             setRowValue(cache.length, cache[cache.length-1]);
         });
-    } else {
-        cache = [];
+
+        setSelectedValue(window.localStorage.getItem('hideUnselected') || false);
     }
 }
-primeCache();
-
-var elements = document.getElementsByClassName('run');
-for (var i=0; i<elements.length; i++) {
-    var element = elements[i];
-    element.onclick = toggleRow;
-
-    var id = element.id.replace("run-", "");
-    cache[id-1] = false;
-}
 
 function getRowValue(id) {
     return cache[id-1];
@@ -47,6 +54,18 @@ function setRowValue(id, selected) {
     }
 }
 
+function setSelectedValue(val) {
+    hideUnselected=val;
+    persistCache();
+    var table = document.getElementById('the_table');
+    hideUnselected ? table.className = "hide-unselected" : table.className = "";
+    document.getElementById('showToggle').checked = hideUnselected;
+}
+
+function getSelectedValue() {
+    return hideUnselected;
+}
+
 function toggleRow(e) {
     var row = e.currentTarget;
     var id = row.id.replace("run-", "");
@@ -58,9 +77,8 @@ function toggleRow(e) {
     persistCache();
 }
 
-function updateHideUnselected() {
-    var table = document.getElementById('the_table');
-    table.className == "hide-unselected" ? table.className = "" : table.className = "hide-unselected";
+function updateHideUnselected(e) {
+    setSelectedValue(e.target.checked);
 }
 
 function clearSelection() {
@@ -69,3 +87,5 @@ function clearSelection() {
     }
     persistCache();
 }
+
+loadPage();

kappa123/client/templates/main/home.html

@@ -20,9 +20,9 @@
         </p>
 
         <label for="showToggle">Hide unselected</label>
-        <input type="checkbox" id="showToggle" onchange="updateHideUnselected()">
+        <input type="checkbox" id="showToggle" onchange=updateHideUnselected>
 
-        <button id="clearSelection" onclick="clearSelection()">Clear Selection</button>
+        <button id="clearSelection" onclick=clearSelection>Clear Selection</button>
 
         <table id="the_table">
             <tr>