rene/banyaro
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Feature: Geburtstags-Banner mit Feuerwerk-Animationen im world-reminder Stil (SW by-v777)

Browse source
This commit is contained in:
rene 2026-05-08 13:20:03 +02:00
parent 662190e308
commit 55ae22615d
5 changed files with 33 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

2
backend/main.py
View file

@ -327,7 +327,7 @@ MEDIA_DIR = os.getenv("MEDIA_DIR", "/data/media")
os.makedirs(MEDIA_DIR, exist_ok=True)
app.mount("/media", StaticFiles(directory=MEDIA_DIR), name="media")
APP_VER = "776" # muss mit APP_VER in app.js übereinstimmen
APP_VER = "777" # muss mit APP_VER in app.js übereinstimmen
@app.get("/.well-known/assetlinks.json")
async def assetlinks():

2
backend/static/index.html
View file

@ -578,7 +578,7 @@
<script src="/js/api.js?v=94"></script>
<script src="/js/ui.js?v=94"></script>
<script src="/js/app.js?v=94"></script>
<script src="/js/worlds.js?v=776"></script>
<script src="/js/worlds.js?v=777"></script>
<!-- Feature-Seiten werden lazy geladen -->

2
backend/static/js/app.js
View file

@ -3,7 +3,7 @@
Router, State-Management, Navigation, Initialisierung.
============================================================ */
const APP_VER = '776'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const APP_VER = '777'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const APP_VERSION = '1.5.0'; // ← semantische Version, wird bei make release gesetzt
const IS_STAGING = location.hostname === 'staging.banyaro.app';
// Cache-Bust-Parameter nach Update-Reload sofort entfernen

37
backend/static/js/worlds.js
View file

@ -1312,17 +1312,38 @@ window.Worlds = (() => {
</div>
</div>
${bday ? `
<div style="background:linear-gradient(135deg,rgba(196,132,58,0.25),rgba(232,168,87,0.15));
border:1px solid rgba(196,132,58,0.5);border-radius:16px;
padding:14px 16px;text-align:center;animation:wc-pulse 2s ease-in-out 3">
<div style="font-size:2rem;margin-bottom:4px">${bday === 'today' ? '🎂' : '🎁'}</div>
<div style="font-weight:700;font-size:var(--text-sm);color:rgba(255,255,255,0.95)">
<style>
@keyframes bday-pop {
0% { transform: scale(0.7) rotate(-8deg); opacity:0; }
60% { transform: scale(1.15) rotate(4deg); }
100% { transform: scale(1) rotate(0deg); opacity:1; }
}
@keyframes bday-fw1 { 0%,100%{transform:translateY(0) scale(1);opacity:1} 50%{transform:translateY(-8px) scale(1.3);opacity:0.7} }
@keyframes bday-fw2 { 0%,100%{transform:translateY(0) scale(1);opacity:1} 50%{transform:translateY(-12px) scale(1.4);opacity:0.6} }
@keyframes bday-fw3 { 0%,100%{transform:translateY(0) scale(1);opacity:1} 50%{transform:translateY(-6px) scale(1.2);opacity:0.8} }
.bday-pop { animation: bday-pop .5s cubic-bezier(.34,1.56,.64,1) both; }
.bday-fw1 { display:inline-block; animation: bday-fw1 1.4s ease-in-out infinite; }
.bday-fw2 { display:inline-block; animation: bday-fw2 1.1s ease-in-out infinite .2s; }
.bday-fw3 { display:inline-block; animation: bday-fw3 1.6s ease-in-out infinite .4s; }
</style>
<div class="world-reminder bday-pop" style="flex-direction:column;align-items:center;
text-align:center;gap:6px;padding:14px 16px;
background:rgba(0,0,0,0.42);border-color:rgba(196,132,58,0.6)">
<div style="display:flex;gap:6px;font-size:1.5rem;line-height:1">
<span class="bday-fw1">🎆</span>
<span style="font-size:2rem">${bday === 'today' ? '🎂' : '🎁'}</span>
<span class="bday-fw2">🎇</span>
</div>
<div style="font-weight:800;font-size:var(--text-sm);color:#fff;letter-spacing:0.01em">
${bday === 'today'
? `Alles Gute zum ${bdayYear}. Geburtstag, ${_esc(dog.name)}! 🎉`
? `Alles Gute zum ${bdayYear}. Geburtstag, ${_esc(dog.name)}!`
: `Morgen hat ${_esc(dog.name)} Geburtstag! 🥳`}
</div>
${bdayYear ? `<div style="font-size:10px;color:rgba(255,255,255,0.55);margin-top:3px">
${bday === 'today' ? `${bdayYear} Jahr${bdayYear !== 1 ? 'e' : ''} gemeinsam` : `Wird ${bdayYear} Jahr${bdayYear !== 1 ? 'e' : ''} alt`}
<div style="display:flex;gap:4px;font-size:1.1rem">
<span class="bday-fw3">🎉</span><span class="bday-fw1">✨</span><span class="bday-fw2">🎊</span><span class="bday-fw3">✨</span><span class="bday-fw1">🎉</span>
</div>
${bdayYear ? `<div style="font-size:10px;color:rgba(255,255,255,0.55)">
${bday === 'today' ? `${bdayYear} Jahr${bdayYear !== 1 ? 'e' : ''} gemeinsam 🐾` : `Wird ${bdayYear} Jahr${bdayYear !== 1 ? 'e' : ''} alt`}
</div>` : ''}
</div>` : ''}
</div>

2
backend/static/sw.js
View file

@ -3,7 +3,7 @@
Offline-Cache + Push Notifications + Tile-Cache
============================================================ */
const CACHE_VERSION = 'by-v776';
const CACHE_VERSION = 'by-v777';
const CACHE_STATIC = `${CACHE_VERSION}-static`;
const CACHE_TILES = 'ban-yaro-tiles-v1'; // bleibt über SW-Updates erhalten
const CACHE_API = 'ban-yaro-api-v1'; // API-Response-Cache