Weiter am Dating gearbeitet
Some checks failed
Host-Based Deploy (Java 21 Fix) / build-and-run (push) Has been cancelled

This commit is contained in:
2026-04-04 00:09:08 +02:00
parent 87c85b1b17
commit d386f5a7a9
61 changed files with 29863 additions and 350 deletions

View File

@@ -60,6 +60,53 @@
width: 100%;
}
.visitor-time { font-size: 0.68rem; color: var(--color-muted); text-align: center; }
/* ── Dating: Likes & Matches ── */
.dating-strip { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.dating-card {
display: flex; flex-direction: column; align-items: center; gap: 0.3rem;
text-decoration: none; color: var(--color-text); width: 72px;
}
.dating-card:hover .dating-avatar { border-color: var(--color-primary); }
.dating-avatar {
width: 56px; height: 56px; border-radius: 50%;
background: var(--color-secondary);
border: 2px solid var(--color-secondary);
display: flex; align-items: center; justify-content: center;
font-size: 1.4rem; overflow: hidden; flex-shrink: 0;
transition: border-color 0.15s;
}
.dating-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.dating-name {
font-size: 0.75rem; text-align: center;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%;
}
/* Verschwommene Karte für nicht-Premium */
.dating-card-locked {
width: 72px; display: flex; flex-direction: column; align-items: center; gap: 0.3rem;
cursor: default;
}
.dating-avatar-blurred {
width: 56px; height: 56px; border-radius: 50%;
background: var(--color-secondary);
border: 2px solid var(--color-secondary);
overflow: hidden; flex-shrink: 0; position: relative;
}
.dating-avatar-blurred img {
width: 100%; height: 100%; object-fit: cover; border-radius: 50%;
filter: blur(6px); transform: scale(1.1);
}
.dating-avatar-blurred .lock-icon {
position: absolute; inset: 0;
display: flex; align-items: center; justify-content: center;
font-size: 1.1rem;
}
.premium-hint {
font-size: 0.65rem; color: var(--color-primary); text-align: center; font-weight: 600;
}
.match-badge {
font-size: 0.65rem; color: var(--color-primary); text-align: center; font-weight: 600;
}
</style>
</head>
<body class="app">
@@ -105,6 +152,18 @@
<div class="section-label">Profilbesucher</div>
<div class="visitors-strip" id="visitorsStrip"></div>
</div>
<!-- Wer hat mich geliked (Dating) -->
<div id="likesSection" style="display:none;">
<div class="section-label">Dating Wer mag mich ♥</div>
<div class="dating-strip" id="likesStrip"></div>
</div>
<!-- Matches -->
<div id="matchesSection" style="display:none;">
<div class="section-label">Dating Matches 🎉</div>
<div class="dating-strip" id="matchesStrip"></div>
</div>
</div>
</div>
@@ -120,6 +179,10 @@
if (user) {
document.getElementById('greeting').textContent = 'Willkommen zurück, ' + user.name + '!';
loadVisitors();
if (user.datingAktiv) {
loadWhoLikesMe();
loadMatches();
}
}
})
.catch(() => { window.location.href = '/login.html'; });
@@ -132,6 +195,69 @@
return 'vor ' + Math.floor(diff / 86400) + ' Tag' + (Math.floor(diff / 86400) === 1 ? '' : 'en');
}
async function loadWhoLikesMe() {
try {
const res = await fetch('/dating/who-likes-me');
if (!res.ok) return;
const data = await res.json();
if (data.total === 0) return;
const strip = document.getElementById('likesStrip');
strip.innerHTML = data.likers.map(l => {
const pic = l.profilePicture
? `<img src="data:image/png;base64,${l.profilePicture}" alt="">`
: '◉';
if (data.premium && l.userId) {
return `
<a class="dating-card" href="/community/benutzer.html?userId=${l.userId}">
<div class="dating-avatar">${pic}</div>
<span class="dating-name">${esc(l.name)}</span>
</a>`;
} else {
return `
<div class="dating-card-locked">
<div class="dating-avatar-blurred">
${pic}
<span class="lock-icon">🔒</span>
</div>
<span class="premium-hint">Premium</span>
</div>`;
}
}).join('');
document.getElementById('likesSection').style.display = '';
} catch (_) {}
}
async function loadMatches() {
try {
const res = await fetch('/dating/matches');
if (!res.ok) return;
const matches = await res.json();
if (!matches.length) return;
const strip = document.getElementById('matchesStrip');
strip.innerHTML = matches.map(m => `
<a class="dating-card" href="/community/benutzer.html?userId=${m.userId}">
<div class="dating-avatar">
${m.profilePicture
? `<img src="data:image/png;base64,${m.profilePicture}" alt="${esc(m.name)}">`
: '◉'}
</div>
<span class="dating-name">${esc(m.name)}</span>
<span class="match-badge">♥ Match</span>
</a>
`).join('');
document.getElementById('matchesSection').style.display = '';
} catch (_) {}
}
function esc(s) {
if (!s) return '';
return String(s).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;');
}
async function loadVisitors() {
try {
const res = await fetch('/social/profile-visits/my-visitors');