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

UI updates

Browse Source
This commit is contained in:
Mashy
2019-02-22 13:35:47 +10:00
parent caf827e42b
commit 29772ad3ae
6 changed files with 27 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/scenes/statsheet.js
+16 -36
View File
@@ -8,37 +8,13 @@ const WIDTH = MENU_MAIN.width();
const HEIGHT = MENU_MAIN.height();
const TEXT_MARGIN = 24;
const menuX = Math.floor(WIDTH / 10);
const menuY = Math.floor(HEIGHT * 0.8);
const menuWidth = Math.floor(WIDTH / 10);
const menuHeight = Math.floor(HEIGHT * 0.2);
const Y_SKILLS = Math.floor(HEIGHT * 0.5);
function addButton(scene, x, y, cback, name) {
const button = scene.add
.rectangle(x, y, menuWidth, menuHeight, 0x222222)
.setInteractive()
.setOrigin(0)
.on('pointerdown', cback);
scene.add.text(button.getCenter().x, button.getCenter().y, name, TEXT.HEADER)
.setOrigin(0.5, 0.5);
}
const SKILL_WIDTH = Math.floor(WIDTH / 20);
class StatSheet extends Phaser.Scene {
constructor() {
super({ key: 'StatSheet' });
}
create(cryp) {
this.registry.events.on('changedata', this.updateData, this);
this.cryp = cryp;
this.add.text(X + WIDTH / 10, Y, cryp.name, TEXT.HEADER);
this.addStats(cryp);
this.addKnownSkills(cryp);
addButton(this, X + menuX, Y + menuY, () => this.registry.set('crypSpec', cryp), 'Spec');
}
updateData(parent, key, data) {
if (key === 'cryps') {
@@ -47,10 +23,14 @@ class StatSheet extends Phaser.Scene {
}
}
addStats(cryp) {
create(cryp) {
this.registry.events.on('changedata', this.updateData, this);
this.cryp = cryp;
this.add.text(X, Y, cryp.name, TEXT.HEADER);
const crypStat = (stat, i) => {
const STAT_X = X + WIDTH / 10;
const STAT_Y = Y + (i + 1) * TEXT_MARGIN;
const STAT_X = X;
const STAT_Y = Y + (i + 2) * TEXT_MARGIN;
this.add.text(STAT_X, STAT_Y, `${stat.stat}: ${stat.base}`, TEXT.NORMAL);
};
@@ -65,15 +45,15 @@ class StatSheet extends Phaser.Scene {
];
CRYP_STATS.forEach(crypStat);
}
addKnownSkills(cryp) {
this.add.text(X + menuX, Y + Y_SKILLS, 'Skills', TEXT.HEADER);
this.add.text(X + WIDTH * 0.175, Y, 'Skills', TEXT.HEADER);
const knownSkill = (skill, i) => {
const SKILL_X = X + menuX + 250 + 100 * i;
const SKILL_Y = Y + 25;
const clickFn = console.log('grep');
this.add.existing(new Item(this, skill.skill, i, SKILL_X, SKILL_Y, 75, 75, clickFn));
const SKILL_X = X + WIDTH * 0.2 + WIDTH * 0.06 * i;
const SKILL_Y = Y + HEIGHT * 0.15;
const itemObj = new Item(this, skill.skill, i, SKILL_X, SKILL_Y, SKILL_WIDTH, SKILL_WIDTH);
itemObj.on('pointerdown', () => {
console.log(skill.skill);
});
this.add.existing(itemObj);
};
cryp.skills.forEach(knownSkill);
}