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

Tournament 1vs1 offline

Browse Source
This commit is contained in:
Xamora 2024-03-12 10:28:52 +01:00
parent de146367c3
commit a03e2c397d
3 changed files with 40 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/static/js/api/Client.js
View File

@ -5,7 +5,7 @@ import { Channels } from './chat/Channels.js';
import { MyProfile } from "./MyProfile.js";
import { navigateTo } from "../index.js";
import { Tourmanents } from "./tournament/Tournaments.js";
import {Notice} from "./chat/Notice.js";
import { Notice } from "./chat/Notice.js";
import { Channel } from "./chat/Channel.js";
import LanguageManager from './LanguageManager.js';
@ -192,7 +192,7 @@ class Client
{
this.me = new MyProfile(this);
await this.me.init();
this.notice.reconnect();
this.notice.connect();
document.getElementById('navbarLoggedOut').classList.add('d-none');
document.getElementById('navbarLoggedIn').classList.remove('d-none');
document.getElementById('navbarDropdownButton').innerHTML = this.me.username;
@ -201,7 +201,7 @@ class Client
else
{
this.me = undefined;
this.notice.reconnect();
this.notice.disconnect();
document.getElementById('navbarLoggedOut').classList.remove('d-none');
document.getElementById('navbarLoggedIn').classList.add('d-none');
document.getElementById('navbarDropdownButton').innerHTML = 'Me';

2
frontend/static/js/api/chat/Notice.js
View File

@ -11,7 +11,7 @@ class Notice {
for (let i in data_variable)
this.data[data_variable[i]] = [];
this.connect();
//this.connect();
}

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

@ -4,6 +4,8 @@ export default class extends AbstractView {
constructor(params) {
super(params, 'Game');
this.game = null;
this.player1 = "Player 1";
this.player2 = "Player 2";
}
async getHtml() {
@ -11,28 +13,49 @@ export default class extends AbstractView {
<h1>Game</h1>
<button id='startGameButton'>Start Game</button>
<button id='stopGameButton'>Stop Game</button>
<button id='startTournament'>Start Tournament</button>
`;
}
async postInit() {
document.getElementById('startGameButton').onclick = this.startGame.bind(this);
document.getElementById('stopGameButton').onclick = this.stopGame.bind(this);
document.getElementById('startTournament').onclick = this.startTournament.bind(this);
}
async leavePage() {
this.game?.cleanup();
}
startTournament() {
let startTournament = document.getElementById("startTournament");
let player1 = document.createElement("input");
player1.id="player1"; player1.type="text"; player1.name="message"; player1.placeholder="Player 1"; player1.maxLength=20;
startTournament.before(player1);
let player2 = document.createElement("input");
player2.id="player2"; player2.type="text"; player2.name="message"; player2.placeholder="Player 2"; player2.maxLength=20;
player1.after(player2);
startTournament.onclick = () => {
if (player1.value.length > 0)
this.player1 = player1.value;
if (player2.value.length > 0)
this.player2 = player2.value;
this.startGame();
}
}
startGame() {
if (this.game == null) {
document.getElementById('startGameButton').innerHTML = 'Reset Game';
this.game = new Game();
this.game = new Game(this.player1, this.player2);
}
else {
document.getElementById('app').removeChild(this.game.canvas);
document.getElementById('app').removeChild(this.game.scoresDisplay);
this.game.cleanup();
this.game = new Game();
this.game = new Game(this.player1, this.player2);
}
}
@ -48,7 +71,7 @@ export default class extends AbstractView {
}
class Game {
constructor() {
constructor(player1, player2) {
//Global variables
this.def = {
CANVASHEIGHT: 270,
@ -61,7 +84,7 @@ class Game {
BALLSPEED: 2,
BALLSPEEDINCR: 0.15,
MAXBOUNCEANGLE: 10 * (Math.PI / 12),
MAXSCORE: 6
MAXSCORE: 1
};
this.canvas = document.createElement('canvas');
@ -75,6 +98,8 @@ class Game {
this.scoresDisplay = document.createElement('p');
this.scoresDisplay.innerHTML = 'Scores: 0 - 0';
document.getElementById('app').appendChild(this.scoresDisplay);
this.player1 = player1;
this.player2 = player2;
this.players = [
{
@ -101,6 +126,8 @@ class Game {
this.keyDownHandler = this.keyDownHandler.bind(this);
document.addEventListener('keydown', this.keyDownHandler);
document.addEventListener('keyup', this.keyUpHandler);
console.log(this);
}
cleanup() {
@ -132,9 +159,9 @@ class Game {
//GOOAAAAL
if (this.ball.x <= 0)
this.updateScore(this.players[0].score, ++this.players[1].score);
this.updateScore.bind(this)(this.players[0].score, ++this.players[1].score);
else if (this.ball.x >= this.def.CANVASWIDTH)
this.updateScore(++this.players[0].score, this.players[1].score);
this.updateScore.bind(this)(++this.players[0].score, this.players[1].score);
//Ball collisions
if (this.detectCollision(this.players[0].paddle, this.ball))
@ -159,12 +186,13 @@ class Game {
}
updateScore(p1Score, p2Score) {
console.log(this);
if (p1Score > this.def.MAXSCORE) {
this.scoresDisplay.innerHTML = 'Player 1 wins!! GGS';
this.scoresDisplay.innerHTML = this.player1 + ' wins!! GGS';
this.cleanup();
}
else if (p2Score > this.def.MAXSCORE) {
this.scoresDisplay.innerHTML = 'Player 2 wins!! GGS';
this.scoresDisplay.innerHTML = this.player2 + ' wins!! GGS';
this.cleanup();
} else {
this.scoresDisplay.innerHTML = `Scores: ${p1Score} - ${p2Score}`;