rattatwinko/bytechat
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed some

Browse Source
This commit is contained in:
rattatwinko
2025-08-31 22:41:22 +02:00
parent 1aefa1a58d
commit 556759342d
2 changed files with 134 additions and 106 deletions
Download Patch File Download Diff File Expand all files Collapse all files

134
src/static/rooms.js
View File

@@ -25,7 +25,7 @@ function closePublicRoomsBrowser() {
// Subscribe to live public rooms updates
function subscribeToPublicRooms() {
if (typeof socket !== 'undefined' && socket.connected && !isSubscribedToRooms) {
if (typeof socket !== 'undefined' && socket !== null && socket.connected && !isSubscribedToRooms) {
socket.emit('subscribe_public_rooms');
isSubscribedToRooms = true;
console.log('Subscribed to public rooms updates');
@@ -34,7 +34,7 @@ function subscribeToPublicRooms() {
// Unsubscribe from public rooms updates
function unsubscribeFromPublicRooms() {
if (typeof socket !== 'undefined' && socket.connected && isSubscribedToRooms) {
if (typeof socket !== 'undefined' && socket !== null && socket.connected && isSubscribedToRooms) {
socket.emit('unsubscribe_public_rooms');
isSubscribedToRooms = false;
console.log('Unsubscribed from public rooms updates');
@@ -49,7 +49,7 @@ function loadPublicRoomsWebSocket() {
currentSortBy = document.getElementById('roomsSortSelect').value;
currentMinUsers = document.getElementById('minUsersFilter').value || 0;
if (typeof socket !== 'undefined' && socket.connected) {
if (typeof socket !== 'undefined' && socket !== null && socket.connected) {
socket.emit('request_public_rooms', {
sort: currentSortBy,
min_users: currentMinUsers,
@@ -106,29 +106,39 @@ function refreshPublicRooms() {
// Update stats display
function updateStatsDisplay(stats) {
const statsElement = document.getElementById('roomsStats');
statsElement.textContent = `${stats.public_rooms} public rooms • ${stats.total_users} users online`;
if (statsElement) {
statsElement.textContent = `${stats.public_rooms} public rooms • ${stats.total_users} users online`;
}
}
// Show loading state
function showLoadingState() {
document.getElementById('roomsLoading').style.display = 'flex';
document.getElementById('roomsList').style.display = 'none';
document.getElementById('roomsEmpty').style.display = 'none';
const loadingElement = document.getElementById('roomsLoading');
const listElement = document.getElementById('roomsList');
const emptyElement = document.getElementById('roomsEmpty');
if (loadingElement) loadingElement.style.display = 'flex';
if (listElement) listElement.style.display = 'none';
if (emptyElement) emptyElement.style.display = 'none';
}
// Show error state
function showErrorState() {
document.getElementById('roomsLoading').style.display = 'none';
document.getElementById('roomsList').style.display = 'none';
document.getElementById('roomsEmpty').style.display = 'flex';
const loadingElement = document.getElementById('roomsLoading');
const listElement = document.getElementById('roomsList');
const emptyElement = document.getElementById('roomsEmpty');
emptyElement.innerHTML = `
<div style="font-size: 3rem; margin-bottom: 1rem;">⚠️</div>
<h3 style="margin: 0 0 0.5rem 0; color: #ffffff;">Failed to Load Rooms</h3>
<p style="margin: 0 0 1rem 0;">Unable to connect to the server. Please try again.</p>
<button class="btn" onclick="refreshPublicRooms()">Retry</button>
`;
if (loadingElement) loadingElement.style.display = 'none';
if (listElement) listElement.style.display = 'none';
if (emptyElement) {
emptyElement.style.display = 'flex';
emptyElement.innerHTML = `
<div style="font-size: 3rem; margin-bottom: 1rem;">⚠️</div>
<h3 style="margin: 0 0 0.5rem 0; color: #ffffff;">Failed to Load Rooms</h3>
<p style="margin: 0 0 1rem 0;">Unable to connect to the server. Please try again.</p>
<button class="btn" onclick="refreshPublicRooms()">Retry</button>
`;
}
}
// Display rooms
@@ -137,18 +147,19 @@ function displayRooms() {
const roomsLoading = document.getElementById('roomsLoading');
const roomsEmpty = document.getElementById('roomsEmpty');
roomsLoading.style.display = 'none';
if (roomsLoading) roomsLoading.style.display = 'none';
if (publicRoomsData.length === 0) {
roomsEmpty.style.display = 'flex';
roomsList.style.display = 'none';
if (roomsEmpty) roomsEmpty.style.display = 'flex';
if (roomsList) roomsList.style.display = 'none';
return;
}
roomsEmpty.style.display = 'none';
roomsList.style.display = 'block';
roomsList.innerHTML = publicRoomsData.map(room => createRoomCard(room)).join('');
if (roomsEmpty) roomsEmpty.style.display = 'none';
if (roomsList) {
roomsList.style.display = 'block';
roomsList.innerHTML = publicRoomsData.map(room => createRoomCard(room)).join('');
}
}
// Create room card HTML
@@ -221,10 +232,16 @@ function joinPublicRoom(roomId) {
closePublicRoomsBrowser();
// Fill in the room input with the selected room
document.getElementById('roomInput').value = roomId;
const roomInput = document.getElementById('roomInput');
if (roomInput) {
roomInput.value = roomId;
}
// Clear password field since these are public rooms
document.getElementById('roomPasswordInput').value = '';
const roomPasswordInput = document.getElementById('roomPasswordInput');
if (roomPasswordInput) {
roomPasswordInput.value = '';
}
// Trigger your existing join room functionality
const joinButton = document.getElementById('joinRoomBtn');
@@ -233,29 +250,9 @@ function joinPublicRoom(roomId) {
}
}
// Event listeners for controls
document.addEventListener('DOMContentLoaded', function() {
document.getElementById('roomsSortSelect').addEventListener('change', refreshPublicRooms);
document.getElementById('minUsersFilter').addEventListener('change', refreshPublicRooms);
});
// Close on escape key
document.addEventListener('keydown', function(e) {
if (e.key === 'Escape' && document.getElementById('publicRoomsBrowser').style.display === 'block') {
closePublicRoomsBrowser();
}
});
// Close on backdrop click
document.getElementById('publicRoomsBrowser').addEventListener('click', function(e) {
if (e.target === this) {
closePublicRoomsBrowser();
}
});
// WebSocket event handlers for real-time updates
function setupPublicRoomsWebSocketHandlers() {
if (typeof socket === 'undefined') {
if (typeof socket === 'undefined' || socket === null) {
console.log('Socket not available, using HTTP fallback');
return;
}
@@ -277,7 +274,8 @@ function setupPublicRoomsWebSocketHandlers() {
console.log('Received live public rooms update:', data);
// Only update if the browser is currently open and we're subscribed
if (document.getElementById('publicRoomsBrowser').style.display === 'block' && isSubscribedToRooms) {
const browserElement = document.getElementById('publicRoomsBrowser');
if (browserElement && browserElement.style.display === 'block' && isSubscribedToRooms) {
publicRoomsData = data.rooms || [];
if (data.stats) {
@@ -299,21 +297,55 @@ function setupPublicRoomsWebSocketHandlers() {
// Auto-setup WebSocket handlers when page loads
function waitForSocketAndSetupHandlers() {
if (typeof socket !== 'undefined' && socket.connected) {
if (typeof socket !== 'undefined' && socket !== null && socket.connected) {
setupPublicRoomsWebSocketHandlers();
} else {
setTimeout(waitForSocketAndSetupHandlers, 100);
}
}
// Start the setup process
// Event listeners for controls
document.addEventListener('DOMContentLoaded', function() {
// Add null checks for DOM elements
const sortSelect = document.getElementById('roomsSortSelect');
const minUsersFilter = document.getElementById('minUsersFilter');
if (sortSelect) {
sortSelect.addEventListener('change', refreshPublicRooms);
}
if (minUsersFilter) {
minUsersFilter.addEventListener('change', refreshPublicRooms);
}
// Start the WebSocket setup process
waitForSocketAndSetupHandlers();
// Auto-refresh every 30 seconds when browser is open
setInterval(function() {
if (document.getElementById('publicRoomsBrowser').style.display === 'block') {
const browserElement = document.getElementById('publicRoomsBrowser');
if (browserElement && browserElement.style.display === 'block') {
refreshPublicRooms();
}
}, 30000);
});
// Close on escape key
document.addEventListener('keydown', function(e) {
const browserElement = document.getElementById('publicRoomsBrowser');
if (e.key === 'Escape' && browserElement && browserElement.style.display === 'block') {
closePublicRoomsBrowser();
}
});
// Close on backdrop click
document.addEventListener('DOMContentLoaded', function() {
const browserElement = document.getElementById('publicRoomsBrowser');
if (browserElement) {
browserElement.addEventListener('click', function(e) {
if (e.target === this) {
closePublicRoomsBrowser();
}
});
}
});