Add PWA support: implement service worker, cache assets, and add offline functionality

_config.yml

@@ -1,17 +1,5 @@
 # Welcome to Jekyll!
 #
-# This config file is meant for settings that affect your whole blog, values
-# which you are expected to set up once and rarely edit after that. If you find
-# yourself editing this file very often, consider using Jekyll's data files
-# feature for the data you need to update frequently.
-#
-# For technical reasons, this file is *NOT* reloaded automatically when you use
-# 'bundle exec jekyll serve'. If you change this file, please restart the server process.
-#
-# If you need help with YAML syntax, here are some quick references for you:
-# https://learn-the-web.algonquindesign.ca/topics/markdown-yaml-cheat-sheet/#yaml
-# https://learnxinyminutes.com/docs/yaml/
-#
 # Site settings
 # These are used to personalize your new site. If you look in the HTML files,
 # you will see them accessed via {{ site.title }}, {{ site.email }}, and so on.
@@ -22,8 +10,8 @@ title: ThePhoenixDivision
 email: contact@morlana.net
 description: >-
   We will share our adventures in Cyberpunk Red here.
-baseurl: "/cpred" # the subpath of your site, e.g. /blog
-url: "https://phoenixdivision.morlana.space" # the base hostname & protocol for your site, e.g. http://example.com
+baseurl: "/cpred"
+url: "https://phoenixdivision.morlana.space"
 twitter_username: abc
 github_username:  abc
 
@@ -43,23 +31,3 @@ collections:
 footer_links:
   - title: "Impressum"
     url: "https://legal.thephoenixdi.vision"
-
-# Exclude from processing.
-# The following items will not be processed, by default.
-# Any item listed under the `exclude:` key here will be automatically added to
-# the internal "default list".
-#
-# Excluded items can be processed by explicitly listing the directories or
-# their entries' file path in the `include:` list.
-#
-# exclude:
-#   - .sass-cache/
-#   - .jekyll-cache/
-#   - gemfiles/
-#   - Gemfile
-#   - Gemfile.lock
-#   - node_modules/
-#   - vendor/bundle/
-#   - vendor/cache/
-#   - vendor/gems/
-#   - vendor/ruby/

_layouts/default.html

@@ -11,7 +11,7 @@
   {% include footer.html %}
   <script>
     if ('serviceWorker' in navigator) {
-      navigator.serviceWorker.register("{{ /assets/js/service-worker.js | relative_url }}")
+      navigator.serviceWorker.register("{{ '/assets/js/service-worker.js' | relative_url }}")
         .then(() => console.log("✅ Service Worker registriert"))
         .catch(error => console.log("❌ Service Worker Fehler:", error));
     }

assets/js/service-worker.js.html

@@ -1,26 +1,31 @@
+---
+permalink: /assets/js/service-worker.js
+---
+
 const CACHE_NAME = "cyberpunk-cache-v1";
 const OFFLINE_URL = "/offline.html"; // Diese Seite wird angezeigt, wenn offline
+const BASE_PATH = "{{ "/" | relative_url }}";
 
 const urlsToCache = [
-  "/",
-  "/offline.html",
+  BASE_PATH,
+  BASE_PATH + "/offline.html",
   /* CSS-Dateien */
-  "/assets/css/main.css",
-  "/assets/css/normalize.css",
-  "/assets/css/cyberpunk.css",
+  BASE_PATH + "/assets/css/main.css",
+  BASE_PATH + "/assets/css/normalize.css",
+  BASE_PATH + "/assets/css/cyberpunk.css",
   /* JS-Dateien */
-  "/assets/js/materialize.min.js",
-  "/assets/js/service-worker.js",
+  BASE_PATH + "/assets/js/materialize.min.js",
+  BASE_PATH + "/assets/js/service-worker.js",
   /* PWA-Dateien */
-  "/assets/manifest.json",
-  "/assets/img/icon-192.png",
-  "/assets/img/icon-512.png",
+  BASE_PATH + "/assets/manifest.json",
+  BASE_PATH + "/assets/img/icon-192.png",
+  BASE_PATH + "/assets/img/icon-512.png",
   /* Bilder, Schriften, etc. */
-  "/assets/fonts/BlenderProBook.woff2",
-  "/assets/fonts/Cyberpunk.otf",
-  "/assets/fonts/Oxanium.woff2",
-  "/assets/img/Netrunner.png",
-  "/assets/img/Tech.png",
+  BASE_PATH + "/assets/fonts/BlenderProBook.woff2",
+  BASE_PATH + "/assets/fonts/Cyberpunk.otf",
+  BASE_PATH + "/assets/fonts/Oxanium.woff2",
+  BASE_PATH + "/assets/img/Netrunner.png",
+  BASE_PATH + "/assets/img/Tech.png",
 ];
 
 // Installations-Event: Dateien werden in den Cache geladen