From 9f2de11ba54fbd4e4e23f49a7ca8f30b7d34f8ad Mon Sep 17 00:00:00 2001 From: Descatres <73725403+Descatres@users.noreply.github.com> Date: Wed, 30 Nov 2022 14:47:42 +0000 Subject: [PATCH] Main menu added (#27) * Main menu added * code organized * Some changes to main menu * game.html and index.html - game.html receives via GET params the username, ip and port * form working Co-authored-by: Miguel Dinis --- client/game.html | 139 +++++++++++++++++++++++++++ client/img/header.png | Bin 0 -> 21326 bytes client/index.html | 212 +++++++++++++++++++----------------------- client/src/main.js | 73 ++++++++++----- 4 files changed, 288 insertions(+), 136 deletions(-) create mode 100644 client/game.html create mode 100644 client/img/header.png diff --git a/client/game.html b/client/game.html new file mode 100644 index 0000000..b301291 --- /dev/null +++ b/client/game.html @@ -0,0 +1,139 @@ + + + + + + + + + +
+
+
+
+
+
+
+
+
+
+ 1st +
+
+ + + + + + + +
+
+
+
+ HP: 34/100 +
+ +
+
+ XP: 420 +
+
+
+ + + + + diff --git a/client/img/header.png b/client/img/header.png new file mode 100644 index 0000000000000000000000000000000000000000..55f3c9687f5a8c84432f058ddb17afb973ccde70 GIT binary patch literal 21326 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 literal 0 HcmV?d00001 diff --git a/client/index.html b/client/index.html index 40fb763..b63b360 100644 --- a/client/index.html +++ b/client/index.html @@ -1,132 +1,116 @@ - -
-
-
-
-
-
+
-
-
-
- 1st -
-
- - - - - - - -
-
-
- HP: 34/100 -
- -
-
- XP: 420 -
+
+
+ +
+
+ +
+
+ +
+ +
+ Connect +
+
- diff --git a/client/src/main.js b/client/src/main.js index 419ba11..ed3a44b 100644 --- a/client/src/main.js +++ b/client/src/main.js @@ -4,6 +4,22 @@ import { load, drawMap, updatePlayers, updateMap } from "./map-rendering.js"; import { updateHUD } from "./ui.js"; import { sendMessage, interpretMessage } from "./socket.js"; +let params = new URL(document.location).searchParams; +let ipAddress = params.get("ip"); +let port = params.get("port"); +let username = params.get("username"); + +if ( + ipAddress == null || + username == null || + port == null || + ipAddress === "" || + port === "" || + username === "" +) { + location.replace("/"); +} + /** * Game Config Object */ @@ -64,21 +80,21 @@ var music_config = { detune: 0, seek: 0, loop: true, - delay: 0 -} + delay: 0, +}; /** * Sound effects config */ - var sound_effect_config = { +var sound_effect_config = { mute: false, volume: 0.3, rate: 1, detune: 0, seek: 0, loop: false, - delay: 0 -} + delay: 0, +}; var char_color = "blue"; // Color of slime. Make this change variable be attributed by server in future @@ -134,7 +150,7 @@ var skill_elems = [ /** * Websocket to communicate with the server. */ -const socket = new WebSocket("ws://172.31.64.1:8765"); +const socket = new WebSocket("ws://" + ipAddress + ":" + port); /** * Socket onMessage event. This function gets called whenever a message is received from the server. @@ -317,7 +333,7 @@ function update(time, delta) { incrementTimer; // allows new sound effect to be played - if(parseFloat(timer_bar.style.width) < new_width) { + if (parseFloat(timer_bar.style.width) < new_width) { sound_effect_played = false; } @@ -330,13 +346,14 @@ function update(time, delta) { timer_bar.style.backgroundColor = "red"; } - /* INPUT HANDLING */ if (cursors.left.isDown) { let msg = { type: "input", action: "ML" }; sendMessage(socket, msg); - if(!sound_effect_played) { - this.sound.add("move_sound_effect").play(sound_effect_config); + if (!sound_effect_played) { + this.sound + .add("move_sound_effect") + .play(sound_effect_config); sound_effect_played = true; } @@ -346,8 +363,10 @@ function update(time, delta) { } else if (cursors.right.isDown) { let msg = { type: "input", action: "MR" }; sendMessage(socket, msg); - if(!sound_effect_played) { - this.sound.add("move_sound_effect").play(sound_effect_config); + if (!sound_effect_played) { + this.sound + .add("move_sound_effect") + .play(sound_effect_config); sound_effect_played = true; } @@ -356,8 +375,10 @@ function update(time, delta) { } else if (cursors.up.isDown) { let msg = { type: "input", action: "MU" }; sendMessage(socket, msg); - if(!sound_effect_played) { - this.sound.add("move_sound_effect").play(sound_effect_config); + if (!sound_effect_played) { + this.sound + .add("move_sound_effect") + .play(sound_effect_config); sound_effect_played = true; } @@ -366,8 +387,10 @@ function update(time, delta) { } else if (cursors.down.isDown) { let msg = { type: "input", action: "MD" }; sendMessage(socket, msg); - if(!sound_effect_played) { - this.sound.add("move_sound_effect").play(sound_effect_config); + if (!sound_effect_played) { + this.sound + .add("move_sound_effect") + .play(sound_effect_config); sound_effect_played = true; } @@ -376,22 +399,28 @@ function update(time, delta) { } else if (Phaser.Input.Keyboard.JustDown(qKey)) { let msg = { type: "input", action: "HV" }; sendMessage(socket, msg); - if(!sound_effect_played) { - this.sound.add("harvest_sound_effect").play(sound_effect_config); + if (!sound_effect_played) { + this.sound + .add("harvest_sound_effect") + .play(sound_effect_config); sound_effect_played = true; } } else if (Phaser.Input.Keyboard.JustDown(wKey)) { let msg = { type: "input", action: "SO" }; sendMessage(socket, msg); - if(!sound_effect_played) { - this.sound.add("sow_sound_effect").play(sound_effect_config); + if (!sound_effect_played) { + this.sound + .add("sow_sound_effect") + .play(sound_effect_config); sound_effect_played = true; } } else if (Phaser.Input.Keyboard.JustDown(eKey)) { let msg = { type: "input", action: "XP" }; sendMessage(socket, msg); - if(!sound_effect_played) { - this.sound.add("save_sound_effect").play(sound_effect_config); + if (!sound_effect_played) { + this.sound + .add("save_sound_effect") + .play(sound_effect_config); sound_effect_played = true; } }