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

Site

Browse Source 
- fix bug resize 3d home page
    - fix bug selection on mobile mode in online game
This commit is contained in:
Kum1ta
2024-09-27 22:00:23 +02:00
parent 7d319d020b
commit 6f409e7476
5 changed files with 59 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
docker-compose/requirements/nginx/static/javascript/home3D/home3D.js
View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/22 17:19:17 by edbernar #+# #+# */ /* Created: 2024/08/22 17:19:17 by edbernar #+# #+# */
/* Updated: 2024/09/27 15:08:43 by edbernar ### ########.fr */ /* Updated: 2024/09/27 21:57:28 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -46,7 +46,7 @@ class Home3D
static dispose() static dispose()
{ {
document.removeEventListener('resize', windowUpdater); window.removeEventListener('resize', windowUpdater);
document.removeEventListener('mousemove', mouseTracker); document.removeEventListener('mousemove', mouseTracker);
document.removeEventListener('click', redirection); document.removeEventListener('click', redirection);
@ -140,7 +140,7 @@ function home3D()
createCube(); createCube();
document.body.getElementsByClassName('homeSection')[0].appendChild(renderer.domElement); document.body.getElementsByClassName('homeSection')[0].appendChild(renderer.domElement);
document.addEventListener('resize', windowUpdater); window.addEventListener('resize', windowUpdater);
mouse.x = 9999; mouse.x = 9999;
mouse.y = 9999; mouse.y = 9999;
document.addEventListener('mousemove', mouseTracker); document.addEventListener('mousemove', mouseTracker);

33
docker-compose/requirements/nginx/static/javascript/multiOnlineGame/Map.js
View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/20 14:52:55 by hubourge #+# #+# */ /* Created: 2024/08/20 14:52:55 by hubourge #+# #+# */
/* Updated: 2024/09/27 21:15:45 by edbernar ### ########.fr */ /* Updated: 2024/09/27 21:54:19 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -812,31 +812,40 @@ class Map
}, 10); }, 10);
}; };
listObject = null;
placeObject(listObject) placeObject(listObject)
{ {
let nbJumper = 0; let nbJumper = 0;
this.listObject = listObject.content; listObject = listObject.content;
for (let i = 0; i < this.listObject.length; i++ ) for (let i = 0; i < listObject.length; i++ )
{ {
if (this.listObject[i].type == 1) if (listObject[i].type == 1)
{ {
this.#createGravityChanger(listObject[i].pos.x, listObject[i].pos.y, listObject[i].pos.z, "gravityChanger" + i, listObject[i].isUp ? "jumperTop" : "jumperBottom", listObject[i].isUp); this.#createGravityChanger(listObject[i].pos.x, listObject[i].pos.y, listObject[i].pos.z, listObject[i].name, listObject[i].isUp ? "jumperTop" : "jumperBottom", listObject[i].isUp);
nbJumper++; nbJumper++;
} }
else if (this.listObject[i].type == 2) else if (listObject[i].type == 2)
scene.add(this.#createWallObstacle(this.listObject[i].pos.x, this.listObject[i].pos.y, this.listObject[i].pos.z, this.listObject[i].isUp)); scene.add(this.#createWallObstacle(listObject[i].pos.x, listObject[i].pos.y, listObject[i].pos.z, listObject[i].isUp));
} }
} }
activeJumper(name) activeJumper(name)
{ {
ball.changeGravity(); ball.changeGravity();
if (this.listObject[index].isUp) for (let i = 0; this.arrObject && i < this.arrObject.length; i++)
this.#animationGravityChanger(this.listObject[index].mesh, true); {
else console.log("/////////////");
this.#animationGravityChanger(this.listObject[index].mesh, false); console.log(this.arrObject[i].name);
console.log(name);
console.log("/////////////");
if (this.arrObject[i].name == name)
{
if (this.arrObject[i].name == "jumperTop")
this.#animationGravityChanger(this.arrObject[i].mesh, true);
else
this.#animationGravityChanger(this.arrObject[i].mesh, false);
}
}
} }
#generateObstacle() #generateObstacle()

10
docker-compose/requirements/nginx/static/javascript/multiOnlineGame/Player.js
View File

@ -6,11 +6,10 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/18 00:30:31 by edbernar #+# #+# */ /* Created: 2024/08/18 00:30:31 by edbernar #+# #+# */
/* Updated: 2024/09/27 21:16:32 by edbernar ### ########.fr */ /* Updated: 2024/09/27 21:21:02 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
import { isMobile } from '/static/javascript/main.js'
import * as THREE from '/static/javascript/three/build/three.module.js' import * as THREE from '/static/javascript/three/build/three.module.js'
/* /*
@ -71,8 +70,6 @@ class Player
this.opponent = opponent; this.opponent = opponent;
if (playerExist) if (playerExist)
throw Error("Player is already init."); throw Error("Player is already init.");
if (isMobile)
showGamePad();
playerExist = true; playerExist = true;
isOnPointAnim = false; isOnPointAnim = false;
pressedButton = []; pressedButton = [];
@ -92,6 +89,11 @@ class Player
document.addEventListener('keypress', simplePressKey); document.addEventListener('keypress', simplePressKey);
} }
mobileMode()
{
showGamePad();
}
dispose() dispose()
{ {
playerExist = false; playerExist = false;

6
docker-compose/requirements/nginx/static/javascript/multiOnlineGame/multiOnlineGamePage.js
View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/18 00:53:53 by edbernar #+# #+# */ /* Created: 2024/08/18 00:53:53 by edbernar #+# #+# */
/* Updated: 2024/09/27 21:05:41 by edbernar ### ########.fr */ /* Updated: 2024/09/27 21:21:29 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -18,7 +18,7 @@ import { sendRequest } from "/static/javascript/websocket.js";
import { Player } from '/static/javascript/multiOnlineGame/Player.js' import { Player } from '/static/javascript/multiOnlineGame/Player.js'
import { Map } from '/static/javascript/multiOnlineGame/Map.js' import { Map } from '/static/javascript/multiOnlineGame/Map.js'
import { Ball } from '/static/javascript/multiOnlineGame/Ball.js' import { Ball } from '/static/javascript/multiOnlineGame/Ball.js'
import { pageRenderer } from '/static/javascript/main.js' import { pageRenderer, isMobile } from '/static/javascript/main.js'
import { Opponent } from '/static/javascript/multiOnlineGame/Opponent.js' import { Opponent } from '/static/javascript/multiOnlineGame/Opponent.js'
/* /*
@ -106,6 +106,8 @@ class MultiOnlineGamePage
document.body.appendChild(renderer.domElement); document.body.appendChild(renderer.domElement);
renderer.domElement.setAttribute('id', 'canvasMultiGameOnline'); renderer.domElement.setAttribute('id', 'canvasMultiGameOnline');
map.ballObject = ball.object; map.ballObject = ball.object;
if (isMobile)
player.mobileMode();
////////////////////////// //////////////////////////
controls = new OrbitControls(cameraTmp, renderer.domElement) controls = new OrbitControls(cameraTmp, renderer.domElement)

26
docker-compose/requirements/nginx/static/style/game/games.css
View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/20 11:23:41 by edbernar #+# #+# */ /* Created: 2024/08/20 11:23:41 by edbernar #+# #+# */
/* Updated: 2024/09/27 21:05:45 by edbernar ### ########.fr */ /* Updated: 2024/09/27 21:59:51 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -124,6 +124,10 @@ body {
position: absolute; position: absolute;
left: 50px; left: 50px;
bottom: 50px; bottom: 50px;
user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
touch-action: none;
} }
@ -133,6 +137,10 @@ body {
flex-direction: column; flex-direction: column;
right: 50px; right: 50px;
bottom: 50px; bottom: 50px;
user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
touch-action: none;
} }
.gamePad .buttonGamePad .gamePad .buttonGamePad
@ -144,20 +152,36 @@ body {
background-size: 80% 80%; background-size: 80% 80%;
background-position: center; background-position: center;
border: none; border: none;
user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
touch-action: none;
} }
.gamePadLeft #padRight { .gamePadLeft #padRight {
margin-left: 50px; margin-left: 50px;
transform: rotate(180deg); transform: rotate(180deg);
user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
touch-action: none;
} }
.gamePadRight #padTop { .gamePadRight #padTop {
margin-bottom: 20px; margin-bottom: 20px;
transform: rotate(90deg); transform: rotate(90deg);
user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
touch-action: none;
} }
.gamePadRight #padBottom { .gamePadRight #padBottom {
transform: rotate(270deg); transform: rotate(270deg);
user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
touch-action: none;
} }
#canvasMultiGameOnline { #canvasMultiGameOnline {