Adrien/ChessNut
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

épurer l'interface

Browse source
This commit is contained in:
Didictateur 2025-11-08 17:56:04 +01:00
parent cb0ba5eae2
commit c36a19fb2a
3 changed files with 11 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
public/game.html
View file

@ -7,23 +7,13 @@
</head> </head>
<body> <body>
<h2>ChessNut — Partie</h2> <h2>ChessNut — Partie</h2>
<div>Room: <strong id="roomId">-</strong> Player: <strong id="playerId">-</strong></div> <div>Room: <strong id="roomId">-</strong>
<div style="display:flex;gap:20px;align-items:flex-start"> <div style="display:flex;gap:20px;align-items:flex-start">
<div> <div>
<div>Fen: <span id="fen">-</span></div> <div id="board" style="width:1000px;height:1000px;display:grid;grid-template-columns:repeat(8,1fr);border:1px solid #333"></div>
<div>Joueurs:
<ul id="players"></ul>
</div>
</div>
<div>
<div id="board" style="width:360px;height:360px;display:grid;grid-template-columns:repeat(8,1fr);border:1px solid #333"></div>
</div> </div>
</div> </div>
<h3>Événements</h3>
<div id="log">Logs...</div>
<div style="margin-top:10px"><a href="/">Retour à la page principale</a></div>
<script src="https://cdn.socket.io/4.7.2/socket.io.min.js"></script> <script src="https://cdn.socket.io/4.7.2/socket.io.min.js"></script>
<script> <script>
function qs(name){ const url = new URL(window.location.href); return url.searchParams.get(name); } function qs(name){ const url = new URL(window.location.href); return url.searchParams.get(name); }

20
public/index.html
View file

@ -2,24 +2,19 @@
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>ChessNut - Test client</title> <title>ChessNut</title>
<style>body{font-family:Arial;margin:20px} input,button{padding:6px;margin:4px} #log{white-space:pre-wrap; border:1px solid #ddd;padding:8px;height:300px;overflow:auto}</style> <style>body{font-family:Arial;margin:20px} input,button{padding:6px;margin:4px} #log{white-space:pre-wrap; border:1px solid #ddd;padding:8px;height:300px;overflow:auto}</style>
</head> </head>
<body> <body>
<h2>ChessNut - Client de test</h2> <h2>ChessNut</h2>
<div> <div>
<button id="create">Créer une room</button> <div>
Room ID: <input id="roomId" placeholder="ex: ab12cd34" /> <button id="create">Créer une room</button>
</div>
<button id="join">Rejoindre</button> <button id="join">Rejoindre</button>
Room ID: <input id="roomId" placeholder="ex: ab12cd34" />
</div> </div>
<div style="margin-top:12px">
<label>Votre playerId (optionnel): <input id="playerId" placeholder="laisser vide pour générer" /></label>
</div>
<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 src="https://cdn.socket.io/4.7.2/socket.io.min.js"></script>
<script> <script>
function log(...args){ console.log(...args); } function log(...args){ console.log(...args); }
@ -49,7 +44,8 @@
return; return;
} }
const playerId = document.getElementById('playerId').value.trim() || ''; const playerIdEl = document.getElementById('playerId');
const playerId = (playerIdEl && playerIdEl.value) ? playerIdEl.value.trim() : '';
// redirect to waiting page; playerId optional // redirect to waiting page; playerId optional
const qs = `?roomId=${encodeURIComponent(roomId)}${playerId?`&playerId=${encodeURIComponent(playerId)}`:''}`; const qs = `?roomId=${encodeURIComponent(roomId)}${playerId?`&playerId=${encodeURIComponent(playerId)}`:''}`;
window.location.href = '/waiting.html' + qs; window.location.href = '/waiting.html' + qs;

2
public/waiting.html
View file

@ -11,7 +11,7 @@
<div>Room: <strong id="roomId">-</strong></div> <div>Room: <strong id="roomId">-</strong></div>
<div>Status: <strong id="status">-</strong></div> <div>Status: <strong id="status">-</strong></div>
<div>Joueurs: <strong id="playerCount">0/2</strong></div> <div>Joueurs: <strong id="playerCount">0/2</strong></div>
<div>Hôte: <strong id="hostLabel">-</strong> <span id="youAreHost" style="display:none;color:green;font-weight:bold;margin-left:8px">(Vous êtes l'hôte)</span></div> <div><span id="youAreHost" style="display:none;font-weight:bold">Vous êtes l'hôte</span></div>
</div> </div>
<div style="margin-top:8px"> <div style="margin-top:8px">
<button id="startBtn" style="display:none">Commencer la partie</button> <button id="startBtn" style="display:none">Commencer la partie</button>