Persist hiding challenges (#357)

Author: fraz3alpha

browser-extensions/common/js/content-scripts/content-script-parkrunner.js

@@ -531,7 +531,7 @@ function create_page() {
   set_progress_message("Parsed Results")
 
   set_progress_message("Loading saved data")
-  browser.storage.local.get(["home_parkrun_info", "athlete_number"]).then((items) => {
+  browser.storage.local.get(["home_parkrun_info", "athlete_number", "challengeMetadata"]).then((items) => {
     set_progress_message("Loaded saved data")
     loaded_user_data = items
     // console.log("Here is the stored items, fetched with a promise:")

browser-extensions/common/js/lib/challenges_ui.js

@@ -97,8 +97,13 @@ function get_tbody_header(challenge) {
     return $('<tbody></tbody>').attr('id', get_tbody_header_id(challenge))
 }
 
-function get_tbody_content(challenge) {
-    return $('<tbody></tbody>').attr('id', get_tbody_content_id(challenge))
+function get_tbody_content(challenge, userData) {
+  var content = $('<tbody></tbody>').attr('id', get_tbody_content_id(challenge))
+  // Find out whether this should be hidden by default when we initially draw the page
+  if (isChallengeHidden(challenge.shortname, userData)) {
+    content.hide()
+  }
+  return content
 }
 
 function get_tbody_header_id(challenge) {
@@ -137,11 +142,12 @@ function get_challenge_icon(challenge, height, width) {
 function get_challenge_header_row(challenge, data) {
 
     var main_row = $('<tr></tr>')
+    var challengeShortname = challenge.shortname
 
     var badge_img = get_challenge_icon(challenge, 24, 24)
     if (badge_img !== undefined) {
       badge_img.click(function(){
-          $("tbody[id=challenge_tbody_content_"+challenge['shortname']+"]").toggle();
+        toggleVisibilityOfChallenge(challengeShortname)
       });
     } else {
       badge_img = ''
@@ -200,7 +206,7 @@ function generateRegionnaireTableEntry(table, data) {
   }
 
   var challenge_tbody_header = get_tbody_header(challenge)
-  var challenge_tbody_detail = get_tbody_content(challenge)
+  var challenge_tbody_detail = get_tbody_content(challenge, data.user_data)
 
   // Create the header row and add it to the tbody that exists to hold
   // the title row
@@ -1353,7 +1359,7 @@ function drawRegionnaireDataTable(table, data) {
 function generate_standard_table_entry(challenge, table, data) {
 
     var challenge_tbody_header = get_tbody_header(challenge)
-    var challenge_tbody_detail = get_tbody_content(challenge)
+    var challenge_tbody_detail = get_tbody_content(challenge, data.user_data)
 
     // Create the header row and add it to the tbody that exists to hold
     // the title row
@@ -1441,3 +1447,57 @@ function add_stats_table(div, data) {
   div.append('<br/>Hover over the stats for a more detailed description')
 
 }
+
+function isChallengeHidden(challengeShortname, userData) {
+  var isHidden = false
+  console.log("userData: "+JSON.stringify(userData))
+  if (userData !== undefined) {
+    if (userData["challengeMetadata"] !== undefined && challengeShortname in userData["challengeMetadata"]) {
+      if ("hidden" in userData.challengeMetadata[challengeShortname]) {
+        isHidden = userData.challengeMetadata[challengeShortname].hidden
+        console.log("isChallengeHidden found existing saved state: "+isHidden)
+      }
+    }
+  }
+  return isHidden
+}
+
+function saveHiddenPreference(challengeName, isHidden) {
+  console.log("Challenge: "+challengeName+", Is Hidden: "+isHidden)
+
+  browser.storage.local.get({
+    challengeMetadata: {}
+  }).then((items) => {
+    // Items contains the whole object, of which the key we asked for is a sub-item
+    console.log(items)
+
+    // If the challenge already exists in the object, then set the hidden property
+    if (challengeName in items.challengeMetadata) {
+      items.challengeMetadata[challengeName]["hidden"] = isHidden
+    // Else, add a metadata object for this challenge and initialise it
+    } else {
+      var challengeMetadata = {
+        "hidden": isHidden
+      }
+      items.challengeMetadata[challengeName] = challengeMetadata
+    }
+    console.log(items.challengeMetadata)
+
+    // Save the information back into the local storage
+    browser.storage.local.set(items)
+  })
+
+}
+
+function toggleVisibilityOfChallenge(challengeShortname) {
+  var challengeBodyId = "challenge_tbody_content_"+challengeShortname
+  // console.log(challengeBodyId)
+  var challengeBodyElement = $("tbody[id="+challengeBodyId+"]")
+  // console.log(challengeBodyElement)
+  var isCurrentlyHidden = challengeBodyElement.is(":hidden")
+  // console.log("isCurrentlyHidden: "+isCurrentlyHidden)
+  // Save the preference to retain the fact it is hidden next time
+  saveHiddenPreference(challengeShortname, !isCurrentlyHidden)
+  // Toggle the visibility of the challenge now
+  challengeBodyElement.toggle()
+}