Add manifest.json | Include a Service Worker for PWA

.gitignore

@@ -9,3 +9,4 @@ class.pdf
 class.tex
 .idea/
 media/
+node_modules
\ No newline at end of file

.idea/jsLibraryMappings.xml

 <?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
   <component name="JavaScriptLibraryMappings">
-    <file url="file://$PROJECT_DIR$" libraries="{jquery-3.2.1}" />
+    <file url="file://$PROJECT_DIR$" libraries="{jquery-3.2.1, materialize}" />
   </component>
 </project>
\ No newline at end of file

.idea/school-apps.iml

@@ -21,6 +21,7 @@
     <orderEntry type="sourceFolder" forTests="false" />
     <orderEntry type="library" name="jquery-3.2.1" level="application" />
     <orderEntry type="module" module-name="bwinf-36-2" />
+    <orderEntry type="library" name="materialize" level="application" />
   </component>
   <component name="TemplatesService">
     <option name="TEMPLATE_CONFIGURATION" value="Django" />

schoolapps/schoolapps/urls.py

@@ -13,12 +13,26 @@ Including another URLconf
     1. Import the include() function: from django.urls import include, path
     2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))
 """
+import os
+
 from django.conf.urls import include
 from django.contrib import admin
+from django.contrib.staticfiles.views import serve
 from django.urls import path
 from django.conf.urls.static import static
 from django.conf import settings
 
+from schoolapps.settings import BASE_DIR
+
+
+def manifest(request):
+    return serve(request, "manifest.json")
+
+
+def serviceworker(request):
+    return serve(request, "common/pwabuilder-sw.js")
+
+
 urlpatterns = [
     #############
     # Dashboard #
@@ -50,6 +64,9 @@ urlpatterns = [
     #########
     path('settings/', include('dbsettings.urls')),
     path('admin/', admin.site.urls),
+
+    # path("manifest.json", manifest),
+    path("pwabuilder-sw.js", serviceworker)
 ]
 
 urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

schoolapps/static/common/manifest.json

+{
+  "dir": "ltr",
+  "lang": "de",
+  "name": "SchoolApps – Katharineum zu Lübeck",
+  "scope": "",
+  "display": "browser",
+  "start_url": "https://info.katharineum.de/",
+  "short_name": "SchoolApps",
+  "theme_color": "#da1f3d",
+  "description": "",
+  "orientation": "portrait",
+  "background_color": "#ffffff",
+  "related_applications": [],
+  "prefer_related_applications": false,
+  "icons": [
+    {
+      "src": "/static/images/86844799-71f8-10c1-e7d7-796910f44e77.webPlatform.png",
+      "sizes": "44x44",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/532d1325-f176-0008-3964-343a1bcd5935.webPlatform.png",
+      "sizes": "48x48",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/04f528db-0b01-8c14-7762-7a69810d1265.webPlatform.png",
+      "sizes": "1240x600",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/e677beba-e9e4-3000-bca6-c8539dbf74e4.webPlatform.png",
+      "sizes": "300x300",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/aa11bd3d-260b-c276-1c09-b767ac224f2e.webPlatform.png",
+      "sizes": "150x150",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/8dde8463-278d-5c78-b2f6-f342b026e965.webPlatform.png",
+      "sizes": "88x88",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/5d6e255c-1240-2653-ec44-0ea01bff39e6.webPlatform.png",
+      "sizes": "24x24",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/9bba1bae-17fb-2975-9edf-a0a90f3a54eb.webPlatform.png",
+      "sizes": "50x50",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/d61086e1-4929-90e8-088a-129e4d16b0fa.webPlatform.png",
+      "sizes": "620x300",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/6f985a9c-e48a-0035-52b5-4c4b28b8c16d.webPlatform.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/eaf673aa-e19a-74b4-33c0-d38154cd1b18.webPlatform.png",
+      "sizes": "144x144",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/ffdd263d-816e-c2ef-5978-2377f85c42b9.webPlatform.png",
+      "sizes": "96x96",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/5e034d01-f259-28a7-7cad-cda2b2758636.webPlatform.png",
+      "sizes": "72x72",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/33f6c523-376b-7ee2-4847-cb0e750c3642.webPlatform.png",
+      "sizes": "36x36",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/09ec9d1a-7f1a-25e5-97b3-96b90712cc60.webPlatform.png",
+      "sizes": "1024x1024",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/061e9652-06e6-8446-46e3-819674db9979.webPlatform.png",
+      "sizes": "180x180",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/982059a6-7527-5086-5334-b0252e562f97.webPlatform.png",
+      "sizes": "152x152",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/2d819cff-1e82-fcfb-e85a-6090d6b472eb.webPlatform.png",
+      "sizes": "120x120",
+      "type": "image/png"
+    },
+    {
+      "src": "/static/images/8fc2ae6f-6af5-d172-da72-af62f93bc5c0.webPlatform.png",
+      "sizes": "76x76",
+      "type": "image/png"
+    }
+  ]
+}
\ No newline at end of file

schoolapps/static/common/manup.min.js

+var manUpObject,tagArray=[],linkArray=[],validMetaValues=[{name:"mobile-web-app-capable",manifestName:"display"},{name:"apple-mobile-web-app-capable",manifestName:"display"},{name:"apple-mobile-web-app-title",manifestName:"short_name"},{name:"application-name",manifestName:"short_name"},{name:"msapplication-TileColor",manifestName:"ms_TileColor"},{name:"msapplication-square70x70logo",manifestName:"icons",imageSize:"70x70"},{name:"msapplication-square150x150logo",manifestName:"icons",imageSize:"150x150"},{name:"msapplication-wide310x150logo",manifestName:"icons",imageSize:"310x150"},{name:"msapplication-square310x310logo",manifestName:"icons",imageSize:"310x310"}],validLinkValues=[{name:"apple-touch-icon",manifestName:"icons",imageSize:"152x152"},{name:"apple-touch-icon",manifestName:"icons",imageSize:"120x120"},{name:"apple-touch-icon",manifestName:"icons",imageSize:"76x76"},{name:"apple-touch-icon",manifestName:"icons",imageSize:"60x60"},{name:"apple-touch-icon",manifestName:"icons",imageSize:"57x57"},{name:"apple-touch-icon",manifestName:"icons",imageSize:"72x72"},{name:"apple-touch-icon",manifestName:"icons",imageSize:"114x114"},{name:"icon",manifestName:"icons",imageSize:"128x128"},{name:"icon",manifestName:"icons",imageSize:"192x192"}],generateFullMetaData=function(){for(var e=0;e<validMetaValues.length;e++)if(manUpObject[validMetaValues[e].manifestName])if("icons"==validMetaValues[e].manifestName)for(var a=manUpObject.icons,n=0;n<a.length;n++)a[n].sizes==validMetaValues[e].imageSize&&(validMetaValues[e].content=a[n].src);else validMetaValues[e].content=manUpObject[validMetaValues[e].manifestName],"display"==validMetaValues[e].manifestName&&"standalone"==manUpObject.display&&(validMetaValues[e].content="yes");return validMetaValues},generateFullLinkData=function(){for(var e=0;e<validLinkValues.length;e++)if(manUpObject[validLinkValues[e].manifestName])if("icons"==validLinkValues[e].manifestName)for(var a=manUpObject.icons,n=0;n<a.length;n++)a[n].sizes==validLinkValues[e].imageSize&&(validLinkValues[e].content=a[n].src);else validLinkValues[e].content=manUpObject[validLinkValues[e].manifestName];return validLinkValues},generateMetaArray=function(){for(var e=generateFullMetaData(),a=document.getElementsByTagName("head")[0],n=0;n<e.length;n++){var i=document.createElement("meta");i.name=e[n].name,i.content=e[n].content,a.appendChild(i)}},generateLinkArray=function(){for(var e=generateFullLinkData(),a=document.getElementsByTagName("head")[0],n=0;n<e.length;n++){var i=document.createElement("link");i.setAttribute("rel",e[n].name),i.setAttribute("sizes",e[n].imageSize),i.setAttribute("href",e[n].content),a.appendChild(i)}},generateObj=function(e){manUpObject=JSON.parse(e),generateLinkArray(),generateMetaArray()},makeAjax=function(e){if(window.XMLHttpRequest){var a,n=/^https?:\/\//i;n.test(e)?fulURL=e:a=window.location.hostname+e;var i=new XMLHttpRequest;i.onreadystatechange=function(){4==i.readyState&&200==i.status&&generateObj(i.responseText)},i.open("GET",e,!0),i.send()}},collectManifestObj=function(){for(var e=document.getElementsByTagName("link"),a=0;a<e.length;a++)e[a].rel&&"manifest"==e[a].rel&&makeAjax(e[a].href)},testForManifest=function(){collectManifestObj()}();
\ No newline at end of file

schoolapps/static/common/pwabuilder-sw-register.js

+//This is the "Offline copy of pages" service worker
+
+//Add this below content to your HTML page, or add the js file to your page at the very top to register service worker
+if (navigator.serviceWorker.controller) {
+    console.log('[PWA Builder] active service worker found, no need to register')
+} else {
+    //Register the ServiceWorker
+    navigator.serviceWorker.register('pwabuilder-sw.js', {
+        scope: './'
+    }).then(function (reg) {
+        console.log('Service worker has been registered for scope:' + reg.scope);
+    });
+}
+

schoolapps/static/common/pwabuilder-sw.js

+//This is the "Offline copy of pages" service worker
+
+//Install stage sets up the index page (home page) in the cache and opens a new cache
+self.addEventListener('install', function (event) {
+    var indexPage = new Request('/');
+    event.waitUntil(
+        fetch(indexPage).then(function (response) {
+            return caches.open('pwabuilder-offline').then(function (cache) {
+                console.log('[PWA Builder] Cached index page during Install' + response.url);
+                return cache.put(indexPage, response);
+            });
+        }));
+});
+
+//If any fetch fails, it will look for the request in the cache and serve it from there first
+self.addEventListener('fetch', function (event) {
+    var updateCache = function (request) {
+        return caches.open('pwabuilder-offline').then(function (cache) {
+            return fetch(request).then(function (response) {
+                console.log('[PWA Builder] add page to offline' + response.url)
+                return cache.put(request, response);
+            });
+        });
+    };
+
+    event.waitUntil(updateCache(event.request));
+
+    event.respondWith(
+        fetch(event.request).catch(function (error) {
+            console.log('[PWA Builder] Network request Failed. Serving content from cache: ' + error);
+
+            //Check to see if you have it in the cache
+            //Return response
+            //If not in the cache, then return error page
+            return caches.open('pwabuilder-offline').then(function (cache) {
+                return cache.match(event.request).then(function (matching) {
+                    var report = !matching || matching.status === 404 ? Promise.reject('no-match') : matching;
+                    return report
+                });
+            });
+        })
+    );
+})