Add check that PWA server is accessible

Former-commit-id: 951028bda064ae35242348cd3e1763abf6832995 [formerly b3bfba64b0c51492dd609b8c88e35f3c5c579ab5 [formerly 453ba374946a54a7aa74ebb4b8c70762ed09ba78]]
Former-commit-id: 2bd8d82ce289cf4614809c968b15064112f5b6b7
Former-commit-id: b9cc356a66b3db219fcdef56b18d4bd572c2cb86

pwabuilder-sw.js

@@ -4,7 +4,7 @@
 // App version number - ENSURE IT MATCHES VALUE IN init.js
 // DEV: Changing this will cause the browser to recognize that the Service Worker has changed, and it will download and
 // install a new copy
-const appVersion = '1.2.0-RP11';
+const appVersion = '1.2.0-RP12';
 
 // Kiwix ZIM Archive Download Server in regex form
 // DEV: The server URL is defined in init.js, but is not available to us in SW

www/js/app.js

@@ -1578,11 +1578,18 @@ define(['jquery', 'zimArchiveLoader', 'uiUtil', 'util', 'cache', 'images', 'sett
                                     var serverContentInjectionMode = params.allowInternetAccess ? '' : '&contentInjectionMode=serviceworker';
                                     window.location.href = params.PWAServer + 'www/index.html?allowInternetAccess=true' + serverContentInjectionMode;
                                 };
+                                var checkPWA = function () {
+                                    uiUtil.checkServerIsAccessible(params.PWAServer + 'www/img/icons/kiwix-32.png', launchPWA, function (err) {
+                                        uiUtil.systemAlert('The server is not currently accessible! ' + err +
+                                            '\n\n(Kiwix needs one-time access to the server to cache the PWA).' +
+                                            '\nPlease try again when you have a stable Internet connection.', 'Error!');
+                                    });
+                                };
                                 if (params.allowInternetAccess) {
-                                    launchPWA();
+                                    checkPWA();
                                     return;
                                 } else {
-                                    uiUtil.systemAlert(message, 'Warning!', 'Access server', launchPWA, 'Cancel', function () {
+                                    uiUtil.systemAlert(message, 'Warning!', 'Access server', checkPWA, 'Cancel', function () {
                                         document.getElementById('btnConfigure').click();
                                         return;
                                     });

www/js/init.js

@@ -49,7 +49,7 @@ var params = {};
  */
 var appstate = {};
 /******** UPDATE VERSION IN pwabuilder-sw.js TO MATCH VERSION *******/
-params['version'] = "1.2.0-RP11"; //DEV: Manually update this version when there is a new release: it is compared to the Settings Store "version" in order to show first-time info, and the cookie is updated in app.js
+params['version'] = "1.2.0-RP12"; //DEV: Manually update this version when there is a new release: it is compared to the Settings Store "version" in order to show first-time info, and the cookie is updated in app.js
 /******* UPDATE THIS ^^^^^^ IN serveice worker!! ********************/
 params['packagedFile'] = "wikipedia_en_100_maxi.zim"; //For packaged Kiwix JS (e.g. with Wikivoyage file), set this to the filename (for split files, give the first chunk *.zimaa) and place file(s) in default storage
 params['archivePath'] = "archives"; //The directory containing the packaged archive(s) (relative to app's root directory)  

www/js/lib/uiUtil.js

@@ -547,6 +547,20 @@ define(rqDef, function() {
         }
     }
 
+    /**
+     * Checks if a server is accessible by attempting to load a test image from the server
+     * 
+     * @param {String} imageSrc The full URI of the image
+     * @param {any} onSuccess A function to call if the image can be loaded
+     * @param {any} onError A function to call if the image cannot be loaded
+     */
+    function checkServerIsAccessible(imageSrc, onSuccess, onError) {
+        var image = new Image();
+        image.onload = onSuccess;
+        image.onerror = onError;
+        image.src = imageSrc;
+    }
+
     /**
      * Checks whether an element is partially or fully inside the current viewport, and adds the rect.top value to element.top
      * 
@@ -612,6 +626,7 @@ define(rqDef, function() {
         insertBreakoutLink: insertBreakoutLink,
         extractHTML: extractHTML,
         systemAlert: systemAlert,
+        checkServerIsAccessible: checkServerIsAccessible,
         htmlEscapeChars: htmlEscapeChars
     };
 });