From 8386e20ca16eb91e42b5361b89844fb9dd6025bb Mon Sep 17 00:00:00 2001 From: rene Date: Sun, 19 Apr 2026 09:50:24 +0200 Subject: [PATCH] Feature: Welcome-Kacheln anklickbar + Hamburger-Puls-Effekt --- backend/static/js/app.js | 2 +- backend/static/js/pages/welcome.js | 73 +++++++++++++++++++++++------- backend/static/sw.js | 2 +- 3 files changed, 59 insertions(+), 18 deletions(-) diff --git a/backend/static/js/app.js b/backend/static/js/app.js index 24e51cd..54d264f 100644 --- a/backend/static/js/app.js +++ b/backend/static/js/app.js @@ -3,7 +3,7 @@ Router, State-Management, Navigation, Initialisierung. ============================================================ */ -const APP_VER = '204'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen +const APP_VER = '205'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen const App = (() => { diff --git a/backend/static/js/pages/welcome.js b/backend/static/js/pages/welcome.js index 94e8164..26fe3bb 100644 --- a/backend/static/js/pages/welcome.js +++ b/backend/static/js/pages/welcome.js @@ -44,10 +44,13 @@ window.Page_welcome = (() => { -
-
+
-
+
@@ -75,17 +78,19 @@ window.Page_welcome = (() => {
${[ - ['book-open', 'Tagebuch', 'Momente, Fotos und Meilensteine festhalten'], - ['syringe', 'Gesundheit', 'Impfungen, Tierarztbesuche & Medikamente'], - ['map-trifold', 'Karte & Routen', 'Hundefreundliche Orte und Spazierwege'], - ['warning-octagon','Giftköder-Alarm', 'Community-Warnungen in deiner Nähe'], - ['paw-print', 'Gassi-Treffen', 'Hunde-Dates mit anderen Besitzern'], - ['house-line', 'Sitting', 'Dogsitter finden oder selbst anbieten'], - ['target', 'Training', 'Übungen, Pläne und KI-Trainer'], - ['books', 'Wiki & Wissen', 'Rassen, Ernährung, Erste Hilfe'], - ].map(([icon, title, desc], i) => ` -
${desc}
-
+ `).join('')} @@ -258,6 +263,42 @@ window.Page_welcome = (() => { _container.querySelector('#welcome-login-btn')?.addEventListener('click', () => { App.navigate('settings'); }); + + // Feature-Kacheln → navigieren + _container.querySelectorAll('[data-nav]').forEach(btn => { + btn.addEventListener('click', () => App.navigate(btn.dataset.nav)); + btn.addEventListener('mouseenter', () => btn.style.background = 'var(--c-surface-2)'); + btn.addEventListener('mouseleave', () => btn.style.background = ''); + }); + + // Burger-Menü-Hinweis öffnet die Sidebar + _container.querySelector('#welcome-menu-hint')?.addEventListener('click', () => { + document.getElementById('header-menu-btn')?.click(); + }); + + // Hamburger-Button 3× kurz pulsieren lassen + _pulseMenuBtn(); + } + + function _pulseMenuBtn() { + const btn = document.getElementById('header-menu-btn'); + if (!btn) return; + if (!document.getElementById('welcome-pulse-style')) { + const s = document.createElement('style'); + s.id = 'welcome-pulse-style'; + s.textContent = ` + @keyframes wc-pulse { + 0%,100% { transform: scale(1); box-shadow: none; } + 50% { transform: scale(1.25); box-shadow: 0 0 0 6px var(--c-primary-subtle); } + } + .wc-pulsing { animation: wc-pulse 0.6s ease-in-out 3; border-radius: var(--radius-md); } + `; + document.head.appendChild(s); + } + setTimeout(() => { + btn.classList.add('wc-pulsing'); + btn.addEventListener('animationend', () => btn.classList.remove('wc-pulsing'), { once: true }); + }, 800); } // ---------------------------------------------------------- diff --git a/backend/static/sw.js b/backend/static/sw.js index e4eb655..fc96171 100644 --- a/backend/static/sw.js +++ b/backend/static/sw.js @@ -3,7 +3,7 @@ Offline-Cache + Push Notifications + Tile-Cache ============================================================ */ -const CACHE_VERSION = 'by-v227'; +const CACHE_VERSION = 'by-v228'; const CACHE_STATIC = `${CACHE_VERSION}-static`; const CACHE_TILES = 'ban-yaro-tiles-v1'; // bleibt über SW-Updates erhalten