PWA: manifest.json, Service Worker, Meta-Tags und README-Hinweis hinzugefügt
This commit is contained in:
@@ -97,6 +97,14 @@ Starte mit:
|
|||||||
docker-compose up --build
|
docker-compose up --build
|
||||||
```
|
```
|
||||||
|
|
||||||
|
## Progressive Web App (PWA)
|
||||||
|
|
||||||
|
Elpatrons Datumsrechner ist als PWA installierbar (z.B. auf Android/iOS-Homescreen oder Desktop). Die App funktioniert offline für die Startseite und statische Ressourcen, die Datumsberechnung bleibt serverseitig.
|
||||||
|
|
||||||
|
- Manifest und Service Worker sind integriert
|
||||||
|
- App-Icon und Theme-Color für Homescreen
|
||||||
|
- Installation über Browser-Menü ("Zum Startbildschirm hinzufügen")
|
||||||
|
|
||||||
## Entwicklung & Hinweise
|
## Entwicklung & Hinweise
|
||||||
|
|
||||||
- Die HTML-Templates liegen im Ordner `templates/` (Trennung von Logik und Darstellung)
|
- Die HTML-Templates liegen im Ordner `templates/` (Trennung von Logik und Darstellung)
|
||||||
|
14
static/manifest.json
Normal file
14
static/manifest.json
Normal file
@@ -0,0 +1,14 @@
|
|||||||
|
{
|
||||||
|
"name": "Elpatrons Datumsrechner",
|
||||||
|
"short_name": "Datumsrechner",
|
||||||
|
"start_url": "/",
|
||||||
|
"display": "standalone",
|
||||||
|
"background_color": "#2563eb",
|
||||||
|
"theme_color": "#2563eb",
|
||||||
|
"description": "Open Source Web-App für Kalender- und Datumsberechnungen.",
|
||||||
|
"icons": [
|
||||||
|
{ "src": "/favicon.png", "sizes": "32x32", "type": "image/png" },
|
||||||
|
{ "src": "/favicon.ico", "sizes": "48x48 64x64 128x128 256x256", "type": "image/x-icon" },
|
||||||
|
{ "src": "/logo.svg", "sizes": "any", "type": "image/svg+xml" }
|
||||||
|
]
|
||||||
|
}
|
20
static/service-worker.js
Normal file
20
static/service-worker.js
Normal file
@@ -0,0 +1,20 @@
|
|||||||
|
const CACHE_NAME = 'datumsrechner-cache-v1';
|
||||||
|
const urlsToCache = [
|
||||||
|
'/',
|
||||||
|
'/static/style.css',
|
||||||
|
'/favicon.ico',
|
||||||
|
'/favicon.png',
|
||||||
|
'/logo.svg',
|
||||||
|
];
|
||||||
|
self.addEventListener('install', event => {
|
||||||
|
event.waitUntil(
|
||||||
|
caches.open(CACHE_NAME)
|
||||||
|
.then(cache => cache.addAll(urlsToCache))
|
||||||
|
);
|
||||||
|
});
|
||||||
|
self.addEventListener('fetch', event => {
|
||||||
|
event.respondWith(
|
||||||
|
caches.match(event.request)
|
||||||
|
.then(response => response || fetch(event.request))
|
||||||
|
);
|
||||||
|
});
|
@@ -20,6 +20,8 @@
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<link rel="icon" type="image/x-icon" href="/favicon.ico">
|
<link rel="icon" type="image/x-icon" href="/favicon.ico">
|
||||||
<link rel="stylesheet" href="/static/style.css">
|
<link rel="stylesheet" href="/static/style.css">
|
||||||
|
<link rel="manifest" href="/static/manifest.json">
|
||||||
|
<meta name="theme-color" content="#2563eb">
|
||||||
<script>
|
<script>
|
||||||
function setToday(id) {
|
function setToday(id) {
|
||||||
const today = new Date().toISOString().split('T')[0];
|
const today = new Date().toISOString().split('T')[0];
|
||||||
@@ -36,6 +38,11 @@
|
|||||||
document.addEventListener('DOMContentLoaded', function() {
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
openAccordion(parseInt("{{ active_idx|default(0) }}"));
|
openAccordion(parseInt("{{ active_idx|default(0) }}"));
|
||||||
});
|
});
|
||||||
|
if ('serviceWorker' in navigator) {
|
||||||
|
window.addEventListener('load', function() {
|
||||||
|
navigator.serviceWorker.register('/static/service-worker.js');
|
||||||
|
});
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
Reference in New Issue
Block a user