Refactor homepage and error templates, add service worker and manifest for PWA support

9 files changed, 89 insertions, 31 deletions

diff --git a/router/base.go b/router/base.go
index b178d50..aaeaad3 100644
--- a/router/base.go
+++ b/router/base.go
@@ -12,6 +12,6 @@ func init() {
 	urls.SetNamespace("")
 
 	urls.Path(types.GET, "/", func(c *fiber.Ctx) error {
-		return shortcuts.Render(c, "pages/home", nil)
+		return shortcuts.Render(c, "pages/main", fiber.Map{})
 	}, "home")
 }
diff --git a/scripts/reset.db.sh b/scripts/reset.db.sh
index 9c4a366..9c4a366 100644..100755
--- a/scripts/reset.db.sh
+++ b/scripts/reset.db.sh
diff --git a/static/js/app.js b/static/js/app.js
new file mode 100644
index 0000000..f1ec61e
--- /dev/null
+++ b/static/js/app.js
@@ -0,0 +1,23 @@
+if ('serviceWorker' in navigator) {
+    window.addEventListener('load', () => {
+        navigator.serviceWorker.register('/worker.js')
+            .then(registration => {
+                console.log('ServiceWorker registered:', registration);
+            })
+            .catch(error => {
+                console.log('ServiceWorker registration failed:', error);
+            });
+    });
+}
+
+let deferredPrompt;
+window.addEventListener('beforeinstallprompt', (e) => {
+    e.preventDefault();
+    deferredPrompt = e;
+});
+
+document.body.addEventListener('htmx:afterSwap', (event) => {
+    event.detail.elt.querySelectorAll('.animate-slide-up').forEach((el, i) => {
+        el.style.animationDelay = `${i * 0.1}s`;
+    });
+});
\ No newline at end of file
diff --git a/static/js/worker.js b/static/js/worker.js
new file mode 100644
index 0000000..84d94df
--- /dev/null
+++ b/static/js/worker.js
@@ -0,0 +1,22 @@
+const CACHE_NAME = 'cafe';
+const urlsToCache = [
+    '/',
+    '/static/css/style.css',
+    '/static/js/htmx.min.js',
+    '/static/js/app.js',
+    '/static/manifest.json'
+];
+
+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))
+    );
+});
\ No newline at end of file
diff --git a/static/manifest.json b/static/manifest.json
new file mode 100644
index 0000000..1bca313
--- /dev/null
+++ b/static/manifest.json
@@ -0,0 +1,24 @@
+{
+    "name": "Shifoo's Cafe",
+    "short_name": "Cafe",
+    "description": "A cozy place for close friends!",
+    "start_url": "/",
+    "display": "standalone",
+    "background_color": "#0a0a0f",
+    "theme_color": "#1a1a2e",
+    "orientation": "portrait-primary",
+    "icons": [
+        {
+            "src": "/static/icons/icon-192.png",
+            "sizes": "192x192",
+            "type": "image/png",
+            "purpose": "any maskable"
+        },
+        {
+            "src": "/static/icons/icon-512.png",
+            "sizes": "512x512",
+            "type": "image/png",
+            "purpose": "any maskable"
+        }
+    ]
+}
\ No newline at end of file
diff --git a/templates/error.django b/templates/error.django
index 18c86be..ae0b9b7 100644
--- a/templates/error.django
+++ b/templates/error.django
@@ -3,14 +3,5 @@
 {% block title %}{{ ErrorTitle }}{% endblock %}
 
 {% block content %}
-  <div class="min-h-screen flex items-center justify-center px-4">
-    <div class="max-w-md w-full text-center">
-      <h1 class="text-6xl font-bold text-red-500 mb-4">Error</h1>
-      <h2 class="text-2xl font-semibold mb-4">{{ ErrorTitle }}</h2>
-      <p class="text-gray-400 mb-8">{{ ErrorMessage }}</p>
-      <a href="{% url "home" %}" class="inline-block px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition">
-        Go Home
-      </a>
-    </div>
-  </div>
+   There was this error {{ ErrorTitle }}: {{ ErrorMessage }}
 {% endblock %}
\ No newline at end of file
diff --git a/templates/layouts/base.django b/templates/layouts/base.django
index be07b4a..5390e4b 100644
--- a/templates/layouts/base.django
+++ b/templates/layouts/base.django
@@ -3,17 +3,23 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>{% block title %}Shifoo's Cafe{% endblock %}</title>
+    <meta name="theme-color" content="#1e1e2e" />
+    <title>{% block title %}{{ Title }}{% endblock %}</title>
+    
+    <link rel="manifest" href="/static/manifest.json" />
     <link rel="stylesheet" href="{% static "css/style.css" %}" />
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap" rel="stylesheet">
     {% block head %}{% endblock %}
   </head>
-  <body>
-    {% block body %}
-      <main>
-        {% block content %}{% endblock %}
-      </main>
-    {% endblock %}
+  <body class="bg-[#0a0a0f] text-[#e4e4e7] font-['Inter']">
+    <div class="flex h-screen overflow-hidden">
+      {% block content %}{% endblock %}
+    </div>
+    
     <script src="{% static "js/htmx.min.js" %}"></script>
+    <script src="{% static "js/app.js" %}"></script>
     {% block scripts %}{% endblock %}
   </body>
 </html>
\ No newline at end of file
diff --git a/templates/pages/home.django b/templates/pages/home.django
deleted file mode 100644
index 7ceeae7..0000000
--- a/templates/pages/home.django
+++ /dev/null
@@ -1,13 +0,0 @@
-{% extends "layouts/base.django" %}
-
-{% block title %}{{ Title }}{% endblock %}
-
-{% block content %}
-  <div class="min-h-screen flex items-center justify-center">
-    <div class="text-center">
-      <h1 class="text-4xl font-bold mb-4">{{ AppName }}</h1>
-      <p class="text-gray-400">{{ AppDescription }}</p>
-      <p class="text-sm text-gray-500 mt-4">Request: {{ Request.Method }} {{ Request.Path }}</p>
-    </div>
-  </div>
-{% endblock %}
\ No newline at end of file
diff --git a/templates/pages/main.django b/templates/pages/main.django
new file mode 100644
index 0000000..429ffbf
--- /dev/null
+++ b/templates/pages/main.django
@@ -0,0 +1,5 @@
+{% extends "layouts/base.django" %}
+
+{% block content %}
+This will be cafe.
+{% endblock %}
\ No newline at end of file