diff --git a/client/src/components/body.component.jsx b/client/src/components/body.component.jsx index cc3dc3ac..bf3287c5 100755 --- a/client/src/components/body.component.jsx +++ b/client/src/components/body.component.jsx @@ -12,7 +12,7 @@ const Passives = require('./passive.container'); const addState = connect( (state) => { - const { game, ws, account } = state; + const { game, ws } = state; if (!game) { ws.clearGameStateInterval(); } @@ -28,7 +28,6 @@ const addState = connect( function renderBody(props) { const { game, setGame, account } = props; - console.log('grep'); if (game) { return (
diff --git a/client/src/components/passive.container.jsx b/client/src/components/passive.container.jsx index 84d42e9a..7f1d3702 100755 --- a/client/src/components/passive.container.jsx +++ b/client/src/components/passive.container.jsx @@ -1,7 +1,7 @@ const preact = require('preact'); const { connect } = require('preact-redux'); const Phaser = require('phaser'); -const PhaserPassives = require('./phaser.passives'); +const PhaserPassives = require('./passive.phaser'); const addState = connect( function receiveState(state) { diff --git a/client/src/components/passive.data.edge.js b/client/src/components/passive.data.edge.js new file mode 100755 index 00000000..fdbf2460 --- /dev/null +++ b/client/src/components/passive.data.edge.js @@ -0,0 +1,121 @@ +const passiveEdges = [ + ['CMED1', 'CSTAT7'], + ['CSTAT7', 'CSTAT8'], + ['CSTAT8', 'CSTAT9'], + ['CSTAT9', 'CMED20'], + ['CMED20', 'CSTAT10'], + ['CSTAT10', 'CSTAT11'], + ['CSTAT11', 'CSTAT12'], + ['CSTAT12', 'CMED21'], + ['CMED21', 'CSTAT15'], + ['CSTAT15', 'CMED22'], + ['CMED21', 'CSTAT14'], + ['CSTAT14', 'CLRG4'], + ['CLRG4', 'CSTAT16'], + ['CSTAT16', 'CMED22'], + ['CMED22', 'CSTAT17'], + ['CMED23', 'CSTAT17'], + ['CMED23', 'CSTAT13'], + ['CSTAT13', 'CLRG4'], + ['CSTAT17', 'CSTAT18'], + ['CSTAT18', 'CSTAT19'], + ['CSTAT18', 'CSTAT20'], + ['CSTAT20', 'CSTAT21'], + ['CSTAT21', 'CSTAT22'], + ['CSTAT22', 'CMED9'], + ['CMED9', 'CSTAT23'], + ['CSTAT23', 'CSTAT24'], + ['CSTAT24', 'CLRG2'], + ['CLRG2', 'CSTAT25'], + ['CSTAT25', 'CMED8'], + ['CMED8', 'CSTAT26'], + ['CSTAT26', 'CLRG1'], + ['CLRG1', 'CSTAT27'], + ['CSTAT27', 'CSTAT28'], + ['CMED7', 'CSTAT28'], + ['CMED7', 'CSTAT29'], + ['CSTAT29', 'CSTAT30'], + ['CSTAT30', 'CSTAT31'], + ['CSTAT31', 'CSTAT32'], + ['CSTAT32', 'CSTAT33'], + ['CSTAT31', 'CSTAT34'], + ['CSTAT34', 'CSTAT35'], + ['CSTAT34', 'CSTAT36'], + ['CSTAT36', 'CSTAT37'], + ['CSTAT20', 'CSTAT36'], + ['CMED6', 'CSTAT33'], + ['CMED25', 'CSTAT18'], + ['CMED25', 'CMED24'], + ['CMED24', 'CLRG3'], + ['CSTAT6', 'CSTAT7'], + ['CSTAT6', 'CMED18'], + ['CMED2', 'CSDMG1'], + ['CSDMG1', 'CSDMG2'], + ['CSDMG2', 'CSDMG3'], + ['CMED18', 'CSDMG3'], + ['CMED2', 'CHEAL1'], + ['CHEAL1', 'CHEAL2'], + ['CHEAL2', 'CHEAL3'], + ['CHEAL3', 'CMED18'], + ['CMED18', 'CSDMG4'], + ['CSDMG4', 'CSDMG5'], + ['CSDMG5', 'CSDMG6'], + ['CSDMG5', 'CSTAT5'], + ['CSTAT5', 'CSTAT4'], + ['CSTAT4', 'CMED3'], + ['CMED3', 'CSTAT1'], + ['CSTAT1', 'CSTAT2'], + ['CSTAT1', 'CSTAT3'], + ['CSTAT2', 'CMED4'], + ['CMED4', 'CSDMG10'], + ['CSDMG10', 'CMED5'], + ['CMED5', 'CSDMG11'], + ['CSDMG11', 'CMED6'], + ['CMED4', 'CPHYS2'], + ['CPHYS2', 'CMED5'], + ['CMED5', 'CPHYS3'], + ['CPHYS3', 'CMED6'], + ['CSTAT3', 'CMED10'], + ['CMED10', 'CPHYS1'], + ['CPHYS1', 'CMED11'], + ['CMED10', 'CHEAL14'], + ['CHEAL14', 'CMED11'], + ['CMED11', 'CHEAL15'], + ['CHEAL15', 'CMED13'], + ['CMED13', 'CSDMG6'], + ['CPHYS4', 'CMED11'], + ['CPHYS4', 'CMED13'], + ['CPHYS4', 'CPHYS5'], + ['CPHYS5', 'CPHYS6'], + ['CPHYS6', 'CMED12'], + ['CPHYS6', 'CSTAT34'], + ['CMED12', 'CPHYS7'], + ['CPHYS7', 'CSTAT33'], + ['CMED13', 'CSDMG7'], + ['CSDMG7', 'CSDMG9'], + ['CSDMG7', 'CMED15'], + ['CSDMG9', 'CSTAT37'], + ['CSDMG9', 'CSTAT35'], + ['CMED18', 'CHEAL4'], + ['CHEAL4', 'CHEAL5'], + ['CHEAL5', 'CHEAL6'], + ['CHEAL6', 'CHEAL7'], + ['CHEAL7', 'CHEAL8'], + ['CHEAL7', 'CHEAL9'], + ['CHEAL8', 'CMED20'], + ['CHEAL9', 'CMED16'], + ['CHEAL5', 'CMED19'], + ['CMED16', 'CHEAL11'], + ['CHEAL11', 'CHEAL12'], + ['CHEAL12', 'CHEAL13'], + ['CHEAL13', 'CMED17'], + ['CHEAL13', 'CSTAT19'], + ['CMED15', 'CHEAL10'], + ['CHEAL10', 'CMED16'], + ['CMED15', 'CSDMG8'], + ['CSDMG8', 'CMED16'], + ['CMED14', 'CMED15'], + ['CMED8', 'CNOTE'], +]; + +module.exports = passiveEdges; diff --git a/client/src/components/passive.data.node.js b/client/src/components/passive.data.node.js new file mode 100755 index 00000000..6d22d02a --- /dev/null +++ b/client/src/components/passive.data.node.js @@ -0,0 +1,104 @@ +const passiveNodes = [ + { x: 860, y: 1011, id: 'CMED1', alloc: false }, + { x: 905, y: 970, id: 'CSTAT7', alloc: false }, + { x: 940, y: 917.5, id: 'CSTAT8', alloc: false }, + { x: 950, y: 1172.5, id: 'CMED2', alloc: false }, + { x: 955, y: 1120, id: 'CSDMG1', alloc: false }, + { x: 965, y: 1082.5, id: 'CSDMG2', alloc: false }, + { x: 970, y: 872.5, id: 'CSTAT9', alloc: false }, + { x: 975, y: 1012.5, id: 'CSTAT6', alloc: false }, + { x: 995, y: 1062.5, id: 'CSDMG3', alloc: false }, + { x: 1000, y: 1150, id: 'CHEAL1', alloc: false }, + { x: 1005, y: 812.5, id: 'CMED20', alloc: false }, + { x: 1024.5, y: 1122.5, id: 'CHEAL2', alloc: false }, + { x: 1036.5, y: 896.5, id: 'CMED19', alloc: false }, + { x: 1036.5, y: 1042.5, id: 'CMED18', alloc: false }, + { x: 1036.5, y: 1082.5, id: 'CHEAL3', alloc: false }, + { x: 1041.5, y: 772.5, id: 'CSTAT10', alloc: false }, + { x: 1055, y: 1327.5, id: 'CMED3', alloc: false }, + { x: 1066.5, y: 939.5, id: 'CHEAL5', alloc: false }, + { x: 1067.5, y: 995, id: 'CHEAL4', alloc: false }, + { x: 1070, y: 1250, id: 'CSTAT4', alloc: false }, + { x: 1072.5, y: 840.5, id: 'CHEAL8', alloc: false }, + { x: 1087.5, y: 700, id: 'CSTAT11', alloc: false }, + { x: 1097.5, y: 1052.5, id: 'CSDMG4', alloc: false }, + { x: 1102.5, y: 1140, id: 'CSTAT5', alloc: false }, + { x: 1102.5, y: 917.5, id: 'CHEAL6', alloc: false }, + { x: 1115, y: 1332.5, id: 'CSTAT1', alloc: false }, + { x: 1115, y: 875, id: 'CHEAL7', alloc: false }, + { x: 1130, y: 640, id: 'CSTAT12', alloc: false }, + { x: 1145, y: 1287.5, id: 'CSTAT3', alloc: false }, + { x: 1145, y: 1057.5, id: 'CSDMG5', alloc: false }, + { x: 1175, y: 1332.5, id: 'CSTAT2', alloc: false }, + { x: 1180, y: 1247.5, id: 'CMED10', alloc: false }, + { x: 1180, y: 950, id: 'CMED14', alloc: false }, + { x: 1195, y: 875, id: 'CHEAL9', alloc: false }, + { x: 1196.5, y: 635, id: 'CMED21', alloc: false }, + { x: 1205, y: 1062.5, id: 'CSDMG6', alloc: false }, + { x: 1212.5, y: 1200, id: 'CHEAL14', alloc: false }, + { x: 1231.5, y: 590, id: 'CSTAT14', alloc: false }, + { x: 1235, y: 772.5, id: 'CHEAL12', alloc: false }, + { x: 1240, y: 1225, id: 'CPHYS1', alloc: false }, + { x: 1240, y: 1322.5, id: 'CMED4', alloc: false }, + { x: 1258.5, y: 1107.5, id: 'CHEAL15', alloc: false }, + { x: 1260, y: 917.5, id: 'CHEAL10', alloc: false }, + { x: 1263, y: 520, id: 'CLRG4', alloc: false }, + { x: 1273.5, y: 1057.5, id: 'CMED13', alloc: false }, + { x: 1275, y: 1167.5, id: 'CMED11', alloc: false }, + { x: 1275, y: 947.5, id: 'CMED15', alloc: false }, + { x: 1277.5, y: 872.5, id: 'CMED16', alloc: false }, + { x: 1278.5, y: 812.5, id: 'CHEAL11', alloc: false }, + { x: 1280, y: 732.5, id: 'CHEAL13', alloc: false }, + { x: 1281.5, y: 1002.5, id: 'CSDMG7', alloc: false }, + { x: 1284, y: 640, id: 'CSTAT15', alloc: false }, + { x: 1298.5, y: 1107.5, id: 'CPHYS4', alloc: false }, + { x: 1302.5, y: 917.5, id: 'CSDMG8', alloc: false }, + { x: 1305, y: 1307.5, id: 'CPHYS2', alloc: false }, + { x: 1306, y: 1347.5, id: 'CSDMG10', alloc: false }, + { x: 1315, y: 762.5, id: 'CMED17', alloc: false }, + { x: 1326.5, y: 590, id: 'CSTAT16', alloc: false }, + { x: 1346.5, y: 635, id: 'CMED22', alloc: false }, + { x: 1348.5, y: 535, id: 'CSTAT13', alloc: false }, + { x: 1355, y: 1322.5, id: 'CMED5', alloc: false }, + { x: 1360, y: 1002.5, id: 'CSDMG9', alloc: false }, + { x: 1399.5, y: 1107.5, id: 'CPHYS5', alloc: false }, + { x: 1400, y: 807.5, id: 'CMED24', alloc: false }, + { x: 1409.5, y: 1312.5, id: 'CPHYS3', alloc: false }, + { x: 1410, y: 1347.5, id: 'CSDMG11', alloc: false }, + { x: 1410, y: 532.5, id: 'CMED23', alloc: false }, + { x: 1420, y: 732.5, id: 'CSTAT19', alloc: false }, + { x: 1430, y: 1205, id: 'CPHYS7', alloc: false }, + { x: 1447.5, y: 765, id: 'CMED25', alloc: false }, + { x: 1452.5, y: 1322.5, id: 'CMED6', alloc: false }, + { x: 1455, y: 1267.5, id: 'CSTAT33', alloc: false }, + { x: 1455, y: 1147.5, id: 'CMED12', alloc: false }, + { x: 1455, y: 1042.5, id: 'CSTAT35', alloc: false }, + { x: 1457.5, y: 975, id: 'CSTAT37', alloc: false }, + { x: 1462.5, y: 825, id: 'CLRG3', alloc: false }, + { x: 1485, y: 640, id: 'CSTAT17', alloc: false }, + { x: 1500, y: 1110, id: 'CPHYS6', alloc: false }, + { x: 1505, y: 1242.5, id: 'CSTAT32', alloc: false }, + { x: 1555, y: 1242.5, id: 'CSTAT31', alloc: false }, + { x: 1555, y: 1067.5, id: 'CSTAT34', alloc: false }, + { x: 1555, y: 962.5, id: 'CSTAT36', alloc: false }, + { x: 1555, y: 847.5, id: 'CSTAT20', alloc: false }, + { x: 1555, y: 732.5, id: 'CSTAT18', alloc: false }, + { x: 1597.5, y: 827.5, id: 'CSTAT21', alloc: false }, + { x: 1607.5, y: 1277.5, id: 'CSTAT30', alloc: false }, + { x: 1612.5, y: 1137.5, id: 'CLRG1', alloc: false }, + { x: 1612.5, y: 955, id: 'CLRG2', alloc: false }, + { x: 1657.5, y: 822.5, id: 'CSTAT22', alloc: false }, + { x: 1657.5, y: 1312.5, id: 'CSTAT29', alloc: false }, + { x: 1685, y: 1187.5, id: 'CSTAT27', alloc: false }, + { x: 1685, y: 1022.5, id: 'CSTAT25', alloc: false }, + { x: 1690, y: 1117.5, id: 'CSTAT26', alloc: false }, + { x: 1705, y: 960, id: 'CSTAT24', alloc: false }, + { x: 1712.5, y: 850, id: 'CMED9', alloc: false }, + { x: 1717.5, y: 1267.5, id: 'CMED7', alloc: false }, + { x: 1725, y: 1222.5, id: 'CSTAT28', alloc: false }, + { x: 1727.5, y: 1062.5, id: 'CMED8', alloc: false }, + { x: 1737.5, y: 917.5, id: 'CSTAT23', alloc: false }, + { x: 1830, y: 1032.5, id: 'CNOTE', alloc: false }, +]; + +module.exports = passiveNodes; diff --git a/client/src/components/passive.node.js b/client/src/components/passive.node.js index 65323ec0..2d716cc2 100755 --- a/client/src/components/passive.node.js +++ b/client/src/components/passive.node.js @@ -9,8 +9,20 @@ class PassiveNode extends Phaser.GameObjects.Sprite { this.alloc = alloc; this.id = id; this.setPosition(x, y); - this.setScale(0.25); - + const nodeNoDigits = this.id.replace(/[0-9]/g, ''); + switch (nodeNoDigits) { + case 'CNOTE': + this.setScale(0.25); + break; + case 'CLRG': + this.setScale(0.15); + break; + case 'CMED': + this.setScale(0.1); + break; + default: + this.setScale(0.05); + } if (this.alloc) { this.setTint(0xff0000); } diff --git a/client/src/components/phaser.passives.js b/client/src/components/passive.phaser.js similarity index 77% rename from client/src/components/phaser.passives.js rename to client/src/components/passive.phaser.js index 53c689bb..bed28422 100755 --- a/client/src/components/phaser.passives.js +++ b/client/src/components/passive.phaser.js @@ -1,6 +1,7 @@ const Phaser = require('phaser'); const PassiveNode = require('./passive.node'); - +const passiveDataNode = require('./passive.data.node'); +const passiveDataEdge = require('./passive.data.edge'); class PhaserPassives extends Phaser.Scene { preload() { @@ -8,24 +9,12 @@ class PhaserPassives extends Phaser.Scene { } create() { - this.passiveNodes = [ - { x: 400, y: 300, id: 'A', alloc: false }, - { x: 100, y: 100, id: 'B', alloc: false }, - { x: 300, y: 200, id: 'C', alloc: false }, - { x: 300, y: 800, id: 'D', alloc: false }, - { x: 600, y: 500, id: 'E', alloc: false }, - { x: 700, y: 400, id: 'F', alloc: false }]; - - this.passiveEdges = [ - ['A', 'B'], - ['F', 'A'], - ['D', 'A'], - ]; - this.graphics = this.add.graphics(); - this.addCamera(); + this.passiveNodes = passiveDataNode; + this.passiveEdges = passiveDataEdge; this.addPassiveNodes(); this.drawPassiveEdges(); + this.addCamera(); } addPassiveNodes() { @@ -54,10 +43,11 @@ class PhaserPassives extends Phaser.Scene { this.passiveEdges.forEach((e) => { const drawEdge = this.passiveNodes.filter(n => (e[0] === n.id || e[1] === n.id)); if (drawEdge[0].alloc && drawEdge[1].alloc) { - this.graphics.lineStyle(50, 0xfff00f, 0.2); + this.graphics.lineStyle(10, 0xfff00f, 0.2); } else { - this.graphics.lineStyle(10, 0x00ffff, 0.2); + this.graphics.lineStyle(2, 0xffffff, 0.2); } + // console.log(drawEdge); this.graphics.lineBetween(drawEdge[0].x, drawEdge[0].y, drawEdge[1].x, drawEdge[1].y); }); } diff --git a/client/src/components/phaser.container.jsx b/client/src/components/phaser.container.jsx index 1bee8b39..75460513 100755 --- a/client/src/components/phaser.container.jsx +++ b/client/src/components/phaser.container.jsx @@ -5,7 +5,6 @@ const PhaserCombat = require('./phaser.combat'); const addState = connect( function receiveState(state) { - console.log('grep'); const { game, activeSkill, activeIncoming, account, } = state; @@ -41,7 +40,6 @@ class PhaserInstance extends preact.Component { componentDidMount() { // now mounted, can freely modify the DOM: - console.log('grep'); this.PhaserCombat = new PhaserCombat(); const config = { type: Phaser.DOM.FILL, @@ -60,7 +58,6 @@ class PhaserInstance extends preact.Component { } render() { - console.log('grep'); return (