71 lines
2.5 KiB
HTML
71 lines
2.5 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>ChessNut</title>
|
|
<link rel="stylesheet" href="/styles/style.css">
|
|
</head>
|
|
<body>
|
|
<div class="page">
|
|
<header class="hero card">
|
|
<div>
|
|
<div class="title">ChessNut</div>
|
|
<div class="subtitle">Créez ou rejoignez une partie — rapide, simple et fun 🎯</div>
|
|
</div>
|
|
<div style="text-align:right">
|
|
<div class="muted">Invite your friends — play together</div>
|
|
<img class="decor" src="/assets/chess-pieces/boards/8x8_pink_1Kbyte_gambit.svg" alt="decor" />
|
|
</div>
|
|
<svg class="floating-piece" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><path fill="#fff" d="M10 90 L30 10 L50 90 Z" /></svg>
|
|
</header>
|
|
|
|
<section class="card lobby">
|
|
<div>
|
|
<button id="create" class="btn-cta">Créer une room</button>
|
|
</div>
|
|
|
|
<div class="controls">
|
|
<input id="roomId" class="input" placeholder="ex: ab12cd34" />
|
|
<button id="join" class="btn-ghost">Rejoindre</button>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
|
|
<script src="https://cdn.socket.io/4.7.2/socket.io.min.js"></script>
|
|
<script>
|
|
function log(...args){ console.log(...args); }
|
|
|
|
document.getElementById('create').addEventListener('click', async ()=>{
|
|
const r = await fetch('/rooms', { method:'POST' });
|
|
const j = await r.json();
|
|
document.getElementById('roomId').value = j.roomId;
|
|
log('Room créée', j.roomId);
|
|
// redirect creator to waiting page
|
|
window.location.href = `/waiting.html?roomId=${encodeURIComponent(j.roomId)}`;
|
|
});
|
|
|
|
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 playerIdEl = document.getElementById('playerId');
|
|
const playerId = (playerIdEl && playerIdEl.value) ? playerIdEl.value.trim() : '';
|
|
// redirect to waiting page; playerId optional
|
|
const qs = `?roomId=${encodeURIComponent(roomId)}${playerId?`&playerId=${encodeURIComponent(playerId)}`:''}`;
|
|
window.location.href = '/waiting.html' + qs;
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|