From 6111e251e6b7d3508f0a04934641ef81cad0f674 Mon Sep 17 00:00:00 2001 From: starnakin Date: Mon, 25 Mar 2024 15:14:23 +0100 Subject: [PATCH 1/4] matchmaking: fix --- frontend/static/js/views/MatchMakingView.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/static/js/views/MatchMakingView.js b/frontend/static/js/views/MatchMakingView.js index ed68d4c..2327053 100644 --- a/frontend/static/js/views/MatchMakingView.js +++ b/frontend/static/js/views/MatchMakingView.js @@ -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"]); }); } From 2cc4a088f08628c688acd60d8084af0b0abeb726 Mon Sep 17 00:00:00 2001 From: starnakin Date: Mon, 25 Mar 2024 16:05:45 +0100 Subject: [PATCH 2/4] game: fix --- frontend/static/js/api/game/Game.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/frontend/static/js/api/game/Game.js b/frontend/static/js/api/game/Game.js index 6f1a4d8..89fbd70 100644 --- a/frontend/static/js/api/game/Game.js +++ b/frontend/static/js/api/game/Game.js @@ -84,6 +84,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, From 7ac835e6116f7ed09c7c5c7f013155736255319b Mon Sep 17 00:00:00 2001 From: starnakin Date: Mon, 25 Mar 2024 16:11:07 +0100 Subject: [PATCH 3/4] le caca coule au cucu --- chat/consumersNotice.py | 2 +- frontend/static/js/api/game/Game.js | 8 +++++++- frontend/static/js/index.js | 3 +-- games/models.py | 4 +++- games/serializers.py | 3 ++- matchmaking/consumers.py | 8 ++++---- tournament/models.py | 3 ++- 7 files changed, 20 insertions(+), 11 deletions(-) diff --git a/chat/consumersNotice.py b/chat/consumersNotice.py index 1070c8e..c1bbe29 100644 --- a/chat/consumersNotice.py +++ b/chat/consumersNotice.py @@ -210,7 +210,7 @@ class ChatNoticeConsumer(WebsocketConsumer): if (targets[0] in self.channel_layer.invite[user.pk]): self.channel_layer.invite[user.pk].remove(targets[0]) - id_game = GameModel().create([user.pk, targets[0]]); + id_game = GameModel().create("pong", [user.pk, targets[0]]); return 200, id_game diff --git a/frontend/static/js/api/game/Game.js b/frontend/static/js/api/game/Game.js index 89fbd70..d260904 100644 --- a/frontend/static/js/api/game/Game.js +++ b/frontend/static/js/api/game/Game.js @@ -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} @@ -94,6 +95,11 @@ class Game ) ); }); + + /** + * @type {String} + */ + this.gamemode = gamemode; } /** diff --git a/frontend/static/js/index.js b/frontend/static/js/index.js index 1297845..349c8a9 100644 --- a/frontend/static/js/index.js +++ b/frontend/static/js/index.js @@ -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 }, ]; diff --git a/games/models.py b/games/models.py index 519dadb..2e93d61 100644 --- a/games/models.py +++ b/games/models.py @@ -15,8 +15,10 @@ class GameModel(models.Model): winner_id = models.IntegerField(default = -1) start_timestamp = models.BigIntegerField(null = True, blank = True) stop_timestamp = models.BigIntegerField(null = True, blank = True) + gamemode = models.CharField(max_length = 60, default = "pong") - def create(self, players_id: [int]): + def create(self, gamemode: str, players_id: [int]): + self.gamemode = gamemode self.save() for player_id in players_id: GameMembersModel(game_id = self.pk, player_id = player_id).save() diff --git a/games/serializers.py b/games/serializers.py index a4ae11b..6321d65 100644 --- a/games/serializers.py +++ b/games/serializers.py @@ -14,10 +14,11 @@ class GameSerializer(serializers.ModelSerializer): finished = serializers.ReadOnlyField() start_timestamp = serializers.ReadOnlyField() stop_timestamp = serializers.ReadOnlyField() + gamemode = serializers.ReadOnlyField() class Meta: model = GameModel - fields = ["id", "winner_id", "state", "started", "finished", "players", "start_timestamp", "stop_timestamp"] + fields = ["id", "winner_id", "state", "started", "finished", "players", "start_timestamp", "stop_timestamp", "gamemode"] def get_state(self, instance: GameModel): if (instance.finished): diff --git a/matchmaking/consumers.py b/matchmaking/consumers.py index f66a9db..80bceeb 100644 --- a/matchmaking/consumers.py +++ b/matchmaking/consumers.py @@ -39,9 +39,9 @@ class MatchMaking(WebsocketConsumer): self.disconnect(1000) return - if (self.mode < 2 or self.mode > 4): + if (self.gamemode not in ["tictactoe", "pong"]): data: dict = { - "detail": "The mode must be > 1 and < 4.", + "detail": "The gamemode must 'pong' or 'tictactoe'.", } self.send(json.dumps(data)) self.disconnect(1000) @@ -49,8 +49,8 @@ class MatchMaking(WebsocketConsumer): waiting_room.broadcast(f"{len(waiting_room)} / {waiting_room.mode}") if (len(waiting_room) == waiting_room.mode): - game_id: int = GameModel().create(waiting_room.get_users_id()) - waiting_room.broadcast("game_found", {"game_id": game_id}) + game_id: int = GameModel().create(self.gamemode, waiting_room.get_users_id()) + waiting_room.broadcast("game_found", {"game_id": game_id, "gamemode": self.gamemode}) waiting_room.clear() def disconnect(self, close_code): diff --git a/tournament/models.py b/tournament/models.py index 87eb9da..d018193 100644 --- a/tournament/models.py +++ b/tournament/models.py @@ -19,9 +19,10 @@ class TournamentModel(models.Model): level = models.IntegerField() started = models.BooleanField(default = False) finished = models.BooleanField(default = False) + gamemode = models.CharField(max_length = 50, default = "pong") def create_game(self, level, players_id): - game_id = GameModel().create(players_id = players_id) + game_id = GameModel().create(self.gamemode, players_id = players_id) TournamentGamesModel(game_id = game_id, tournament_id = self.pk, tournament_level = level).save() return game_id From cb0cc173ba881921124a5f3e77235543ecf652bb Mon Sep 17 00:00:00 2001 From: starnakin Date: Mon, 25 Mar 2024 16:51:45 +0100 Subject: [PATCH 4/4] game: offline: support mobile --- frontend/static/js/views/GameOfflineView.js | 61 ++++++++++++++++++--- 1 file changed, 52 insertions(+), 9 deletions(-) diff --git a/frontend/static/js/views/GameOfflineView.js b/frontend/static/js/views/GameOfflineView.js index 540110b..1ffc414 100644 --- a/frontend/static/js/views/GameOfflineView.js +++ b/frontend/static/js/views/GameOfflineView.js @@ -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); } }