Entwicklung/xxx-sphere-web
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Weiter an den Locations gearbeitet
Some checks failed
Host-Based Deploy (Java 21 Fix) / build-and-run (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Mario Störmer
2026-04-06 22:48:34 +02:00
parent 0f9f109067
commit 5ffb99c9b5
81 changed files with 2817 additions and 352 deletions
Download Patch File Download Diff File Expand all files Collapse all files

109
src/main/resources/static/userhome.html
View File

@@ -107,6 +107,29 @@
.match-badge {
font-size: 0.65rem; color: var(--color-primary); text-align: center; font-weight: 600;
}
/* ── Location-Events ── */
.loc-event-list { display: flex; flex-direction: column; gap: 0.6rem; }
.loc-event-card {
display: flex; gap: 0.75rem; align-items: center;
background: var(--color-secondary); border: 1px solid var(--color-secondary);
border-radius: 10px; padding: 0.65rem 0.85rem;
text-decoration: none; color: inherit;
transition: border-color 0.15s;
}
.loc-event-card:hover { border-color: var(--color-primary); }
.loc-event-thumb {
width: 48px; height: 48px; border-radius: 8px; flex-shrink: 0;
background: var(--color-card); overflow: hidden;
display: flex; align-items: center; justify-content: center; font-size: 1.4rem;
}
.loc-event-thumb img { width: 100%; height: 100%; object-fit: cover; }
.loc-event-body { flex: 1; min-width: 0; }
.loc-event-location { font-size: 0.75rem; color: var(--color-muted); margin-bottom: 0.1rem;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.loc-event-title { font-size: 0.92rem; font-weight: 600;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.loc-event-date { font-size: 0.75rem; color: var(--color-primary); margin-top: 0.15rem; }
</style>
</head>
<body class="app">
@@ -132,38 +155,19 @@
<div class="section-label">Matches 💕</div>
<div class="dating-strip" id="matchesStrip"></div>
</div>
<!-- Meine angemeldeten Events -->
<div id="myEventsSection" style="display:none;">
<div class="section-label">Meine Veranstaltungen 🎟</div>
<div class="loc-event-list" id="myEventsList"></div>
</div>
<!-- Nächste Events abonnierter Locations -->
<div id="locEventsSection" style="display:none;">
<div class="section-label">Nächste Veranstaltungen 📍</div>
<div class="loc-event-list" id="locEventsList"></div>
</div>
</div>
<div class="game-grid">
<div class="game-card">
<div class="game-card-icon">❤️</div>
<h2 class="game-card-title">Vanilla Game</h2>
<p class="game-card-desc">
</p>
<a href="/games/vanilla/sessionvanilla.html"><button class="game-card-btn">Neue Session starten</button></a>
</div>
<div class="game-card">
<div class="game-card-icon">⛓️</div>
<h2 class="game-card-title">BDSM Game</h2>
<p class="game-card-desc">
Tauche ein in strukturierte Sessions mit Aufgaben, Toys und klaren Rollen.
Definiere Grenzen, vergib Aufgaben und erlebe intensive Momente mit deinen Spielpartner*Innen.
</p>
<a href="/games/bdsm/neubdsm.html"><button class="game-card-btn">Neue Session starten</button></a>
</div>
<div class="game-card">
<div class="game-card-icon">🔒</div>
<h2 class="game-card-title">Chastity Game</h2>
<p class="game-card-desc">
Erlebe Keuschheit auf eine neue Art: Kartenbasierte Locks, Keyholder-System,
Community-Abstimmungen und tägliche Verifizierungen machen jedes Lock einzigartig.
</p>
<a href="/games/chastity/neulock.html"><button class="game-card-btn">Neues Lock erstellen</button></a>
</div>
</div>
</div>
<script src="/js/icons.js"></script>
@@ -178,6 +182,8 @@
if (user) {
document.getElementById('greeting').textContent = 'Willkommen zurück, ' + user.name + '!';
loadVisitors();
loadMyEvents();
loadLocEvents();
if (user.datingAktiv) {
loadWhoLikesMe();
loadMatches();
@@ -257,6 +263,47 @@
return String(s).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;');
}
function renderEventCards(events, listId, sectionId) {
if (!events.length) return;
const list = document.getElementById(listId);
list.innerHTML = events.map(e => {
const thumb = e.imageData
? `<img src="data:image/jpeg;base64,${e.imageData}" alt="">`
: '🗓';
const date = new Date(e.startAt);
const dateStr = date.toLocaleDateString('de-DE', { weekday:'short', day:'numeric', month:'short' })
+ ', ' + date.toLocaleTimeString('de-DE', { hour:'2-digit', minute:'2-digit' }) + ' Uhr';
return `
<a class="loc-event-card" href="/community/event-detail.html?id=${e.eventId}">
<div class="loc-event-thumb">${thumb}</div>
<div class="loc-event-body">
<div class="loc-event-location">${esc(e.locationName)}</div>
<div class="loc-event-title">${esc(e.title)}</div>
<div class="loc-event-date">${dateStr}</div>
</div>
</a>`;
}).join('');
document.getElementById(sectionId).style.display = '';
}
async function loadMyEvents() {
try {
const res = await fetch('/location-events/attending-next');
if (!res.ok) return;
const events = await res.json();
renderEventCards(events, 'myEventsList', 'myEventsSection');
} catch (_) {}
}
async function loadLocEvents() {
try {
const res = await fetch('/location-events/followed-next');
if (!res.ok) return;
const events = await res.json();
renderEventCards(events, 'locEventsList', 'locEventsSection');
} catch (_) {}
}
async function loadVisitors() {
try {
const res = await fetch('/social/profile-visits/my-visitors');