- buttons US FR working
    - if someone is in waitingpage and receive his opponent has left tournament, redirect to tournament page
This commit is contained in:
Kum1ta
2024-10-03 01:33:22 +02:00
parent d3fcde1f0b
commit b072b6979f
10 changed files with 102 additions and 33 deletions

View File

@ -106,8 +106,8 @@
</div> </div>
</div> </div>
<div class="select-line"> <div class="select-line">
<div class="select-keys">US</div> <div class="select-keys USButton">US</div>
<div class="not-select-keys">FR</div> <div class="not-select-keys FRButton">FR</div>
</div> </div>
</div> </div>
</div> </div>
@ -131,8 +131,8 @@
</div> </div>
</div> </div>
<div class="select-line"> <div class="select-line">
<div class="select-keys">US</div> <div class="select-keys USButton">US</div>
<div class="not-select-keys">FR</div> <div class="not-select-keys FRButton">FR</div>
</div> </div>
</div> </div>
<div class="skin-select"> <div class="skin-select">
@ -164,8 +164,8 @@
</div> </div>
</div> </div>
<div class="select-line"> <div class="select-line">
<div class="select-keys">US</div> <div class="select-keys USButton">US</div>
<div class="not-select-keys">FR</div> <div class="not-select-keys FRButton">FR</div>
</div> </div>
</div> </div>
@ -198,8 +198,8 @@
</div> </div>
</div> </div>
<div class="select-line"> <div class="select-line">
<div class="select-keys">US</div> <div class="select-keys USButton">US</div>
<div class="not-select-keys">FR</div> <div class="not-select-keys FRButton">FR</div>
</div> </div>
<span class="line"></span> <span class="line"></span>
<p style="text-align: center;">Tournament code</p> <p style="text-align: center;">Tournament code</p>

View File

@ -6,7 +6,7 @@
# By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ # # By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ #
# +#+#+#+#+#+ +#+ # # +#+#+#+#+#+ +#+ #
# Created: 2024/10/01 13:16:39 by edbernar #+# #+# # # Created: 2024/10/01 13:16:39 by edbernar #+# #+# #
# Updated: 2024/10/02 13:31:25 by edbernar ### ########.fr # # Updated: 2024/10/03 01:29:01 by edbernar ### ########.fr #
# # # #
# **************************************************************************** # # **************************************************************************** #
@ -44,5 +44,8 @@
# #
# 2 : message tournament : send a message to the tournament chat # 2 : message tournament : send a message to the tournament chat
# - message : message to send # - message : message to send
#
# 3 : fetchAllData : fetch all data of the tournament
# --> server will send all the data of the tournament (players, messages, etc...) with his actions

View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/22 17:08:46 by madegryc #+# #+# */ /* Created: 2024/08/22 17:08:46 by madegryc #+# #+# */
/* Updated: 2024/10/01 21:32:33 by edbernar ### ########.fr */ /* Updated: 2024/10/03 00:46:01 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -30,6 +30,7 @@ let gameMode = 0;
let barSelector = null; let barSelector = null;
let goalSelector = null; let goalSelector = null;
let timeout = null; let timeout = null;
let layoutSelected = {US: false, FR: false};
class LobbyPage class LobbyPage
{ {
@ -54,6 +55,7 @@ class LobbyPage
window.addEventListener('resize', ajustSearchUserList); window.addEventListener('resize', ajustSearchUserList);
movePopMenuLoginButton(); movePopMenuLoginButton();
initButtonPopMenuLogin(); initButtonPopMenuLogin();
initButtonLaytout();
window.addEventListener('click', closePopUpWhenClickOutsite); window.addEventListener('click', closePopUpWhenClickOutsite);
listSelectCard = document.getElementsByClassName('select-card'); listSelectCard = document.getElementsByClassName('select-card');
document.getElementsByClassName('game-mode')[0].addEventListener('click', showGameMode); document.getElementsByClassName('game-mode')[0].addEventListener('click', showGameMode);
@ -329,4 +331,38 @@ function initButtonPopMenuLogin()
}); });
} }
export { LobbyPage }; function initButtonLaytout()
{
const USkeys = document.getElementsByClassName('USButton');
const FRkeys = document.getElementsByClassName('FRButton');
for (let i = 0; i < USkeys.length; i++)
{
USkeys[i].addEventListener('click', () => {
for (let i = 0; i < USkeys.length; i++)
{
USkeys[i].classList.add('select-keys');
USkeys[i].classList.remove('not-select-keys');
FRkeys[i].classList.remove('select-keys');
FRkeys[i].classList.add('not-select-keys');
}
layoutSelected = {US: true, FR: false};
});
}
for (let i = 0; i < FRkeys.length; i++)
{
FRkeys[i].addEventListener('click', () => {
for (let i = 0; i < USkeys.length; i++)
{
USkeys[i].classList.remove('select-keys');
USkeys[i].classList.add('not-select-keys');
FRkeys[i].classList.add('select-keys');
FRkeys[i].classList.remove('not-select-keys');
}
layoutSelected = {US: false, FR: true};
});
}
}
export { LobbyPage, layoutSelected };

View File

@ -6,17 +6,20 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/28 15:12:25 by edbernar #+# #+# */ /* Created: 2024/08/28 15:12:25 by edbernar #+# #+# */
/* Updated: 2024/09/14 00:20:51 by edbernar ### ########.fr */ /* Updated: 2024/10/03 01:09:53 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
import * as THREE from '/static/javascript/three/build/three.module.js' import * as THREE from '/static/javascript/three/build/three.module.js'
import { layoutSelected } from '/static/javascript/lobbyPage/main.js'
const speed = 0.25; const speed = 0.25;
let player1 = null; let player1 = null;
let player2 = null; let player2 = null;
let pressedButton = []; let pressedButton = [];
let key = null;
class Players class Players
{ {
static create(scene) static create(scene)
@ -24,6 +27,9 @@ class Players
player1 = newBarPlayer(1, 0xffffff); player1 = newBarPlayer(1, 0xffffff);
player2 = newBarPlayer(2, 0xffffff); player2 = newBarPlayer(2, 0xffffff);
key = {
up: layoutSelected.US ? "w" : "z",
};
scene.add(player1); scene.add(player1);
scene.add(player2); scene.add(player2);
document.addEventListener('keydown', addKeyInArr); document.addEventListener('keydown', addKeyInArr);
@ -36,6 +42,7 @@ class Players
document.removeEventListener('keyup', remKeyInArr); document.removeEventListener('keyup', remKeyInArr);
player1 = null; player1 = null;
player2 = null; player2 = null;
key = null;
} }
static update() static update()
@ -45,9 +52,7 @@ class Players
while (i < pressedButton.length) while (i < pressedButton.length)
{ {
if (pressedButton[i] == 'w' && player1.position.z > -limits) if (pressedButton[i] == key.up && player1.position.z > -limits)
player1.position.z -= speed;
if (pressedButton[i] == 'z' && player1.position.z > -limits)
player1.position.z -= speed; player1.position.z -= speed;
else if (pressedButton[i] == 's' && player1.position.z < limits) else if (pressedButton[i] == 's' && player1.position.z < limits)
player1.position.z += speed; player1.position.z += speed;

View File

@ -3,10 +3,10 @@
/* ::: :::::::: */ /* ::: :::::::: */
/* multiLocalGamePage.js :+: :+: :+: */ /* multiLocalGamePage.js :+: :+: :+: */
/* +:+ +:+ +:+ */ /* +:+ +:+ +:+ */
/* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/28 12:07:39 by edbernar #+# #+# */ /* Created: 2024/08/28 12:07:39 by edbernar #+# #+# */
/* Updated: 2024/09/30 15:20:47 by hubourge ### ########.fr */ /* Updated: 2024/10/03 00:48:19 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */

View File

@ -3,14 +3,15 @@
/* ::: :::::::: */ /* ::: :::::::: */
/* Player.js :+: :+: :+: */ /* Player.js :+: :+: :+: */
/* +:+ +:+ +:+ */ /* +:+ +:+ +:+ */
/* By: hubourge <hubourge@student.42.fr> +#+ +:+ +#+ */ /* 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/10/01 18:45:39 by hubourge ### ########.fr */ /* Updated: 2024/10/03 01:09:57 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
import * as THREE from '/static/javascript/three/build/three.module.js' import * as THREE from '/static/javascript/three/build/three.module.js'
import { layoutSelected } from '/static/javascript/lobbyPage/main.js'
/* /*
Explication du code : Explication du code :
@ -48,6 +49,7 @@ let isOnPointAnim = false;
let pressedButton = []; let pressedButton = [];
let mapLength = 0; let mapLength = 0;
const goalAnimation = ["triangle", "cylinder", "star", "box", "rectangle", "ring"]; const goalAnimation = ["triangle", "cylinder", "star", "box", "rectangle", "ring"];
let key = null;
class Player class Player
{ {
@ -63,7 +65,7 @@ class Player
mapVar = null; mapVar = null;
opponent = null; opponent = null;
playerGoalAnimation = null; playerGoalAnimation = null;
constructor (object, map, opponent, indexGoalAnimation) constructor (object, map, opponent, indexGoalAnimation)
{ {
this.mapVar = map; this.mapVar = map;
@ -73,6 +75,8 @@ class Player
playerExist = true; playerExist = true;
isOnPointAnim = false; isOnPointAnim = false;
pressedButton = []; pressedButton = [];
console.log(layoutSelected);
key = {up: layoutSelected.US ? "w" : "z", down: "s", left: layoutSelected.US ? "a" : "q", right: "d"};
this.object = object; this.object = object;
this.limits = map.playerLimits; this.limits = map.playerLimits;
this.camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 0.1, 10000); this.camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 0.1, 10000);
@ -104,6 +108,7 @@ class Player
pressedButton = []; pressedButton = [];
if (this.interval) if (this.interval)
clearInterval(this.interval); clearInterval(this.interval);
key = null;
} }
reserCameraPlayer() reserCameraPlayer()
@ -278,7 +283,7 @@ class Player
i = 0; i = 0;
while (i < pressedButton.length) while (i < pressedButton.length)
{ {
if (pressedButton[i] == 'w' && this.object.position.y < this.limits.up) if (pressedButton[i] == key.up && this.object.position.y < this.limits.up)
{ {
this.isUp = true; this.isUp = true;
if (this.interval) if (this.interval)
@ -294,7 +299,7 @@ class Player
} }
}, 5); }, 5);
} }
if (pressedButton[i] == 's' && this.object.position.y > this.limits.down) if (pressedButton[i] == key.down && this.object.position.y > this.limits.down)
{ {
this.isUp = false; this.isUp = false;
if (this.interval) if (this.interval)
@ -311,13 +316,13 @@ class Player
} }
}, 5); }, 5);
} }
if (pressedButton[i] == 'd' && this.object.position.x < this.limits.right) if (pressedButton[i] == key.right && this.object.position.x < this.limits.right)
{ {
this.object.position.x += this.speed * this.deltaTime; this.object.position.x += this.speed * this.deltaTime;
if (!this.cameraFixed && !isOnPointAnim) if (!this.cameraFixed && !isOnPointAnim)
this.camera.position.x += this.speed * this.deltaTime; this.camera.position.x += this.speed * this.deltaTime;
} }
if (pressedButton[i] == 'a' && this.object.position.x > this.limits.left) if (pressedButton[i] == key.left && this.object.position.x > this.limits.left)
{ {
this.object.position.x -= this.speed * this.deltaTime; this.object.position.x -= this.speed * this.deltaTime;
if (!this.cameraFixed && !isOnPointAnim) if (!this.cameraFixed && !isOnPointAnim)
@ -422,7 +427,7 @@ function showGamePad()
const gamePad = document.getElementsByClassName('gamePad')[0]; const gamePad = document.getElementsByClassName('gamePad')[0];
const canvas = document.getElementById('canvasMultiGameOnline'); const canvas = document.getElementById('canvasMultiGameOnline');
const keyList = ['padLeft', 'padRight', 'padTop', 'padBottom'] const keyList = ['padLeft', 'padRight', 'padTop', 'padBottom']
const keyAction = ['a', 'd', 'w', 's'] const keyAction = [key.left, key.right, key.up, key.down];
canvas.addEventListener('touchstart', function(e) { canvas.addEventListener('touchstart', function(e) {
e.preventDefault(); e.preventDefault();

View File

@ -6,10 +6,11 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/10/01 13:42:29 by edbernar #+# #+# */ /* Created: 2024/10/01 13:42:29 by edbernar #+# #+# */
/* Updated: 2024/10/02 13:39:23 by edbernar ### ########.fr */ /* Updated: 2024/10/03 01:31:12 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
import { sendRequest } from "/static/javascript/websocket.js";
import { pageRenderer } from '/static/javascript/main.js'; import { pageRenderer } from '/static/javascript/main.js';
const playerNb = [1, 2, 4, 5, 13, 14, 15, 16]; const playerNb = [1, 2, 4, 5, 13, 14, 15, 16];
@ -27,6 +28,8 @@ let divTopInfo = null;
let divInfo = null; let divInfo = null;
let divChat = null; let divChat = null;
// gerer quand une personne finit sa partie pour remettre tout comme il le faut
class TournamentPage class TournamentPage
{ {
static create(code) static create(code)
@ -34,7 +37,6 @@ class TournamentPage
divTopInfo = document.getElementById('actuality-tournament'); divTopInfo = document.getElementById('actuality-tournament');
divInfo = document.getElementsByClassName('infoo')[0]; divInfo = document.getElementsByClassName('infoo')[0];
divChat = document.getElementsByClassName('chat')[0]; divChat = document.getElementsByClassName('chat')[0];
document.getElementById('code-tournament').innerText = "Code : " + code; document.getElementById('code-tournament').innerText = "Code : " + code;
divTopInfo.innerText = 'Tournament'; divTopInfo.innerText = 'Tournament';
} }

View File

@ -15,7 +15,8 @@ typeTournament({action: 1, id: 7, username: "NovaBlaze", pfp: "https://encrypted
typeTournament({action: 1, id: 8, username: "GlitchPhantom", pfp: "https://images.wondershare.com/filmora/article-images/2022/cool-tiktok-pfp.jpg"}); typeTournament({action: 1, id: 8, username: "GlitchPhantom", pfp: "https://images.wondershare.com/filmora/article-images/2022/cool-tiktok-pfp.jpg"});
typeTournament({action: 1, id: 9, username: "FrostBiteX", pfp: "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQJWyvMlk1053PLnD3PRrz2g_LdQtW2H-M-GQ&s"}); typeTournament({action: 1, id: 9, username: "FrostBiteX", pfp: "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQJWyvMlk1053PLnD3PRrz2g_LdQtW2H-M-GQ&s"});
typeTournament({action: 1, id: 10, username: "LunarEcho", pfp: "https://hypixel.net/attachments/1928357/"}); typeTournament({action: 1, id: 10, username: "LunarEcho", pfp: "https://hypixel.net/attachments/1928357/"});
typeTournament({action: 2,id: 3}); typeTournament({action: 2, id: 3});
typeTournament({action: 3, username: "Eddy", message: "Bonsoir"}); typeTournament({action: 3, username: "Eddy", message: "Bonsoir"});
typeTournament({action: 4, username: "Eddy", message: "Bonsoir"});
typeTournament({action: 4, id:4, username: "Zouave"});

View File

@ -6,12 +6,13 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/10/01 13:29:50 by edbernar #+# #+# */ /* Created: 2024/10/01 13:29:50 by edbernar #+# #+# */
/* Updated: 2024/10/02 13:29:36 by edbernar ### ########.fr */ /* Updated: 2024/10/03 01:17:26 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
import { TournamentPage } from "/static/javascript/tournamentPage/TournamentPage.js" import { TournamentPage } from "/static/javascript/tournamentPage/TournamentPage.js"
import { createNotification as CN } from "/static/javascript/notification/main.js"; import { createNotification as CN } from "/static/javascript/notification/main.js";
import { WaitingGamePage } from "/static/javascript/waitingGame/main.js";
import { LobbyPage } from '/static/javascript/lobbyPage/main.js'; import { LobbyPage } from '/static/javascript/lobbyPage/main.js';
import { pageRenderer } from '/static/javascript/main.js' import { pageRenderer } from '/static/javascript/main.js'
@ -22,6 +23,11 @@ function typeTournament(content)
if (content.action == 0) if (content.action == 0)
joinTournament(content); joinTournament(content);
} }
else if (pageRenderer.actualPage == WaitingGamePage)
{
if (content.action == 2)
WaitingGamePage.opponentHasQuit(content.id);
}
else if (pageRenderer.actualPage == TournamentPage) else if (pageRenderer.actualPage == TournamentPage)
{ {
if (content.action == 1) if (content.action == 1)

View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */ /* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */ /* +#+#+#+#+#+ +#+ */
/* Created: 2024/09/14 21:20:45 by edbernar #+# #+# */ /* Created: 2024/09/14 21:20:45 by edbernar #+# #+# */
/* Updated: 2024/10/02 13:43:43 by edbernar ### ########.fr */ /* Updated: 2024/10/03 01:21:20 by edbernar ### ########.fr */
/* */ /* */
/* ************************************************************************** */ /* ************************************************************************** */
@ -16,6 +16,7 @@ import { pageRenderer } from '/static/javascript/main.js'
let intervalPoints = null; let intervalPoints = null;
let timeout = null; let timeout = null;
let waitOpponentId = 0;
class WaitingGamePage class WaitingGamePage
{ {
@ -23,6 +24,7 @@ class WaitingGamePage
{ {
const returnButton = document.getElementById('returnToLobbyButton'); const returnButton = document.getElementById('returnToLobbyButton');
const sentence = document.getElementById('sentence'); const sentence = document.getElementById('sentence');
const isTournament = opponentInfo && typeof(opponentInfo) != 'boolean' && opponentInfo.isTournament;
let text = sentence.innerText; let text = sentence.innerText;
let points = ""; let points = "";
@ -46,11 +48,14 @@ class WaitingGamePage
else else
sendRequest("game", {action: 0, skinId: lastSelected ? lastSelected.id : 0, isRanked: opponentInfo ? true : false}); sendRequest("game", {action: 0, skinId: lastSelected ? lastSelected.id : 0, isRanked: opponentInfo ? true : false});
timeout = null; timeout = null;
}, (opponentInfo && typeof(opponentInfo) != 'boolean' && !opponentInfo.isTournament) ? 1500 : 500); }, isTournament ? 1500 : 500);
if (!opponentInfo || typeof(opponentInfo) == 'boolean' || (typeof(opponentInfo) != 'boolean' && !opponentInfo.isTournament)) if (!opponentInfo || !isTournament)
returnButton.addEventListener('click', returnToLobby); returnButton.addEventListener('click', returnToLobby);
else else
{
waitOpponentId = opponentInfo.id;
returnButton.remove(); returnButton.remove();
}
} }
static dispose() static dispose()
@ -89,6 +94,12 @@ class WaitingGamePage
}, 500); }, 500);
document.body.removeChild(returnButton); document.body.removeChild(returnButton);
} }
static opponentHasQuit(opponentId)
{
if (waitOpponentId == opponentId)
pageRenderer.changePage('tournamentPage', false, null);
}
} }
function returnToLobby() function returnToLobby()