ntr/mnml
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added node passive text on hover, functions to allow node allocation from state

Browse Source
This commit is contained in:
Mashy
2018-11-16 14:33:41 +10:00
parent eda4800cd3
commit 01e6fdef69
4 changed files with 168 additions and 136 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/passive.container.jsx
+1 -15
View File
@@ -21,21 +21,7 @@ class PhaserInstance extends preact.Component {
}
componentWillReceiveProps(nextProps) {
const playerTeam = nextProps.game.teams.find(t => t.id === nextProps.account.id);
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`);
if (playerTeam.cryps[0].hp.value === 0) {
// this.PhaserCombat.skills('blast', 400, -150);
this.PhaserCombat.skills('chargeBall', 'green', 400, -250);
} else if (otherTeams[0].cryps[0].hp.value === 0) {
// this.PhaserCombat.skills('blast', 180, 150);
this.PhaserCombat.skills('chargeBall', 'green', 180, 250);
}
}
// code here will update passive allocation from state
}
componentDidMount() {
client/src/components/passive.data.node.js
+100 -100
View File
@@ -1,104 +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 },
{ x: 860, y: 1011, id: 'CMED1', alloc: false, text: '5% Increased Speed for Chaos Slow skills, 5% Increased Slow Effect'},
{ x: 905, y: 970, id: 'CSTAT7', alloc: false, text: '+2 Chaos Stat'},
{ x: 940, y: 917.5, id: 'CSTAT8', alloc: false, text: '+2 Chaos Stat'},
{ x: 950, y: 1172.5, id: 'CMED2', alloc: false, text: '5% Increased Speed for Damaging Spells, 5% Increased Speed for Healing Skills'},
{ x: 955, y: 1120, id: 'CSDMG1', alloc: false, text: '+5% Increased Spell Damage'},
{ x: 965, y: 1082.5, id: 'CSDMG2', alloc: false, text: '+5% Increased Spell Damage'},
{ x: 970, y: 872.5, id: 'CSTAT9', alloc: false, text: '+2 Chaos Stat'},
{ x: 975, y: 1012.5, id: 'CSTAT6', alloc: false, text: '+2 Chaos Stat'},
{ x: 995, y: 1062.5, id: 'CSDMG3', alloc: false, text: '+5% Increased Spell Damage'},
{ x: 1000, y: 1150, id: 'CHEAL1', alloc: false, text: '+5% Increased Healing'},
{ x: 1005, y: 812.5, id: 'CMED20', alloc: false, text: '5% Increased Speed for Healing skills, 5% Increased Stamina'},
{ x: 1024.5, y: 1122.5, id: 'CHEAL2', alloc: false, text: '+5% Increased Healing'},
{ x: 1036.5, y: 896.5, id: 'CMED19', alloc: false, text: '5% Increased Speed for Healing skills, 5% Increased Stamina'},
{ x: 1036.5, y: 1042.5, id: 'CMED18', alloc: false, text: '5% Increased Speed for Damaging Spells, 5% Increased Speed for Healing Skills'},
{ x: 1036.5, y: 1082.5, id: 'CHEAL3', alloc: false, text: '+5% Increased Healing'},
{ x: 1041.5, y: 772.5, id: 'CSTAT10', alloc: false, text: '+2 Chaos Stat'},
{ x: 1055, y: 1327.5, id: 'CMED3', alloc: false, text: '5% Increased Speed for Damaging Spells, 5% Increased Speed for Banish Skills'},
{ x: 1066.5, y: 939.5, id: 'CHEAL5', alloc: false, text: '+5% Increased Healing'},
{ x: 1067.5, y: 995, id: 'CHEAL4', alloc: false, text: '+5% Increased Healing'},
{ x: 1070, y: 1250, id: 'CSTAT4', alloc: false, text: '+2 Chaos Stat'},
{ x: 1072.5, y: 840.5, id: 'CHEAL8', alloc: false, text: '+5% Increased Healing'},
{ x: 1087.5, y: 700, id: 'CSTAT11', alloc: false, text: '+2 Chaos Stat'},
{ x: 1097.5, y: 1052.5, id: 'CSDMG4', alloc: false, text: '+5% Increased Spell Damage'},
{ x: 1102.5, y: 1140, id: 'CSTAT5', alloc: false, text: '+2 Chaos Stat'},
{ x: 1102.5, y: 917.5, id: 'CHEAL6', alloc: false, text: '+5% Increased Healing'},
{ x: 1115, y: 1332.5, id: 'CSTAT1', alloc: false, text: '+2 Chaos Stat'},
{ x: 1115, y: 875, id: 'CHEAL7', alloc: false, text: '+5% Increased Healing'},
{ x: 1130, y: 640, id: 'CSTAT12', alloc: false, text: '+2 Chaos Stat'},
{ x: 1145, y: 1287.5, id: 'CSTAT3', alloc: false, text: '+2 Chaos Stat'},
{ x: 1145, y: 1057.5, id: 'CSDMG5', alloc: false, text: '+5% Increased Spell Damage'},
{ x: 1175, y: 1332.5, id: 'CSTAT2', alloc: false, text: '+2 Chaos Stat'},
{ x: 1180, y: 1247.5, id: 'CMED10', alloc: false, text: '5% Increased Speed for Banish Spells, 5% Increased Stamina'},
{ x: 1180, y: 950, id: 'CMED14', alloc: false, text: '5% Increased Speed for Chaos Slow skills, 5% Increased Speed for Banish Skills'},
{ x: 1195, y: 875, id: 'CHEAL9', alloc: false, text: '+5% Increased Healing'},
{ x: 1196.5, y: 635, id: 'CMED21', alloc: false, text: '5% Increased Effect of Slow, 5% Increased Stamina'},
{ x: 1205, y: 1062.5, id: 'CSDMG6', alloc: false, text: '+5% Increased Spell Damage'},
{ x: 1212.5, y: 1200, id: 'CHEAL14', alloc: false, text: '+5% Increased Healing'},
{ x: 1231.5, y: 590, id: 'CSTAT14', alloc: false, text: '+2 Chaos Stat'},
{ x: 1235, y: 772.5, id: 'CHEAL12', alloc: false, text: '+5% Increased Healing'},
{ x: 1240, y: 1225, id: 'CPHYS1', alloc: false, text: '+2% Reduced Physical Damage Taken'},
{ x: 1240, y: 1322.5, id: 'CMED4', alloc: false, text: '5% Increased Speed for Damaging Spells, 5% Increased Stamina'},
{ x: 1258.5, y: 1107.5, id: 'CHEAL15', alloc: false, text: '+5% Increased Healing'},
{ x: 1260, y: 917.5, id: 'CHEAL10', alloc: false, text: '+5% Increased Healing'},
{ x: 1263, y: 520, id: 'CLRG4', alloc: false, text: 'Damaging spells have a 20% chance to inflict slow'},
{ x: 1273.5, y: 1057.5, id: 'CMED13', alloc: false, text: '5% Increased Speed for Banish Spells, 5% Increased Speed for Damaging Spells'},
{ x: 1275, y: 1167.5, id: 'CMED11', alloc: false, text: '5% Increased Speed for Banish Spells, 5% Increased Stamina'},
{ x: 1275, y: 947.5, id: 'CMED15', alloc: false, text: '5% Increased Speed for Chaos Slow skills, 5% Increased Speed for Damaging Spells'},
{ x: 1277.5, y: 872.5, id: 'CMED16', alloc: false, text: '5% Increased Speed for Damaging Spells, 5% Increased Speed for Healing Skills'},
{ x: 1278.5, y: 812.5, id: 'CHEAL11', alloc: false, text: '+5% Increased Healing'},
{ x: 1280, y: 732.5, id: 'CHEAL13', alloc: false, text: '+5% Increased Healing'},
{ x: 1281.5, y: 1002.5, id: 'CSDMG7', alloc: false, text: '+5% Increased Spell Damage'},
{ x: 1284, y: 640, id: 'CSTAT15', alloc: false, text: '+2 Chaos Stat'},
{ x: 1298.5, y: 1107.5, id: 'CPHYS4', alloc: false, text: '+2% Reduced Physical Damage Taken'},
{ x: 1302.5, y: 917.5, id: 'CSDMG8', alloc: false, text: '+5% Increased Spell Damage'},
{ x: 1305, y: 1307.5, id: 'CPHYS2', alloc: false, text: '+2% Reduced Physical Damage Taken'},
{ x: 1306, y: 1347.5, id: 'CSDMG10', alloc: false, text: '+5% Increased Spell Damage'},
{ x: 1315, y: 762.5, id: 'CMED17', alloc: false, text: '5% Increased Speed for Healing skills, 5% Increased Stamina'},
{ x: 1326.5, y: 590, id: 'CSTAT16', alloc: false, text: '+2 Chaos Stat'},
{ x: 1346.5, y: 635, id: 'CMED22', alloc: false, text: '5% Increased Effect of Slow, 5% Increased Stamina'},
{ x: 1348.5, y: 535, id: 'CSTAT13', alloc: false, text: '+2 Chaos Stat'},
{ x: 1355, y: 1322.5, id: 'CMED5', alloc: false, text: '5% Increased Speed for Damaging Spells, 5% Increased Stamina'},
{ x: 1360, y: 1002.5, id: 'CSDMG9', alloc: false, text: '+5% Increased Spell Damage'},
{ x: 1399.5, y: 1107.5, id: 'CPHYS5', alloc: false, text: '+2% Reduced Physical Damage Taken'},
{ x: 1400, y: 807.5, id: 'CMED24', alloc: false, text: '5% Increased Speed for Damaging Spells, 5% Increased Speed for Healing Skills'},
{ x: 1409.5, y: 1312.5, id: 'CPHYS3', alloc: false, text: '+2% Reduced Physical Damage Taken'},
{ x: 1410, y: 1347.5, id: 'CSDMG11', alloc: false, text: '+5% Increased Spell Damage'},
{ x: 1410, y: 532.5, id: 'CMED23', alloc: false, text: '5% Increased Speed for Banish Spells, 5% Increased Effect of Slow'},
{ x: 1420, y: 732.5, id: 'CSTAT19', alloc: false, text: '+2 Chaos Stat'},
{ x: 1430, y: 1205, id: 'CPHYS7', alloc: false, text: '+2% Reduced Physical Damage Taken'},
{ x: 1447.5, y: 765, id: 'CMED25', alloc: false, text: '5% Increased Speed for Damaging Spells, 5% Increased Speed for Healing Skills'},
{ x: 1452.5, y: 1322.5, id: 'CMED6', alloc: false, text: '5% Increased Speed for Damaging Spells, 5% Increased Stamina'},
{ x: 1455, y: 1267.5, id: 'CSTAT33', alloc: false, text: '+2 Chaos Stat'},
{ x: 1455, y: 1147.5, id: 'CMED12', alloc: false, text: '5% Increased Speed for Banish Spells, 5% Increased Stamina'},
{ x: 1455, y: 1042.5, id: 'CSTAT35', alloc: false, text: '+2 Chaos Stat'},
{ x: 1457.5, y: 975, id: 'CSTAT37', alloc: false, text: '+2 Chaos Stat'},
{ x: 1462.5, y: 825, id: 'CLRG3', alloc: false, text: '20% critical strike chance for spells'},
{ x: 1485, y: 640, id: 'CSTAT17', alloc: false, text: '+2 Chaos Stat'},
{ x: 1500, y: 1110, id: 'CPHYS6', alloc: false, text: '+2% Reduced Physical Damage Taken'},
{ x: 1505, y: 1242.5, id: 'CSTAT32', alloc: false, text: '+2 Chaos Stat'},
{ x: 1555, y: 1242.5, id: 'CSTAT31', alloc: false, text: '+2 Chaos Stat'},
{ x: 1555, y: 1067.5, id: 'CSTAT34', alloc: false, text: '+2 Chaos Stat'},
{ x: 1555, y: 962.5, id: 'CSTAT36', alloc: false, text: '+2 Chaos Stat'},
{ x: 1555, y: 847.5, id: 'CSTAT20', alloc: false, text: '+2 Chaos Stat'},
{ x: 1555, y: 732.5, id: 'CSTAT18', alloc: false, text: '+2 Chaos Stat'},
{ x: 1597.5, y: 827.5, id: 'CSTAT21', alloc: false, text: '+2 Chaos Stat'},
{ x: 1607.5, y: 1277.5, id: 'CSTAT30', alloc: false, text: '+2 Chaos Stat'},
{ x: 1612.5, y: 1137.5, id: 'CLRG1', alloc: false, text: 'When you take physical damage there is a 20% chance to heal for 150% of physical damage taken'},
{ x: 1612.5, y: 955, id: 'CLRG2', alloc: false, text: 'Your healing spells have a 20% chance to increase ally speed by 100%'},
{ x: 1657.5, y: 822.5, id: 'CSTAT22', alloc: false, text: '+2 Chaos Stat'},
{ x: 1657.5, y: 1312.5, id: 'CSTAT29', alloc: false, text: '+2 Chaos Stat'},
{ x: 1685, y: 1187.5, id: 'CSTAT27', alloc: false, text: '+2 Chaos Stat'},
{ x: 1685, y: 1022.5, id: 'CSTAT25', alloc: false, text: '+2 Chaos Stat'},
{ x: 1690, y: 1117.5, id: 'CSTAT26', alloc: false, text: '+2 Chaos Stat'},
{ x: 1705, y: 960, id: 'CSTAT24', alloc: false, text: '+2 Chaos Stat'},
{ x: 1712.5, y: 850, id: 'CMED9', alloc: false, text: '5% Increased Speed for Healing skills, 5% Increased Stamina'},
{ x: 1717.5, y: 1267.5, id: 'CMED7', alloc: false, text: '5% Increased Speed for Damaging Spells, 5% Increased Stamina'},
{ x: 1725, y: 1222.5, id: 'CSTAT28', alloc: false, text: '+2 Chaos Stat'},
{ x: 1727.5, y: 1062.5, id: 'CMED8', alloc: false, text: '5% Increased Speed for Chaos Slow skills, 5% Increased Speed for Banish Skills'},
{ x: 1737.5, y: 917.5, id: 'CSTAT23', alloc: false, text: '+2 Chaos Stat'},
{ x: 1830, y: 1032.5, id: 'CNOTE', alloc: false, text: 'Increases duration of banish skills by 1 turn. Your chaos skills gain 20% increased speed for each successful banish. '},
];
module.exports = passiveNodes;
client/src/components/passive.node.js
+18 -9
View File
@@ -1,14 +1,15 @@
const Phaser = require('phaser');
class PassiveNode extends Phaser.GameObjects.Sprite {
constructor(scene, x, y, id, alloc) {
constructor(scene, x, y, id, alloc, text) {
super(scene, x, y);
this.setTexture('eye');
this.scene = scene;
this.alloc = alloc;
this.text = text;
this.id = id;
this.setPosition(x, y);
const nodeNoDigits = this.id.replace(/[0-9]/g, '');
switch (nodeNoDigits) {
case 'CNOTE':
@@ -28,17 +29,25 @@ class PassiveNode extends Phaser.GameObjects.Sprite {
}
}
allocate() {
if (this.alloc) {
allocate(alloc) {
if (alloc !== undefined) {
this.alloc = alloc;
} else {
this.alloc = !this.alloc;
}
this.updateNode();
}
updateNode() {
if (!this.alloc) {
this.clearTint();
this.alloc = false;
} else {
this.alloc = true;
this.setTint(0xff0000);
}
for (let i = 0; i < this.scene.passiveNodes.length; i += 1) {
if (this.scene.passiveNodes[i].id === this.id) {
this.scene.passiveNodes[i].alloc = this.alloc;
for (let i = 0; i < this.scene.passiveNodeData.length; i += 1) {
if (this.scene.passiveNodeData[i].id === this.id) {
this.scene.passiveNodeData[i].alloc = this.alloc;
break;
}
}
client/src/components/passive.phaser.js
+49 -12
View File
@@ -3,32 +3,54 @@ const PassiveNode = require('./passive.node');
const passiveDataNode = require('./passive.data.node');
const passiveDataEdge = require('./passive.data.edge');
// Passive tree generator - proof of concept visuals need work
// Mouse click hold to move, Q + E to zoom in and out
// Press 'A' to reset allocated passive nodes
class PhaserPassives extends Phaser.Scene {
preload() {
this.load.image('eye', 'https://labs.phaser.io/assets/particles/green-orb.png');
this.load.image('background', 'http://labs.phaser.io/assets/skies/nebula.jpg');
}
create() {
this.cameras.main.setBounds(0, 0, 3000, 3000);
this.physics.world.setBounds(0, 0, 3000, 3000);
this.background = this.add.image(0, 0, 'background');
this.background.setScale(5);
this.background.setInteractive();
this.graphics = this.add.graphics();
this.passiveNodes = passiveDataNode;
this.passiveEdges = passiveDataEdge;
this.nodeText = this.add.text(10000, 10000, 'grep', {
fontSize: '32px',
fontFamily: 'Arial',
color: '#ffffff',
backgroundColor: '#000000',
}).setPadding(32);
this.passiveNodeData = passiveDataNode;
this.passiveEdgeData = passiveDataEdge;
this.addPassiveNodes();
this.drawPassiveEdges();
this.addCanmeraControl();
}
addPassiveNodes() {
this.passiveNodes.forEach((n) => {
this.add.existing(new PassiveNode(this, n.x, n.y, n.id, n.alloc)).setInteractive();
this.passiveNodes = [];
this.passiveNodeData.forEach((n) => {
this.passiveNodes[n.id] = this.add.existing(
new PassiveNode(this, n.x, n.y, n.id, n.alloc, n.text)
).setInteractive();
});
this.input.on('pointerover', (event, gameObjects) => {
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 = '';
}
});
this.input.on('pointerout', (event, gameObjects) => {
this.input.on('pointerout', (pointer, gameObjects) => {
if (gameObjects[0] instanceof PassiveNode) {
if (!gameObjects[0].alloc) gameObjects[0].clearTint();
}
@@ -43,12 +65,18 @@ class PhaserPassives extends Phaser.Scene {
}
}
});
this.input.keyboard.on('keydown_A', () => {
this.updatePassives(); // Will update nodes from state
}, 0, this);
}
drawPassiveEdges() {
this.graphics.clear();
this.passiveEdges.forEach((e) => {
const drawEdge = this.passiveNodes.filter(n => (e[0] === n.id || e[1] === n.id));
this.passiveEdgeData.forEach((e) => {
const drawEdge = this.passiveNodeData.filter(n => (
e[0] === n.id || e[1] === n.id
));
if (drawEdge[0].alloc && drawEdge[1].alloc) {
this.graphics.lineStyle(10, 0xfff00f, 0.2);
} else {
@@ -63,8 +91,8 @@ 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) * 1.5;
this.cameras.main.scrollY -= (points[1].y - points[0].y) * 1.5;
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({
@@ -77,6 +105,15 @@ class PhaserPassives extends Phaser.Scene {
});
}
updatePassives() {
this.passiveNodeData.forEach((n) => {
this.passiveNodes[n.id].alloc = false;
this.passiveNodes[n.id].updateNode();
});
// This function will be modified to just update from state
// State will update n.alloc instead of false
}
camPan(bool) {
this.pan = bool;
}