starnakin/42_ft_transcendence
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'main' of codeberg.org:adrien-lsh/ft_transcendence

Browse Source
This commit is contained in:
Namonay
2024-03-25 17:02:30 +01:00
parent fd48002d30 cb0cc173ba
commit fda7fc407d
9 changed files with 76 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/static/js/api/game/Game.js
View File

@ -21,8 +21,9 @@ class Game
* @param {Boolean} started
* @param {Number} winner_id
* @param {String} state
* @param {String} gamemode
*/
constructor(client, id, disconnect_handler, goal_handler, finish_handler, winner_id, state, started, finished, players_data, start_timestamp, stop_timestamp)
constructor(client, id, disconnect_handler, goal_handler, finish_handler, winner_id, state, started, finished, players_data, start_timestamp, stop_timestamp, gamemode)
{
/**
* @type {Client}
@ -84,6 +85,8 @@ class Game
*/
this.players = [];
players_data = players_data === undefined ? [] : players_data;
players_data.forEach(player_data => {
this.players.push(new Player(this,
player_data.player_id,
@ -92,6 +95,11 @@ class Game
)
);
});
/**
* @type {String}
*/
this.gamemode = gamemode;
}
/**

3
frontend/static/js/index.js
View File

@ -92,8 +92,7 @@ const router = async(uri) => {
{ path: "/matchmaking", view: MatchMakingView },
{ path: "/games/offline", view: GameOfflineView },
{ path: "/tictactoe", view: TicTacToeView },
{ path: "/games/:id/0", view: GameView2D },
{ path: "/games/:id/1", view: GameView3D },
{ path: "/games/pong/:id", view: GameView2D },
{ path: "/games/tictactoe/:id", view: TicTacToeOnlineView },
];

61
frontend/static/js/views/GameOfflineView.js
View File

@ -46,10 +46,44 @@ export default class extends AbstractView {
}
}
createButton()
{
this.up1 = document.createElement("button");
this.down1 = document.createElement("button");
this.up2 = document.createElement("button");
this.down2 = document.createElement("button");
this.up1.setAttribute("user_id", 1);
this.up1.setAttribute("direction", "up");
this.up2.setAttribute("user_id", 2);
this.up2.setAttribute("direction", "up");
this.down1.setAttribute("user_id", 1);
this.down1.setAttribute("direction", "down");
this.down2.setAttribute("user_id", 2);
this.down2.setAttribute("direction", "down");
[this.up1, this.up2, this.down1, this.down2].forEach(button => {
button.onmousedown = this.game.keyDownHandler.bind(this.game);
button.onmouseup = this.game.keyUpHandler.bind(this.game);
});
document.getElementById("app").append(this.up1, this.down1, this.up2, this.down2);
}
destroyButton()
{
[this.up1, this.up2, this.down1, this.down2].forEach(button => {
button.remove();
});
}
startGame() {
if (this.game == null) {
document.getElementById('startGameButton').innerHTML = 'Reset Game';
this.game = new Game(this.player1, this.player2);
this.createButton();
}
else {
document.getElementById('app').removeChild(this.game.canvas);
@ -66,6 +100,7 @@ export default class extends AbstractView {
document.getElementById('app').removeChild(this.game.scoresDisplay);
this.game.cleanup();
this.game = null;
this.destroyButton();
document.getElementById('startGameButton').innerHTML = 'Start Game';
}
}
@ -127,7 +162,6 @@ class Game {
document.addEventListener('keydown', this.keyDownHandler);
document.addEventListener('keyup', this.keyUpHandler);
console.log(this);
}
cleanup() {
@ -143,17 +177,17 @@ class Game {
updateGame() {
//Paddle movement
if (this.keys.includes('s') &&
if ((this.keys.includes('s') || this.keys.includes('down1')) &&
this.players[0].paddle.y + this.def.PADDLEHEIGHT < this.def.CANVASHEIGHT - this.def.PADDLEMARGIN)
this.players[0].paddle.y += this.def.PADDLESPEED;
if (this.keys.includes('w') &&
if ((this.keys.includes('2') || this.keys.includes('up1')) &&
this.players[0].paddle.y > 0 + this.def.PADDLEMARGIN)
this.players[0].paddle.y -= this.def.PADDLESPEED;
if (this.keys.includes('ArrowDown') &&
if ((this.keys.includes('ArrowDown') || this.keys.includes('down2')) &&
this.players[1].paddle.y + this.def.PADDLEHEIGHT < this.def.CANVASHEIGHT - this.def.PADDLEMARGIN)
this.players[1].paddle.y += this.def.PADDLESPEED;
if (this.keys.includes('ArrowUp') &&
if ((this.keys.includes('ArrowUp') || this.keys.includes('up2')) &&
this.players[1].paddle.y > 0 + this.def.PADDLEMARGIN)
this.players[1].paddle.y -= this.def.PADDLESPEED;
@ -186,7 +220,6 @@ class Game {
}
updateScore(p1Score, p2Score) {
console.log(this);
if (p1Score > this.def.MAXSCORE) {
this.scoresDisplay.innerHTML = this.player1 + ' wins!! GGS';
this.cleanup();
@ -225,14 +258,24 @@ class Game {
}
keyUpHandler(ev) {
const idx = this.keys.indexOf(ev.key);
let attributes = ev.originalTarget.attributes;
let key = ev.key === undefined ? `${attributes.direction.value}${attributes.user_id.value}` : ev.key;
const idx = this.keys.indexOf(key);
if (idx != -1)
this.keys.splice(idx, 1);
}
keyDownHandler(ev) {
if (!this.keys.includes(ev.key))
this.keys.push(ev.key);
let attributes = ev.originalTarget.attributes;
let key = ev.key === undefined ? `${attributes.direction.value}${attributes.user_id.value}` : ev.key;
if (!this.keys.includes(key))
this.keys.push(key);
}
}

4
frontend/static/js/views/MatchMakingView.js
View File

@ -28,14 +28,13 @@ export default class extends AbstractAuthenticatedView {
ondisconnect(event)
{
this.button.innerHTML = lang.get("matchmakingStartSearch");
clearIds("innerText", ["detail"]);
}
onreceive(data)
{
if (data.detail === "game_found")
{
if (this.gamemode.value == "pong")
if (this.gamemode_input.value == "pong")
navigateTo(`/games/${data.gamemode}/${data.game_id}`);
else
navigateTo(`/games/${data.gamemode}/${data.game_id}`);
@ -90,6 +89,7 @@ export default class extends AbstractAuthenticatedView {
nb_players_div.style.display = 'block';
client.matchmaking.stop();
clearIds("innerText", ["detail"]);
});
}