keep session id history
This commit is contained in:
@ -50,6 +50,7 @@
|
||||
let currentSessionId = null;
|
||||
let clueArea = null;
|
||||
let gridElement = null;
|
||||
let isClosingGame = false; // Flag to prevent popstate from reloading session
|
||||
|
||||
// Test notifications
|
||||
notificationManager.success('App loaded successfully');
|
||||
@ -64,7 +65,7 @@
|
||||
function updateUrlWithSessionId(sessionId) {
|
||||
const params = new URLSearchParams(window.location.search);
|
||||
params.set('session_id', sessionId);
|
||||
window.history.replaceState({}, '', `${window.location.pathname}?${params.toString()}`);
|
||||
window.history.pushState({ sessionId }, '', `${window.location.pathname}?${params.toString()}`);
|
||||
}
|
||||
|
||||
// Helper function to subscribe to a session
|
||||
@ -72,6 +73,12 @@
|
||||
console.log('Subscribing to session:', sessionId);
|
||||
currentSessionId = sessionId;
|
||||
|
||||
// Show game UI immediately
|
||||
menu.style.display = 'none';
|
||||
gridContainer.style.display = 'block';
|
||||
keyboard.style.display = 'block';
|
||||
gridContainer.innerHTML = '<div class="loading-spinner">Loading session...</div>';
|
||||
|
||||
const message = {
|
||||
type: 'subscribe_session',
|
||||
session_id: sessionId
|
||||
@ -408,54 +415,8 @@
|
||||
function closeGame() {
|
||||
console.log('Closing game');
|
||||
|
||||
// Clear session ID from URL
|
||||
window.history.replaceState({}, '', window.location.pathname);
|
||||
|
||||
// Reset state
|
||||
currentSessionId = null;
|
||||
|
||||
// Destroy clue area - check multiple ways it could be in the DOM
|
||||
if (clueArea) {
|
||||
if (clueArea.parentNode) {
|
||||
clueArea.parentNode.removeChild(clueArea);
|
||||
}
|
||||
clueArea = null;
|
||||
}
|
||||
|
||||
// Also remove any clue-area elements that might exist
|
||||
const allClueAreas = document.querySelectorAll('clue-area');
|
||||
allClueAreas.forEach(elem => {
|
||||
if (elem.parentNode) {
|
||||
elem.parentNode.removeChild(elem);
|
||||
}
|
||||
});
|
||||
|
||||
// Destroy grid element
|
||||
if (gridElement) {
|
||||
gridElement = null;
|
||||
}
|
||||
|
||||
// Hide grid, show menu
|
||||
menu.style.display = 'block';
|
||||
gridContainer.style.display = 'none';
|
||||
keyboard.style.display = 'none';
|
||||
gridContainer.innerHTML = '';
|
||||
|
||||
// Close and reopen WebSocket to interrupt connection
|
||||
wsManager.close();
|
||||
|
||||
// Reconnect WebSocket after a short delay
|
||||
setTimeout(() => {
|
||||
const wsUrl = menu._getWebsocketUrl ? menu._getWebsocketUrl() : (() => {
|
||||
const protocol = window.location.protocol === 'https:' ? 'wss' : 'ws';
|
||||
const host = window.location.hostname;
|
||||
const port = 8765;
|
||||
return `${protocol}://${host}:${port}`;
|
||||
})();
|
||||
|
||||
wsManager.connect(wsUrl);
|
||||
notificationManager.info('Returned to menu');
|
||||
}, 100);
|
||||
// Simply reload the page without session ID to return to menu
|
||||
window.location.href = window.location.pathname;
|
||||
}
|
||||
|
||||
// Handle errors
|
||||
@ -495,6 +456,26 @@
|
||||
gridContainer.innerHTML = '<div class="loading-spinner">Reconnecting to session...</div>';
|
||||
}
|
||||
});
|
||||
|
||||
// Handle back button to switch between sessions
|
||||
window.addEventListener('popstate', (event) => {
|
||||
// Skip if we just closed the game intentionally
|
||||
if (isClosingGame) {
|
||||
console.log('Game is being closed, skipping popstate');
|
||||
return;
|
||||
}
|
||||
|
||||
console.log('Popstate event:', event);
|
||||
const sessionId = getSessionIdFromUrl();
|
||||
|
||||
if (sessionId && currentSessionId !== sessionId) {
|
||||
console.log('Navigating to session:', sessionId);
|
||||
subscribeToSession(sessionId);
|
||||
} else if (!sessionId) {
|
||||
console.log('No session in URL, showing menu');
|
||||
closeGame();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user