From 6f409e7476a27ed04230238f7ef0a6b483744ff3 Mon Sep 17 00:00:00 2001
From: Kum1ta <eddydhj@gmail.com>
Date: Fri, 27 Sep 2024 22:00:23 +0200
Subject: [PATCH] Site     - fix bug resize 3d home page     - fix bug
 selection on mobile mode in online game

---
 .../nginx/static/javascript/home3D/home3D.js  |  6 ++--
 .../static/javascript/multiOnlineGame/Map.js  | 33 ++++++++++++-------
 .../javascript/multiOnlineGame/Player.js      | 10 +++---
 .../multiOnlineGame/multiOnlineGamePage.js    |  6 ++--
 .../nginx/static/style/game/games.css         | 26 ++++++++++++++-
 5 files changed, 59 insertions(+), 22 deletions(-)

diff --git a/docker-compose/requirements/nginx/static/javascript/home3D/home3D.js b/docker-compose/requirements/nginx/static/javascript/home3D/home3D.js
index cb0b78b..c96b378 100644
--- a/docker-compose/requirements/nginx/static/javascript/home3D/home3D.js
+++ b/docker-compose/requirements/nginx/static/javascript/home3D/home3D.js
@@ -6,7 +6,7 @@
 /*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   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()
 	{
-		document.removeEventListener('resize', windowUpdater);
+		window.removeEventListener('resize', windowUpdater);
 		document.removeEventListener('mousemove', mouseTracker);
 		document.removeEventListener('click', redirection);
 
@@ -140,7 +140,7 @@ function home3D()
 	createCube();
 	document.body.getElementsByClassName('homeSection')[0].appendChild(renderer.domElement);
 	
-	document.addEventListener('resize', windowUpdater);
+	window.addEventListener('resize', windowUpdater);
 	mouse.x = 9999; 
 	mouse.y = 9999;
 	document.addEventListener('mousemove', mouseTracker);
diff --git a/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/Map.js b/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/Map.js
index 230f793..ce2d57a 100644
--- a/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/Map.js
+++ b/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/Map.js
@@ -6,7 +6,7 @@
 /*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   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);
 	};
 
-	listObject = null;
 	placeObject(listObject)
 	{
 		let	nbJumper = 0; 
 		
-		this.listObject = listObject.content;
-		for (let i = 0; i < this.listObject.length; i++ )
+		listObject = listObject.content;
+		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++;
 			}
-			else if (this.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));
+			else if (listObject[i].type == 2)
+				scene.add(this.#createWallObstacle(listObject[i].pos.x, listObject[i].pos.y, listObject[i].pos.z, listObject[i].isUp));
 		}
 	}
 
 	activeJumper(name)
 	{
 		ball.changeGravity();
-		if (this.listObject[index].isUp)
-			this.#animationGravityChanger(this.listObject[index].mesh, true);
-		else
-			this.#animationGravityChanger(this.listObject[index].mesh, false);
+		for (let i = 0; this.arrObject && i < this.arrObject.length; i++)
+		{
+			console.log("/////////////");
+			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()
diff --git a/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/Player.js b/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/Player.js
index 15900b6..c6e65ca 100644
--- a/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/Player.js
+++ b/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/Player.js
@@ -6,11 +6,10 @@
 /*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   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'
 
 /*
@@ -71,8 +70,6 @@ class Player
 		this.opponent = opponent;
 		if (playerExist)
 			throw Error("Player is already init.");
-		if (isMobile)
-			showGamePad();
 		playerExist = true;
 		isOnPointAnim = false;
 		pressedButton = [];
@@ -92,6 +89,11 @@ class Player
 		document.addEventListener('keypress', simplePressKey);
 	}
 
+	mobileMode()
+	{
+		showGamePad();
+	}
+
 	dispose()
 	{
 		playerExist = false;
diff --git a/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/multiOnlineGamePage.js b/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/multiOnlineGamePage.js
index 60efe82..4a1ef19 100644
--- a/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/multiOnlineGamePage.js
+++ b/docker-compose/requirements/nginx/static/javascript/multiOnlineGame/multiOnlineGamePage.js
@@ -6,7 +6,7 @@
 /*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   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 { Map } from '/static/javascript/multiOnlineGame/Map.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'
 
 /*
@@ -106,6 +106,8 @@ class MultiOnlineGamePage
 		document.body.appendChild(renderer.domElement);
 		renderer.domElement.setAttribute('id', 'canvasMultiGameOnline');
 		map.ballObject = ball.object;
+		if (isMobile)
+			player.mobileMode();
 
 		//////////////////////////
 		controls = new OrbitControls(cameraTmp, renderer.domElement)
diff --git a/docker-compose/requirements/nginx/static/style/game/games.css b/docker-compose/requirements/nginx/static/style/game/games.css
index 931a56c..e58a7c9 100644
--- a/docker-compose/requirements/nginx/static/style/game/games.css
+++ b/docker-compose/requirements/nginx/static/style/game/games.css
@@ -6,7 +6,7 @@
 /*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   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;
 	left: 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;
 	right: 50px;
 	bottom: 50px;
+	user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    touch-action: none;
 }
 
 .gamePad .buttonGamePad
@@ -144,20 +152,36 @@ body {
 	background-size: 80% 80%;
 	background-position: center;
 	border: none;
+	user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    touch-action: none;
 }
 
 .gamePadLeft #padRight {
 	margin-left: 50px;
 	transform: rotate(180deg);
+	user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    touch-action: none;
 }
 
 .gamePadRight #padTop {
 	margin-bottom: 20px;
 	transform: rotate(90deg);
+	user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    touch-action: none;
 }
 
 .gamePadRight #padBottom {
 	transform: rotate(270deg);
+	user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    touch-action: none;
 }
 
 #canvasMultiGameOnline {