Skip to content
Snippets Groups Projects
Commit cfffc800 authored by Ulysse Durand's avatar Ulysse Durand
Browse files

merged

parents 756d28b2 1e59bd4a
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
public/index.html
+ 100
− 0
View file @ cfffc800
...@@ -4,6 +4,106 @@ ...@@ -4,6 +4,106 @@
<title>Connect4 - Lobby</title> <title>Connect4 - Lobby</title>
<style> <style>
/* Add CSS styles for lobby */ /* Add CSS styles for lobby */
body {
margin: 0;
padding: 0;
background: linear-gradient(135deg, #2c3e50, #3498db);
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
color: white;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
min-height: 100vh;
}
h1 {
margin: 30px 0 10px;
font-size: 3rem;
letter-spacing: 2px;
}
#login {
margin-bottom: 20px;
}
#nameInput {
padding: 10px 20px;
border-radius: 10px;
border: none;
font-size: 1rem;
width: 250px;
}
#rooms {
width: 80%;
max-width: 800px;
margin: 20px auto;
}
#rooms h2 {
font-size: 2rem;
margin-bottom: 10px;
}
#roomList {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
gap: 15px;
margin-top: 10px;
}
.room {
background-color: rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 15px;
box-shadow: 0 0 10px rgba(0,0,0,0.3);
}
.room span {
display: block;
margin-bottom: 8px;
font-weight: bold;
}
.room button {
background-color: #e67e22;
border: none;
padding: 8px 16px;
border-radius: 8px;
color: white;
font-weight: bold;
cursor: pointer;
transition: background 0.3s;
}
.room button:hover {
background-color: #d35400;
}
#hall-of-fame {
margin-top: 40px;
width: 80%;
max-width: 600px;
}
#hall-of-fame h2 {
font-size: 1.8rem;
margin-bottom: 10px;
}
#hof-list {
list-style: none;
padding: 0;
}
#hof-list li {
margin: 5px 0;
background-color: rgba(255, 255, 255, 0.1);
padding: 8px 12px;
border-radius: 8px;
}
</style> </style>
</head> </head>
<body> <body>
......
public/room.html
+ 78
− 1
View file @ cfffc800
...@@ -3,7 +3,84 @@ ...@@ -3,7 +3,84 @@
<head> <head>
<title>Connect4 - Game Room</title> <title>Connect4 - Game Room</title>
<style> <style>
/* Add CSS styles for game room */ body {
margin: 0;
padding: 0;
background: linear-gradient(135deg, #2c3e50, #3498db);
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
color: white;
display: flex;
flex-direction: column;
align-items: center;
}
#game-container {
margin-top: 30px;
background-color: #2980b9;
padding: 20px;
border-radius: 15px;
box-shadow: 0 0 20px rgba(0,0,0,0.3);
}
#gameCanvas {
display: block;
background-color: #2980b9;
border-radius: 10px;
box-shadow: 0 0 15px rgba(0,0,0,0.4);
}
#players {
margin-top: 10px;
font-size: 1.2rem;
}
#chat {
margin-top: 30px;
width: 90%;
max-width: 700px;
background-color: rgba(255, 255, 255, 0.1);
padding: 15px;
border-radius: 10px;
}
#messages {
max-height: 200px;
overflow-y: auto;
text-align: left;
margin-bottom: 10px;
}
#messages div {
margin: 5px 0;
padding: 6px 10px;
background-color: rgba(255, 255, 255, 0.15);
border-radius: 6px;
}
#messageInput {
padding: 10px;
border-radius: 6px;
border: none;
width: 70%;
font-size: 1rem;
}
button {
padding: 10px 20px;
border-radius: 6px;
background-color: #e67e22;
color: white;
font-weight: bold;
border: none;
cursor: pointer;
margin-left: 10px;
transition: background 0.3s;
}
button:hover {
background-color: #d35400;
}
</style> </style>
</head> </head>
<body> <body>
......
server.js
+ 36
− 40
View file @ cfffc800
...@@ -177,24 +177,22 @@ function checkWin(board, row, col) { ...@@ -177,24 +177,22 @@ function checkWin(board, row, col) {
const WINNING_LENGTH = 4; const WINNING_LENGTH = 4;
const directions = [ const directions = [
[0, 1], // horizontal [0, 1], // horizontal →
[1, 0], // vertical [1, 0], // vertical ↓
[1, 1], // diagonale descendante [1, 1], // diagonale descendante ↘
[1, -1], // diagonale montante [1, -1] // diagonale montante ↗
]; ];
for (const [dx, dy] of directions) { for (const [dx, dy] of directions) {
let count = 1; let count = 1;
// Dans une direction
for (let step = 1; step < WINNING_LENGTH; step++) { for (let step = 1; step < WINNING_LENGTH; step++) {
const newRow = row + step * dx; const newRow = row + step * dx;
const newCol = col + step * dy; const newCol = col + step * dy;
if ( if (
newRow >= 0 && newRow >= 0 && newRow < ROWS &&
newRow < ROWS && newCol >= 0 && newCol < COLS &&
newCol >= 0 &&
newCol < COLS &&
board[newRow][newCol] === player board[newRow][newCol] === player
) { ) {
count++; count++;
...@@ -203,15 +201,13 @@ function checkWin(board, row, col) { ...@@ -203,15 +201,13 @@ function checkWin(board, row, col) {
} }
} }
// Dans l’autre direction // Direction opposée
for (let step = 1; step < WINNING_LENGTH; step++) { for (let step = 1; step < WINNING_LENGTH; step++) {
const newRow = row - step * dx; const newRow = row - step * dx;
const newCol = col - step * dy; const newCol = col - step * dy;
if ( if (
newRow >= 0 && newRow >= 0 && newRow < ROWS &&
newRow < ROWS && newCol >= 0 && newCol < COLS &&
newCol >= 0 &&
newCol < COLS &&
board[newRow][newCol] === player board[newRow][newCol] === player
) { ) {
count++; count++;
...@@ -223,7 +219,7 @@ function checkWin(board, row, col) { ...@@ -223,7 +219,7 @@ function checkWin(board, row, col) {
if (count >= WINNING_LENGTH) { if (count >= WINNING_LENGTH) {
return player; return player;
} }
}
return null; return null;
} }
}
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment