Keine Matches gefunden.
'; return; } for (const username of matches) { const resProfile = await fetch(`${API_BASE}/profile/${username}`, { headers: { Authorization: 'Bearer ' + token } }); if (!resProfile.ok) continue; const profile = await resProfile.json(); const div = document.createElement('div'); div.className = 'match-profile'; div.innerHTML = `Keine Matches zum Chatten.
'; return; } chatMatches.forEach(username => { const btn = document.createElement('div'); btn.className = 'chat-match'; btn.textContent = username; btn.addEventListener('click', () => openChat(username, btn)); chatMatchesList.appendChild(btn); }); } catch (error) { alert(error.message || 'Fehler beim Laden der Chat-Partner'); } } // Chat öffnen async function openChat(username, btn) { activeChatUser = username; Array.from(chatMatchesList.children).forEach(child => child.classList.remove('active')); if (btn) btn.classList.add('active'); chatMessagesDiv.innerHTML = 'Lade Nachrichten...
'; try { const res = await fetch(`${API_BASE}/chat/${username}`, { headers: { Authorization: 'Bearer ' + token } }); if (!res.ok) throw new Error('Fehler beim Laden der Nachrichten'); const messages = await res.json(); renderChatMessages(messages); } catch (error) { chatMessagesDiv.innerHTML = `Fehler beim Laden der Nachrichten: ${error.message}
`; } } // Nachrichten anzeigen function renderChatMessages(messages) { chatMessagesDiv.innerHTML = ''; if (!messages || messages.length === 0) { chatMessagesDiv.innerHTML = 'Keine Nachrichten.
'; return; } messages.forEach(msg => { const div = document.createElement('div'); div.style.marginBottom = '10px'; div.style.textAlign = msg.sender === ownUsername ? 'right' : 'left'; div.innerHTML = `${msg.sender === ownUsername ? 'Du' : msg.sender}: ${escapeHtml(msg.message)}`; chatMessagesDiv.appendChild(div); }); chatMessagesDiv.scrollTop = chatMessagesDiv.scrollHeight; } // XSS Schutz function escapeHtml(text) { const map = { '&':'&', '<':'<', '>':'>', '"':'"', "'":''' }; return String(text ?? '').replace(/[&<>"']/g, m => map[m]); } // Chat senden chatSendBtn.addEventListener('click', async () => { const message = chatInput.value.trim(); if (!message) return; if (!activeChatUser) { alert('Bitte wähle zuerst einen Chat-Partner aus.'); return; } try { const res = await fetch(`${API_BASE}/chat/${activeChatUser}`, { method: 'POST', headers: { 'Authorization': 'Bearer ' + token, 'Content-Type': 'application/json' }, body: JSON.stringify({ message }) }); const result = await res.json(); if (!res.ok) throw new Error(result.error || 'Fehler beim Senden der Nachricht'); chatInput.value = ''; await openChat(activeChatUser); // direkt neu laden } catch (error) { alert(error.message || 'Fehler beim Senden der Nachricht'); } }); // Enter sendet Nachricht chatInput.addEventListener('keydown', e => { if (e.key === 'Enter') { e.preventDefault(); chatSendBtn.click(); } }); // Zurück zur Übersicht von Profilen backToProfilesBtn.addEventListener('click', async () => { await loadAllProfiles(); setActiveNavButton(navAllProfiles, navLoggedIn); showSection(profilesSection); }); // Initialisierung async function initialize() { if (token) { await loadOwnProfileUsername(); logoutButton.style.display = 'inline-block'; navLoggedOut.style.display = 'none'; navLoggedIn.style.display = 'flex'; setActiveNavButton(navAllProfiles, navLoggedIn); await loadAllProfiles(); await openProfile(ownUsername); } else { logoutButton.style.display = 'none'; navLoggedIn.style.display = 'none'; navLoggedOut.style.display = 'flex'; setActiveNavButton(navLoginRegister, navLoggedOut); showSection(authSection); } } initialize();