lobby +wainting room
This commit is contained in:
parent
8d1d718f5f
commit
c87c9bb763
2 changed files with 41 additions and 14 deletions
|
|
@ -19,6 +19,7 @@
|
|||
|
||||
<p>Après création ou connexion, vous serez redirigé·e vers la page de <strong>salle d'attente</strong> dédiée.</p>
|
||||
|
||||
|
||||
<script src="https://cdn.socket.io/4.7.2/socket.io.min.js"></script>
|
||||
<script>
|
||||
function log(...args){ console.log(...args); }
|
||||
|
|
@ -28,13 +29,26 @@
|
|||
const j = await r.json();
|
||||
document.getElementById('roomId').value = j.roomId;
|
||||
log('Room créée', j.roomId);
|
||||
// redirect to waiting page (creator will auto-join there)
|
||||
// redirect creator to waiting page
|
||||
window.location.href = `/waiting.html?roomId=${encodeURIComponent(j.roomId)}`;
|
||||
});
|
||||
|
||||
document.getElementById('join').addEventListener('click', ()=>{
|
||||
document.getElementById('join').addEventListener('click', async ()=>{
|
||||
const roomId = document.getElementById('roomId').value.trim();
|
||||
if(!roomId){ alert('Entrez roomId'); return; }
|
||||
// verify room exists before redirecting
|
||||
try{
|
||||
const resp = await fetch(`/rooms/${encodeURIComponent(roomId)}`);
|
||||
if(!resp.ok){
|
||||
const j = await resp.json().catch(()=>({ error: 'room not found' }));
|
||||
alert(j.error || 'room not found');
|
||||
return;
|
||||
}
|
||||
}catch(e){
|
||||
alert('Erreur de connexion au serveur');
|
||||
return;
|
||||
}
|
||||
|
||||
const playerId = document.getElementById('playerId').value.trim() || '';
|
||||
// redirect to waiting page; playerId optional
|
||||
const qs = `?roomId=${encodeURIComponent(roomId)}${playerId?`&playerId=${encodeURIComponent(playerId)}`:''}`;
|
||||
|
|
|
|||
|
|
@ -10,12 +10,11 @@
|
|||
<div>
|
||||
<div>Room: <strong id="roomId">-</strong></div>
|
||||
<div>Status: <strong id="status">-</strong></div>
|
||||
<div>Joueurs:
|
||||
<ul id="players"></ul>
|
||||
</div>
|
||||
<div>Joueurs: <strong id="playerCount">0/2</strong></div>
|
||||
</div>
|
||||
<div style="margin-top:8px">
|
||||
<button id="startBtn" style="display:none">Commencer la partie</button>
|
||||
<button id="copyInviteBtn" style="margin-left:8px">Copier le lien d'invitation</button>
|
||||
</div>
|
||||
|
||||
<!-- Waiting room: only players list and start button. Events/board/controls removed per request -->
|
||||
|
|
@ -29,7 +28,7 @@
|
|||
document.getElementById('roomId').textContent = roomId || '-';
|
||||
|
||||
const statusEl = document.getElementById('status');
|
||||
const playersEl = document.getElementById('players');
|
||||
const playerCountEl = document.getElementById('playerCount');
|
||||
let socket = null;
|
||||
let myPlayerId = null;
|
||||
let myColor = null;
|
||||
|
|
@ -45,16 +44,18 @@
|
|||
socket.on('room:update', (data)=>{
|
||||
console.log('room:update', data);
|
||||
statusEl.textContent = data.status || '-';
|
||||
playersEl.innerHTML = '';
|
||||
(data.players||[]).forEach(p=>{
|
||||
const li = document.createElement('li');
|
||||
li.textContent = p.id + ' (' + p.color + ')';
|
||||
playersEl.appendChild(li);
|
||||
});
|
||||
const count = (data.players||[]).length;
|
||||
playerCountEl.textContent = `${count}/2`;
|
||||
});
|
||||
|
||||
socket.emit('room:join', { roomId, playerId }, (resp)=>{
|
||||
if(resp && resp.error){ log('join error', resp); alert(resp.error); return; }
|
||||
if(resp && resp.error){
|
||||
console.warn('join error', resp);
|
||||
alert(resp.error || 'Impossible de rejoindre la room');
|
||||
// redirect back to home to let user retry/create
|
||||
window.location.href = '/';
|
||||
return;
|
||||
}
|
||||
myPlayerId = resp.playerId;
|
||||
myColor = resp.color;
|
||||
log('Rejoint room', resp);
|
||||
|
|
@ -76,6 +77,18 @@
|
|||
});
|
||||
});
|
||||
|
||||
// Copy invite link (hidden link, no display)
|
||||
document.getElementById('copyInviteBtn').addEventListener('click', async ()=>{
|
||||
const link = `${window.location.origin}/waiting.html?roomId=${encodeURIComponent(roomId)}`;
|
||||
try{
|
||||
await navigator.clipboard.writeText(link);
|
||||
alert('Lien d\'invitation copié dans le presse-papier');
|
||||
}catch(e){
|
||||
// fallback
|
||||
window.prompt('Copie le lien ci-dessous', link);
|
||||
}
|
||||
});
|
||||
|
||||
// when server tells us game started, redirect both players to game page with playerId preserved
|
||||
socket && socket.on && socket.on('game:started', (data)=>{
|
||||
log('game:started', data);
|
||||
|
|
|
|||
Loading…
Reference in a new issue