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

Game

Browse Source 
- Add fade layout while goal3
This commit is contained in:
hubourge
2024-09-03 17:23:13 +02:00
parent 6da8a023f5
commit 3f4aadffe5
3 changed files with 63 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -6,7 +6,7 @@
/* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */ /* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/28 12:23:48 by edbernar #+# #+# */ /* Created: 2024/08/28 12:23:48 by edbernar #+# #+# */
/* Updated: 2024/09/02 18:08:13 by hubourge ### ########.fr */ /* Updated: 2024/09/03 17:18:13 by hubourge ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -33,6 +33,8 @@ let player2Body = null;
let speed = 3; let speed = 3;
let initialZ = 0; let initialZ = 0;
let score = {player1: 0, player2: 0}; let score = {player1: 0, player2: 0};
let onUpdate = false;
const scoreElement = document.getElementById('score');
class Map class Map
{ {
@ -123,6 +125,9 @@ class Map
vec3.z += 0.1; vec3.z += 0.1;
break; break;
} }
scoreElement.innerHTML = score.player1 + " - " + score.player2;
}); });
ground.position.copy(groundBody.position); ground.position.copy(groundBody.position);
@ -158,6 +163,8 @@ class Map
static update() static update()
{ {
if (onUpdate)
return ;
world.step(timeStep); world.step(timeStep);
if (ballBody.position.x > 20) if (ballBody.position.x > 20)
@ -175,32 +182,47 @@ class Map
static reCreate(dirLeft) static reCreate(dirLeft)
{ {
ballBody.position.set(0, 0.15, 0); onUpdate = true;
ball.position.copy(ballBody.position); document.getElementsByTagName('canvas')[3].style.animation = 'fadeIn 0.199s';
player1Body.position.set(-12, 0.4, 0); document.getElementsByTagName('canvas')[3].style.filter = 'brightness(0)';
player1.position.copy(player1Body.position);
player2Body.position.set(12, 0.4, 0);
player2.position.copy(player2Body.position);
speed = 3; setTimeout(() => {
if (dirLeft) speed = 3;
{ if (dirLeft)
score.player2++; {
vec3.x = -3; vec3.x = -3;
vec3.y = 0; vec3.y = 0;
vec3.z = Math.random() * 10 % 4 - 2; vec3.z = Math.random() * 10 % 4 - 2;
} }
else else
{ {
score.player1++; vec3.x = 3;
vec3.x = 3; vec3.y = 0;
vec3.y = 0; vec3.z = Math.random() * 10 % 4 - 2;
vec3.z = Math.random() * 10 % 4 - 2; }
} initialZ = vec3.z;
initialZ = vec3.z;
ballBody.velocity.set(vec3.x, vec3.y, vec3.z);
console.log("score", score); onUpdate = false;
}, 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);
player1Body.position.set(-12, 0.4, 0);
player1.position.copy(player1Body.position);
player2Body.position.set(12, 0.4, 0);
player2.position.copy(player2Body.position);
document.getElementsByTagName('canvas')[3].style.animation = 'fadeOut 0.199s';
document.getElementsByTagName('canvas')[3].style.filter = 'brightness(1)';
scoreElement.innerHTML = score.player1 + " - " + score.player2;
}, 800);
} }
} }

4
site/real_game/index.html
View File

@ -6,6 +6,6 @@
<script src="./main.js" type="module"></script> <script src="./main.js" type="module"></script>
</head> </head>
<body> <body>
<p id="score" ></p>
</body> </body>
</html> </html>

17
site/real_game/style.css
View File

@ -3,10 +3,10 @@
/* ::: :::::::: */ /* ::: :::::::: */
/* style.css :+: :+: :+: */ /* style.css :+: :+: :+: */
/* +:+ +:+ +:+ */ /* +:+ +:+ +:+ */
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/20 11:23:41 by edbernar #+# #+# */ /* Created: 2024/08/20 11:23:41 by edbernar #+# #+# */
/* Updated: 2024/08/20 13:15:29 by edbernar ### ########.fr */ /* Updated: 2024/09/03 17:13:58 by hubourge ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -33,4 +33,15 @@ body {
padding: 0; padding: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
#score {
position: absolute;
top : 5%;
left: 50%;
transform: translateX(-50%);
z-index: 1000;
font : Blippo, fantasy;
font-weight: 900;
font-size: 5vh;
}