Jessy/WikiRush
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(multi): add configurable time limit per round with countdown display

Browse Source
This commit is contained in:
jessy-david-dev
2026-04-11 22:41:40 +02:00
parent 54c4400393
commit b1fcbbdb04
11 changed files with 158 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/api/rooms/[code]/route.ts
+38
View File
@@ -14,6 +14,7 @@ function dbToRoom(row: {
maxPlayers: number;
gameMode: string;
searchAllowed: boolean;
timeLimit: number;
startArticle: string;
targetArticle: string;
roundWinner: string | null;
@@ -30,6 +31,7 @@ function dbToRoom(row: {
maxPlayers: row.maxPlayers,
gameMode: (row.gameMode ?? "race") as Room["gameMode"],
searchAllowed: row.searchAllowed ?? false,
timeLimit: row.timeLimit ?? 0,
startArticle: row.startArticle,
targetArticle: row.targetArticle,
roundWinner: row.roundWinner,
@@ -332,6 +334,41 @@ export async function PATCH(
return Response.json({ room });
}
// Hôte change la limite de temps
case "setTimeLimit": {
const host = room.players.find((p) => p.id === playerId);
if (!host?.isHost) {
return Response.json({ error: "Seul l'hôte peut modifier ce paramètre" }, { status: 403 });
}
room.timeLimit = typeof value === "number" ? Math.max(0, Math.floor(value)) : 0;
await saveRoom(room);
return Response.json({ room });
}
// Fin du temps imparti — déclenché par le client qui détecte l'expiration
case "timeUp": {
if (room.phase !== "playing") {
return Response.json({ room });
}
if (!room.timeLimit || !room.roundStart) {
return Response.json({ room });
}
const elapsed = Date.now() - room.roundStart;
if (elapsed < room.timeLimit * 1000 - 1000) {
// Pas encore expiré (tolérance 1s pour le lag réseau)
return Response.json({ room });
}
// Marquer les non-finis comme abandonnés
for (const p of room.players) {
if (!p.hasWon && !p.hasSurrendered) {
p.hasSurrendered = true;
}
}
assignAllFinishPoints(room); // attribue les points aux gagnants selon l'ordre
await saveRoom(room);
return Response.json({ room });
}
// Manche suivante / rejouer
case "nextRound": {
const host = room.players.find((p) => p.id === playerId);
@@ -394,6 +431,7 @@ async function saveRoom(room: Room) {
maxPlayers: room.maxPlayers,
gameMode: room.gameMode,
searchAllowed: room.searchAllowed,
timeLimit: room.timeLimit,
startArticle: room.startArticle,
targetArticle: room.targetArticle,
roundWinner: room.roundWinner,
app/api/rooms/route.ts
+7 -1
View File
@@ -27,6 +27,7 @@ export type Room = {
maxPlayers: number;
gameMode: "race" | "all_finish"; // race = 1er gagne, all_finish = tout le monde joue
searchAllowed: boolean;
timeLimit: number; // secondes par manche, 0 = illimité
startArticle: string;
targetArticle: string;
roundWinner: string | null;
@@ -59,6 +60,7 @@ function dbToRoom(row: {
maxPlayers: number;
gameMode: string;
searchAllowed: boolean;
timeLimit: number;
startArticle: string;
targetArticle: string;
roundWinner: string | null;
@@ -75,6 +77,7 @@ function dbToRoom(row: {
maxPlayers: row.maxPlayers,
gameMode: (row.gameMode ?? "race") as Room["gameMode"],
searchAllowed: row.searchAllowed ?? false,
timeLimit: row.timeLimit ?? 0,
startArticle: row.startArticle,
targetArticle: row.targetArticle,
roundWinner: row.roundWinner,
@@ -95,11 +98,12 @@ async function pruneOldRooms() {
// Response: { room: Room, playerId: string }
export async function POST(request: NextRequest) {
const body = await request.json();
const { playerName, maxPlayers, totalRounds, gameMode } = body as {
const { playerName, maxPlayers, totalRounds, gameMode, timeLimit } = body as {
playerName: string;
maxPlayers?: number;
totalRounds?: number;
gameMode?: string;
timeLimit?: number;
};
if (
@@ -135,6 +139,7 @@ export async function POST(request: NextRequest) {
const now = BigInt(Date.now());
const clampedMode: Room["gameMode"] = gameMode === "all_finish" ? "all_finish" : "race";
const clampedTime = typeof timeLimit === "number" ? Math.max(0, Math.floor(timeLimit)) : 0;
const players: Player[] = [
{
@@ -160,6 +165,7 @@ export async function POST(request: NextRequest) {
maxPlayers: clampedMax,
gameMode: clampedMode,
searchAllowed: false,
timeLimit: clampedTime,
startArticle: "",
targetArticle: "",
roundWinner: null,
app/components/GameScreen.tsx
+11 -4
View File
@@ -17,6 +17,7 @@ type GameScreenProps = {
clicks: number;
elapsed: string;
countdown: number | null;
timeLeft: number | null;
onNavigate: (title: string) => void;
onGoBack: () => void;
canGoBack: boolean;
@@ -37,6 +38,7 @@ export function GameScreen({
clicks,
elapsed,
countdown,
timeLeft,
onNavigate,
onGoBack,
canGoBack,
@@ -261,10 +263,15 @@ export function GameScreen({
<Breadcrumbs history={history} endRef={breadcrumbEndRef} />
</div>
<div className="flex items-center gap-2 sm:gap-3 shrink-0">
<div className="flex items-center gap-2 sm:gap-3 text-[10px] sm:text-xs font-bold text-[#888] tabular-nums">
<span>{elapsed}</span>
<span>{clicks} clics</span>
<span className="hidden sm:inline">{myPlayer?.score ?? 0} pts</span>
<div className="flex items-center gap-2 sm:gap-3 text-[10px] sm:text-xs font-bold tabular-nums">
{timeLeft !== null && (
<span className={`font-black ${timeLeft <= 10 ? "text-red-400 animate-pulse" : timeLeft <= 30 ? "text-orange-400" : "text-[#888]"}`}>
{timeLeft}s
</span>
)}
<span className="text-[#888]">{elapsed}</span>
<span className="text-[#888]">{clicks} clics</span>
<span className="hidden sm:inline text-[#888]">{myPlayer?.score ?? 0} pts</span>
</div>
{!myFinished && canGoBack && (
<button
app/components/LobbyScreen.tsx
+17
View File
@@ -19,6 +19,7 @@ type LobbyScreenProps = {
gameMode: Room["gameMode"];
setGameMode: (v: Room["gameMode"]) => void;
onSetSearchAllowed: (v: boolean) => void;
onSetTimeLimit: (v: number) => void;
};
export function LobbyScreen({
@@ -37,6 +38,7 @@ export function LobbyScreen({
gameMode,
setGameMode,
onSetSearchAllowed,
onSetTimeLimit,
}: LobbyScreenProps) {
const isHost = room.players.find((p) => p.id === playerId)?.isHost ?? false;
const [copied, setCopied] = useState(false);
@@ -188,6 +190,21 @@ export function LobbyScreen({
</select>
</div>
</div>
<div className="flex flex-col gap-1.5">
<span className="text-xs text-[#888]">Temps par manche</span>
<select
value={room.timeLimit}
onChange={(e) => onSetTimeLimit(Number(e.target.value))}
className="w-full min-h-11 px-2 bg-[#0f0f0f] border border-[#2e2e2e] rounded-xl text-sm text-[#f0f0f0] outline-none focus:border-[#7c3aed] cursor-pointer transition-colors"
>
<option value={0}>Illimité</option>
{[60, 120, 180, 300, 600].map((s) => (
<option key={s} value={s}>
{s < 60 ? `${s}s` : `${s / 60} min`}
</option>
))}
</select>
</div>
<button
onClick={() => onSetSearchAllowed(!room.searchAllowed)}
className={`w-full min-h-11 rounded-xl text-sm font-semibold border transition-colors cursor-pointer flex items-center justify-between px-4 ${room.searchAllowed ? "bg-[#7c3aed]/10 border-[#7c3aed] text-[#a78bfa]" : "bg-[#1a1a1a] border-[#2e2e2e] text-[#888]"}`}
app/components/ScreenRouter.tsx
+2
View File
@@ -159,6 +159,7 @@ export function ScreenRouter({
gameMode={gameMode}
setGameMode={setGameMode}
onSetSearchAllowed={(v) => multi.setSearchAllowed(v)}
onSetTimeLimit={(v) => multi.setTimeLimit(v)}
/>
);
@@ -175,6 +176,7 @@ export function ScreenRouter({
clicks={multi.clicks}
elapsed={fmt(multi.elapsed)}
countdown={multi.countdown}
timeLeft={multi.timeLeft}
onNavigate={multi.navigate}
onGoBack={multi.goBack}
canGoBack={multi.canGoBack}