Tournament 1vs1 offline
This commit is contained in:
parent
d8e767405a
commit
084ada1de1
@ -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';
|
||||
|
@ -11,7 +11,7 @@ class Notice {
|
||||
for (let i in data_variable)
|
||||
this.data[data_variable[i]] = [];
|
||||
|
||||
this.connect();
|
||||
//this.connect();
|
||||
|
||||
}
|
||||
|
||||
|
@ -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}`;
|
||||
|
Loading…
Reference in New Issue
Block a user