Adding review reminder banner

Appears every 5 loads of settings page, and if the user hasn't dismissed it

settings.html

@@ -90,6 +90,15 @@
         color: #3174f1;
       }
 
+      /* NOTIFICATIONS */
+      #notificationBanner {
+        display: none;
+        background-color: #f8f3d6;
+        font-size: .9em;
+        line-height: 1.2em;
+        padding: 1em;
+      }
+
       /* GLOBAL SETTINGS SECTION */
       .options {
         margin: 0 auto;
@@ -271,6 +280,17 @@
           >Source&nbsp;Code</a
         >
       </div>
+      <div id="notificationBanner">
+        Enjoying Indie Wiki Buddy? Please leave a review!
+        <br />
+        <a target="_blank" href="https://chrome.google.com/webstore/detail/indie-wiki-buddy/fkagelmloambgokoeokbpihmgpkbgbfm">Chrome</a>
+        &nbsp;&nbsp;|&nbsp;&nbsp;
+        <a target="_blank" href="https://addons.mozilla.org/en-US/firefox/addon/indie-wiki-buddy/">Firefox</a>
+        &nbsp;&nbsp;|&nbsp;&nbsp;
+        <a id="hideReviewReminderLink" href="#">Hide this message</a>
+        <br /><br />
+        Having issues or ideas for improvement? Please <a href="https://getindie.wiki/#contact">contact me</a>!
+      </div>
       <div id="content">
         <h2>Global settings</h2>
         <div class="options">

settings.js

@@ -436,6 +436,27 @@ function setBreezeWiki(setting) {
 
 // Main function that runs on-load
 document.addEventListener('DOMContentLoaded', function () {
+  // Count number of times settings have been opened
+  // Purposefully using local storage instead of sync
+  chrome.storage.local.get({ 'countSettingsOpened': 0 }, function (item) {
+    const countSettingsOpened = item.countSettingsOpened;
+    chrome.storage.local.set({ 'countSettingsOpened': countSettingsOpened + 1 });
+
+    // Show review reminder every 5 opens,
+    // and if the banner hasn't been previously dismissed
+    chrome.storage.local.get({ 'hideReviewReminder': false }, function (item) {
+      if (!item.hideReviewReminder && ((countSettingsOpened - 1) % 5 === 0)) {
+        document.getElementById('notificationBanner').style.display = 'block';
+
+        // Hide review reminder if user clicks 'hide' link:
+        document.getElementById('hideReviewReminderLink').addEventListener('click', function () {
+          chrome.storage.local.set({ 'hideReviewReminder': true });
+          document.getElementById('notificationBanner').style.display = 'none';
+        });      
+      }
+    });
+  });
+
   // Adding version to popup:
   const version = chrome.runtime.getManifest().version;
   document.getElementById('version').textContent = 'v' + version;