diff --git a/client/src/scenes/home.cryps.js b/client/src/scenes/home.cryps.js index fbd7e535..418e2826 100644 --- a/client/src/scenes/home.cryps.js +++ b/client/src/scenes/home.cryps.js @@ -7,7 +7,7 @@ const genAvatar = require('./avatar'); const ROW_HEIGHT = CRYP_LIST.height() * 0.2; const ROW_WIDTH = CRYP_LIST.width(); -const menuY = CRYP_LIST.height(); +const menuY = CRYP_LIST.height() * 1.6; const KEY_MAP = [ 'keydown-ONE', @@ -35,7 +35,6 @@ class HomeCrypList extends Phaser.Scene { this.registry.events.on('changedata', this.updateData, this); this.registry.events.on('setdata', this.updateData, this); const cryps = this.registry.get('crypList'); - const playerList = this.registry.get('playerList'); if (!cryps) return true; @@ -98,24 +97,21 @@ class HomeCrypList extends Phaser.Scene { .text(spawn.getCenter().x, spawn.getCenter().y, '+', TEXT.HEADER) .setOrigin(0.5, 0.5); - const addInstance = (player, i) => { - const joinNormal = this.add - .rectangle(ROW_WIDTH * 0.1, menuY + ROW_HEIGHT * 0.75 * (i + 1), ROW_WIDTH, ROW_HEIGHT * 0.5, 0x888888) - .setInteractive() - .setOrigin(0) - .on('pointerdown', () => { - this.game.events.emit('SET_PLAYER', player); - }); - this.add - .text(joinNormal.getCenter().x, joinNormal.getCenter().y, `${player.instance}`, TEXT.NORMAL) - .setOrigin(0.5, 0.5); - }; + const joinNormal = this.add + .rectangle(ROW_WIDTH * 0.3, menuY, ROW_WIDTH * 0.4, ROW_HEIGHT * 0.5, 0x888888) + .setInteractive() + .setOrigin(0) + .on('pointerdown', () => { + const playerCryps = []; + this.activeCryps.forEach(obj => playerCryps.push(obj.cryp.id)); + ws.sendPlayerCrypsSet(NULL_UUID, playerCryps); + }); + this.add + .text(joinNormal.getCenter().x, joinNormal.getCenter().y, 'Join Normal', TEXT.HEADER) + .setOrigin(0.5, 0.5); - playerList.forEach(addInstance); - - - const newInstance = this.add - .rectangle(ROW_WIDTH * 0.4, menuY, ROW_WIDTH * 0.6, ROW_HEIGHT * 0.5, 0x888888) + const joinInstance = this.add + .rectangle(ROW_WIDTH * 0.8, menuY, ROW_WIDTH * 0.4, ROW_HEIGHT * 0.5, 0x888888) .setInteractive() .setOrigin(0) .on('pointerdown', () => { @@ -124,7 +120,7 @@ class HomeCrypList extends Phaser.Scene { ws.sendInstanceJoin(playerCryps); }); this.add - .text(newInstance.getCenter().x, newInstance.getCenter().y, 'New Instance', TEXT.HEADER) + .text(joinInstance.getCenter().x, joinInstance.getCenter().y, 'New Instance', TEXT.HEADER) .setOrigin(0.5, 0.5); return this; diff --git a/client/src/scenes/home.instances.js b/client/src/scenes/home.instances.js new file mode 100644 index 00000000..2d3bf5cb --- /dev/null +++ b/client/src/scenes/home.instances.js @@ -0,0 +1,38 @@ +const Phaser = require('phaser'); +const { POSITIONS: { MENU_MAIN }, TEXT } = require('./constants'); + +const X = MENU_MAIN.x(); +const Y = MENU_MAIN.y(); +const WIDTH = MENU_MAIN.width(); +const HEIGHT = MENU_MAIN.height(); + +class HomeRankings extends Phaser.Scene { + constructor() { + super({ key: 'HomeInstances' }); + } + + create() { + this.add.text(X, Y, 'Instances Scene', TEXT.HEADER); + const playerList = this.registry.get('playerList'); + const addInstance = (player, i) => { + const joinNormal = this.add + .rectangle(X, Y + HEIGHT * 0.15 * (i + 1), WIDTH * 0.5, HEIGHT * 0.1, 0x888888) + .setInteractive() + .setOrigin(0) + .on('pointerdown', () => { + this.game.events.emit('SET_PLAYER', player); + }); + this.add + .text(joinNormal.getCenter().x, joinNormal.getCenter().y, `${player.instance}`, TEXT.NORMAL) + .setOrigin(0.5, 0.5); + }; + + playerList.forEach(addInstance); + } + + cleanUp() { + this.scene.remove(); + } +} + +module.exports = HomeRankings; diff --git a/client/src/scenes/home.js b/client/src/scenes/home.js index eb06b91f..2f7789a3 100644 --- a/client/src/scenes/home.js +++ b/client/src/scenes/home.js @@ -6,6 +6,7 @@ const HomeNavigation = require('./home.navigation'); const HomeRankings = require('./home.rankings'); const HomeNews = require('./home.news'); const HomeShop = require('./home.shop'); +const HomeInstances = require('./home.instances'); const FIXED_SCENES = [ 'HomeCryps', @@ -16,6 +17,7 @@ const VAR_SCENES = [ 'HomeRankings', 'HomeNews', 'HomeShop', + 'HomeInstances', ]; class Home extends Phaser.Scene { @@ -24,6 +26,8 @@ class Home extends Phaser.Scene { } create() { + this.registry.get('ws').sendAccountPlayers(); + this.registry.events.on('changedata', this.updateData, this); this.registry.events.on('setdata', this.updateData, this); this.scene.manager.add('HomeCryps', HomeCryps, true); @@ -38,6 +42,7 @@ class Home extends Phaser.Scene { switch (key) { case 'game': return this.cleanUp(); case 'menu': return this.cleanUp(); + case 'homeInstances': return this.newMainScene('HomeInstances', HomeInstances, data); case 'homeRankings': return this.newMainScene('HomeRankings', HomeRankings, data); case 'homeNews': return this.newMainScene('HomeNews', HomeNews, data); case 'homeShop': return this.newMainScene('HomeShop', HomeShop, data); diff --git a/client/src/scenes/home.navigation.js b/client/src/scenes/home.navigation.js index c1c0e547..8f2249f1 100644 --- a/client/src/scenes/home.navigation.js +++ b/client/src/scenes/home.navigation.js @@ -42,6 +42,15 @@ class HomeNavigation extends Phaser.Scene { .text(shop.getCenter().x, shop.getCenter().y, 'Shop', TEXT.HEADER) .setOrigin(0.5, 0.5); shop.on('pointerdown', () => this.registry.set('homeShop', true)); + + const instances = this.add + .rectangle(X + BTN_WIDTH * 4.5, Y, BTN_WIDTH, BTN_HEIGHT, 0x222222) + .setInteractive() + .setOrigin(0); + this.add + .text(instances.getCenter().x, instances.getCenter().y, 'Instances', TEXT.HEADER) + .setOrigin(0.5, 0.5); + instances.on('pointerdown', () => this.registry.set('homeInstances', true)); } cleanUp() { diff --git a/client/src/scenes/menu.navigation.js b/client/src/scenes/menu.navigation.js index fb8a460c..b6f72656 100644 --- a/client/src/scenes/menu.navigation.js +++ b/client/src/scenes/menu.navigation.js @@ -28,19 +28,18 @@ class MenuNavigation extends Phaser.Scene { .text(ready.getCenter().x, ready.getCenter().y, 'Ready', TEXT.HEADER) .setOrigin(0.5, 0.5); ready.on('pointerdown', () => { - console.log(player); ws.sendInstanceReady(player.instance); }); - // const leave = this.add - // .rectangle(BTN_WIDTH * 3, BTN_HEIGHT, BTN_WIDTH, BTN_HEIGHT, 0x440000) - // .setInteractive() - // .setOrigin(0) - // .on('pointerdown', () => this.registry.set('home', true)); + const menu = this.add + .rectangle(BTN_WIDTH * 3, BTN_HEIGHT, BTN_WIDTH, BTN_HEIGHT, 0x440000) + .setInteractive() + .setOrigin(0) + .on('pointerdown', () => this.registry.set('home', true)); - // this.add - // .text(leave.getCenter().x, leave.getCenter().y, 'Leave', TEXT.HEADER) - // .setOrigin(0.5, 0.5); + this.add + .text(menu.getCenter().x, menu.getCenter().y, 'Menu', TEXT.HEADER) + .setOrigin(0.5, 0.5); } cleanUp() { diff --git a/client/src/socket.js b/client/src/socket.js index 0db1d72f..37f18af7 100644 --- a/client/src/socket.js +++ b/client/src/socket.js @@ -157,7 +157,6 @@ function createSocket(events) { account = login; events.setAccount(login); sendAccountCryps(); - sendAccountPlayers(); } function accountPlayerList(res) {