tom/METH_Transcendence
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Game

Browse Source
This commit is contained in:
Kum1ta
2024-09-03 18:30:39 +02:00
parent 3f4aadffe5
commit 34f6ffc7c7
4 changed files with 55 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
site/real_game/class/soloClass/Map.js
View File

@ -3,10 +3,10 @@
/* ::: :::::::: */
/* Map.js :+: :+: :+: */
/* +:+ +:+ +:+ */
/* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/28 12:23:48 by edbernar #+# #+# */
/* Updated: 2024/09/03 17:18:13 by hubourge ### ########.fr */
/* Updated: 2024/09/03 18:13:18 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
@ -125,9 +125,6 @@ class Map
vec3.z += 0.1;
break;
}
scoreElement.innerHTML = score.player1 + " - " + score.player2;
});
ground.position.copy(groundBody.position);
@ -185,7 +182,15 @@ class Map
onUpdate = true;
document.getElementsByTagName('canvas')[3].style.animation = 'fadeIn 0.199s';
document.getElementsByTagName('canvas')[3].style.filter = 'brightness(0)';
scoreElement.style.animation = 'fadeInText 0.199s';
scoreElement.style.color = 'rgb(255, 255, 255, 1)';
setTimeout(() => {
if (dirLeft)
score.player2++;
else
score.player1++;
scoreElement.innerHTML = score.player1 + '-' +score.player2;
}, 300);
setTimeout(() => {
speed = 3;
if (dirLeft)
@ -206,11 +211,6 @@ class Map
}, 1500);
setTimeout(() => {
if (dirLeft)
score.player2++;
else
score.player1++;
ballBody.velocity.set(0,0,0);
ballBody.position.set(0, 0.15, 0);
ball.position.copy(ballBody.position);
@ -219,10 +219,11 @@ class Map
player2Body.position.set(12, 0.4, 0);
player2.position.copy(player2Body.position);
document.getElementsByTagName('canvas')[3].style.animation = 'fadeOut 0.199s';
scoreElement.style.animation = 'fadeOut 0.199s';
document.getElementsByTagName('canvas')[3].style.filter = 'brightness(1)';
scoreElement.innerHTML = score.player1 + " - " + score.player2;
}, 800);
scoreElement.style.animation = 'fadeOutText 0.399s';
scoreElement.style.color = 'rgb(255, 255, 255, 0.1)';
}, 1000);
}
}

5
site/real_game/index.html
View File

@ -3,9 +3,12 @@
<head>
<title>Page</title>
<link rel='stylesheet' type='text/css' href='style.css'>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
<script src="./main.js" type="module"></script>
</head>
<body>
<p id="score" ></p>
<p id="score">0 - 0</p>
</body>
</html>

4
site/real_game/main.js
View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/28 12:05:53 by edbernar #+# #+# */
/* Updated: 2024/08/28 14:30:05 by edbernar ### ########.fr */
/* Updated: 2024/09/03 17:24:36 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
@ -14,4 +14,4 @@ import { MultiGame } from "./class/MultiGame";
import { SoloGame } from "./class/SoloGame";
// MultiGame.create();
SoloGame.create();
SoloGame.create();

42
site/real_game/style.css
View File

@ -3,10 +3,10 @@
/* ::: :::::::: */
/* style.css :+: :+: :+: */
/* +:+ +:+ +:+ */
/* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/20 11:23:41 by edbernar #+# #+# */
/* Updated: 2024/09/03 17:13:58 by hubourge ### ########.fr */
/* Updated: 2024/09/03 18:19:30 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
@ -28,20 +28,46 @@
}
}
@keyframes fadeInText {
from {
color: rgb(255, 255, 255, 0.1);
}
to {
color: rgb(255, 255, 255, 1);
}
}
@keyframes fadeOutText {
from {
color: rgb(255, 255, 255, 1);
}
to {
color: rgb(255, 255, 255, 0.1);
}
}
body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
#score {
line-height: 1.75;
vertical-align: top;
font-family: 'Poppins';
position: absolute;
top : 5%;
font-size: 30vh;
top: 0;
bottom : 50%;
left: 50%;
transform: translateX(-50%);
z-index: 1000;
font : Blippo, fantasy;
font-weight: 900;
font-size: 5vh;
transform: translate(-50%, 50%);
z-index: 800;
margin: 0;
padding: 0;
white-space: nowrap;
/* font-weight: 900; */
color: rgb(255, 255, 255, 0.1);
}