diff --git a/client/src/components/cryp.list.jsx b/client/src/components/cryp.list.jsx
index a3f094ff..aeae2ffc 100755
--- a/client/src/components/cryp.list.jsx
+++ b/client/src/components/cryp.list.jsx
@@ -27,8 +27,8 @@ function CrypList({
- {cryp.hp.value} / {cryp.stamina.value} HP
-
+ {cryp.hp.base} / {cryp.stamina.base} HP
+
{cryp.xp} / {Math.pow(2, cryp.lvl + 1)} XP
@@ -37,7 +37,7 @@ function CrypList({
@@ -45,7 +45,7 @@ function CrypList({
diff --git a/client/src/components/game.jsx b/client/src/components/game.jsx
index c1944f18..87465d75 100755
--- a/client/src/components/game.jsx
+++ b/client/src/components/game.jsx
@@ -78,8 +78,8 @@ function GamePanel(props) {
- {cryp.hp.value} / {cryp.stamina.value} HP
-
+ {cryp.hp.base} / {cryp.stamina.base} HP
+
{cryp.xp} / {Math.pow(2, cryp.lvl + 1)} XP
@@ -120,8 +120,8 @@ function GamePanel(props) {
- {cryp.hp.value} / {cryp.stamina.value} HP
-
+ {cryp.hp.base} / {cryp.stamina.base} HP
+
{cryp.xp} / {Math.pow(2, cryp.lvl + 1)} XP
diff --git a/client/src/components/passive.node.js b/client/src/components/passive.node.js
index b44f0b63..1a806d37 100755
--- a/client/src/components/passive.node.js
+++ b/client/src/components/passive.node.js
@@ -6,7 +6,7 @@ class PassiveNode extends Phaser.GameObjects.Sprite {
this.setTexture('eye');
this.scene = scene;
this.alloc = alloc;
- this.text = text;
+ this.text = (text.indexOf(',') > -1) ? text.split(',') : text;
this.id = id;
this.setPosition(x, y);
@@ -30,11 +30,7 @@ class PassiveNode extends Phaser.GameObjects.Sprite {
}
allocate(alloc) {
- if (alloc !== undefined) {
- this.alloc = alloc;
- } else {
- this.alloc = !this.alloc;
- }
+ this.alloc = (alloc !== undefined) ? alloc : !this.alloc;
this.updateNode();
}
diff --git a/client/src/components/passive.phaser.js b/client/src/components/passive.phaser.js
index 0ba2fb38..b6407b16 100755
--- a/client/src/components/passive.phaser.js
+++ b/client/src/components/passive.phaser.js
@@ -14,22 +14,22 @@ class PhaserPassives extends Phaser.Scene {
}
create() {
+ this.init();
+ this.addPassiveNodes();
+ this.addCameraControl();
+ this.addEvents();
+ this.drawPassiveEdges();
+ }
+
+ init() {
this.background = this.add.image(0, 0, 'background');
this.background.setScale(5);
this.background.setInteractive();
this.graphics = this.add.graphics();
- this.nodeText = this.add.text(10000, 10000, 'grep', {
- fontSize: '32px',
- fontFamily: 'Arial',
- color: '#ffffff',
- backgroundColor: '#000000',
- }).setPadding(32);
-
+ this.textGraphic = new Phaser.GameObjects.Graphics(this);
+ this.add.existing(this.textGraphic);
this.passiveNodeData = passiveDataNode;
this.passiveEdgeData = passiveDataEdge;
- this.addPassiveNodes();
- this.drawPassiveEdges();
- this.addCanmeraControl();
}
addPassiveNodes() {
@@ -39,15 +39,28 @@ class PhaserPassives extends Phaser.Scene {
new PassiveNode(this, n.x, n.y, n.id, n.alloc, n.text)
).setInteractive();
});
+ }
+ addCameraControl() {
+ this.controls = new Phaser.Cameras.Controls.SmoothedKeyControl({
+ camera: this.cameras.main,
+ zoomIn: this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.Q),
+ zoomOut: this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.E),
+ acceleration: 0.005,
+ drag: 0.0005,
+ maxSpeed: 0.001,
+ });
+ }
+
+ addEvents() {
this.input.on('pointerover', (pointer, gameObjects) => {
if (gameObjects[0] instanceof PassiveNode) {
- if (!gameObjects[0].alloc) gameObjects[0].setTint(0xff00ff);
- this.nodeText.x = pointer.x + this.cameras.main.scrollX;
- this.nodeText.y = pointer.y + this.cameras.main.scrollY;
- this.nodeText.text = gameObjects[0].text;
- } else {
- this.nodeText.text = '';
+ if (!gameObjects[0].alloc) {
+ gameObjects[0].setTint(0xff00ff);
+ }
+ this.displayPassiveText(gameObjects[0], pointer);
+ } else if (this.nodeText) {
+ this.nodeText.destroy();
}
});
this.input.on('pointerout', (pointer, gameObjects) => {
@@ -65,7 +78,13 @@ class PhaserPassives extends Phaser.Scene {
}
}
});
-
+ this.input.on('pointermove', (pointer) => {
+ if (this.pan) {
+ const points = pointer.getInterpolatedPosition(2);
+ this.cameras.main.scrollX -= (points[1].x - points[0].x) * 2;
+ this.cameras.main.scrollY -= (points[1].y - points[0].y) * 2;
+ }
+ }, this);
this.input.keyboard.on('keydown_A', () => {
this.updatePassives(); // Will update nodes from state
}, 0, this);
@@ -87,22 +106,18 @@ class PhaserPassives extends Phaser.Scene {
});
}
- addCanmeraControl() {
- this.input.on('pointermove', (pointer) => {
- if (this.pan) {
- const points = pointer.getInterpolatedPosition(2);
- this.cameras.main.scrollX -= (points[1].x - points[0].x) * 2;
- this.cameras.main.scrollY -= (points[1].y - points[0].y) * 2;
- }
- }, this);
- this.controls = new Phaser.Cameras.Controls.SmoothedKeyControl({
- camera: this.cameras.main,
- zoomIn: this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.Q),
- zoomOut: this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.E),
- acceleration: 0.005,
- drag: 0.0005,
- maxSpeed: 0.001,
- });
+ displayPassiveText(node, pointer) {
+ this.nodeText = this.add.text(0, 0, '', {
+ fontSize: '20px',
+ fontFamily: 'Arial',
+ color: '#ffffff',
+ backgroundColor: '#222222',
+ }).setPadding(32);
+ this.nodeText.setScale(1 / this.cameras.main.zoom);
+ this.nodeText.setWordWrapWidth(450);
+ this.nodeText.setPosition(node.x, node.y);
+ this.nodeText.setOrigin(pointer.x >= 600 ? 1 : 0, pointer.y >= 450 ? 1 : 0);
+ this.nodeText.text = node.text;
}
updatePassives() {
diff --git a/client/src/components/phaser.container.jsx b/client/src/components/phaser.container.jsx
index 75460513..dbb384a0 100755
--- a/client/src/components/phaser.container.jsx
+++ b/client/src/components/phaser.container.jsx
@@ -25,13 +25,13 @@ class PhaserInstance extends preact.Component {
const otherTeams = nextProps.game.teams.filter(t => t.id !== nextProps.account.id);
if (playerTeam && otherTeams[0] && this.PhaserCombat.loaded) {
- this.PhaserCombat.setPlayerOneHp(`${playerTeam.cryps[0].hp.value.toString()} / ${playerTeam.cryps[0].stamina.value.toString()} HP`);
- this.PhaserCombat.setPlayerTwoHp(`${otherTeams[0].cryps[0].hp.value.toString()} / ${otherTeams[0].cryps[0].stamina.value.toString()} HP`);
+ this.PhaserCombat.setPlayerOneHp(`${playerTeam.cryps[0].hp.base.toString()} / ${playerTeam.cryps[0].stamina.base.toString()} HP`);
+ this.PhaserCombat.setPlayerTwoHp(`${otherTeams[0].cryps[0].hp.base.toString()} / ${otherTeams[0].cryps[0].stamina.base.toString()} HP`);
- if (playerTeam.cryps[0].hp.value === 0) {
+ if (playerTeam.cryps[0].hp.base === 0) {
// this.PhaserCombat.skills('blast', 400, -150);
this.PhaserCombat.skills('chargeBall', 'green', 400, -250);
- } else if (otherTeams[0].cryps[0].hp.value === 0) {
+ } else if (otherTeams[0].cryps[0].hp.base === 0) {
// this.PhaserCombat.skills('blast', 180, 150);
this.PhaserCombat.skills('chargeBall', 'green', 180, 250);
}