Add warnings if the users selects the Service Worker mode.

It's still unstable for now (see #145). If the user confirms he wants to use this mode, a cookie is set, so that he is not warned again in the next 24 hours
kiwix · Apr 29, 2016 · ef269f1 · ef269f1
1 parent 344c84d
commit ef269f1
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 5 deletions.
diff --git a/www/index.html b/www/index.html
@@ -212,9 +212,9 @@ <h2>Configuration</h2>
                     </div>
                     <div id="contentInjectionModeDiv">
                         Content injection mode : <br/>
-                        <input type="radio" name="contentInjectionMode" value="jquery" id="jQueryModeRadio" checked><label for="jQueryModeRadio">JQuery</label>
+                        <input type="radio" name="contentInjectionMode" value="jquery" id="jQueryModeRadio" checked><label for="jQueryModeRadio">JQuery</label> (slow and memory hungry, but safer)
                         <br>
-                        <input type="radio" name="contentInjectionMode" value="serviceworker" id="serviceworkerModeRadio"><label for="serviceworkerModeRadio">ServiceWorker</label>
+                        <input type="radio" name="contentInjectionMode" value="serviceworker" id="serviceworkerModeRadio"><label for="serviceworkerModeRadio">ServiceWorker</label> (faster but unstable, and not supported by all platforms)
                     </div>
                     <div id="serviceWorkerStatus"></div>
                     <div id="messageChannelStatus"></div>

diff --git a/www/js/app.js b/www/js/app.js
@@ -255,9 +255,15 @@ define(['jquery', 'abstractBackend', 'util', 'uiUtil', 'cookies','geometry','osa
         return false;
     });
     $('input:radio[name=contentInjectionMode]').on('change', function(e) {
-        // Do the necessary to enable or disable the Service Worker
-        setContentInjectionMode(this.value);
-        checkSelectedArchiveCompatibilityWithInjectionMode();
+        if (checkWarnServiceWorkerMode(this.value)) {
+            // Do the necessary to enable or disable the Service Worker
+            setContentInjectionMode(this.value);
+            checkSelectedArchiveCompatibilityWithInjectionMode();
+        }
+        else {
+            setContentInjectionMode('jquery');
+        }
+
     });
 
     /**
@@ -377,6 +383,34 @@ define(['jquery', 'abstractBackend', 'util', 'uiUtil', 'cookies','geometry','osa
         return true;
     }
 
+    /**
+     * If the ServiceWorker mode is selected, warn the user before activating it
+     * @param chosenContentInjectionMode The mode that the user has chosen
+     */
+    function checkWarnServiceWorkerMode(chosenContentInjectionMode) {
+        if (chosenContentInjectionMode === 'serviceworker' && !cookies.hasItem("warnedServiceWorkerMode")) {
+            // The user selected the "serviceworker" mode, which is still unstable
+            // So let's display a warning to the user
+
+            // If the focus is on the search field, we have to move it,
+            // else the keyboard hides the message
+            if ($("#prefix").is(":focus")) {
+                $("searchTitles").focus();
+            }
+            if (confirm("The 'Service Worker' mode is still UNSTABLE for now."
+                + " It happens that the application needs to be reinstalled (or the ServiceWorker manually removed)."
+                + " Please confirm with OK that you're ready to face this kind of bugs, or click Cancel to stay in 'jQuery' mode.")) {
+                // We will not display this warning again for one day
+                cookies.setItem("warnedServiceWorkerMode", true, 86400);
+                return true;
+            }
+            else {
+                return false;
+            }
+        }
+        return true;
+    }
+
     // At launch, we try to set the last content injection mode (stored in a cookie)
     var lastContentInjectionMode = cookies.getItem('lastContentInjectionMode');
     if (lastContentInjectionMode) {