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

Added skill scene and some info / forget / learn handlers

Browse Source
This commit is contained in:
Mashy 2018-12-04 18:15:07 +10:00
parent f1d6c8d17d
commit 6e5b6c2c80
3 changed files with 98 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
client/src/scenes/constants.js Normal file → Executable file
View File

24
client/src/scenes/statsheet.js
View File

@ -1,7 +1,7 @@
const Phaser = require('phaser');
const Passives = require('./passives');
const Stats = require('./statsheet.stats');
const { SkillsKnown, SkillsLearn } = require('./statsheet.skills');
const Skills = require('./statsheet.skills');
const { TEXT, POSITIONS: { STATS } } = require('./constants');
const menuOrig = STATS.height() * 0.5;
@ -19,18 +19,6 @@ class StatSheet extends Phaser.Scene {
this.cryp = cryp;
this.stats = new Stats(this, cryp);
this.addControls(cryp);
this.registry.events.on('changedata', this.updateData, this);
}
updateData(parent, key, data) {
if (key === 'cryps') {
const cryp = data.find(c => c.id === this.cryp.id);
if (this.skillsKnown) this.skillsKnown.destroy(true);
if (this.skillsLearn) this.skillsLearn.destroy(true);
this.stats.destroy(true);
this.stats = new Stats(this, cryp);
this.addSkills(cryp);
}
}
addControls(cryp) {
@ -40,8 +28,9 @@ class StatSheet extends Phaser.Scene {
.setOrigin(0)
.on('pointerdown', () => {
// Registry events won't get auto cleaned
this.registry.events.off('changedata', this.updateData);
this.registry.events.off('changedata', this.updateData, this);
this.scene.run('CrypList');
this.scene.remove('Skills');
this.scene.remove('Passives');
this.scene.remove();
});
@ -92,8 +81,8 @@ class StatSheet extends Phaser.Scene {
}
addSkills(cryp) {
this.skillsKnown = new SkillsKnown(this, cryp);
this.skillsLearn = new SkillsLearn(this, cryp);
this.scene.add('Skills', Skills);
this.scene.run('Skills', cryp);
}
addPassives(cryp) {
@ -110,8 +99,7 @@ class StatSheet extends Phaser.Scene {
removeSkills() {
if (!this.skills) return false;
this.skillsKnown.destroy(true);
this.skillsLearn.destroy(true);
this.scene.remove('Skills');
this.skills = false;
return true;
}

134
client/src/scenes/statsheet.skills.js
View File

@ -2,63 +2,113 @@ const Phaser = require('phaser');
const { TEXT, SKILLS, POSITIONS: { STATS } } = require('./constants');
class SkillsKnown extends Phaser.GameObjects.Group {
constructor(scene, cryp) {
super(scene);
this.id = cryp.id;
this.scene = scene;
this.ws = scene.registry.get('ws');
const TEXT_MARGIN = STATS.textMargin();
const X_ORIG_KNOWN = STATS.knownX();
const X_ORIG_LEARN = STATS.learnableX();
const Y_ORIG = STATS.y();
const TEXT_MARGIN = STATS.textMargin();
const X_ORIG = STATS.knownX();
const Y_ORIG = STATS.y();
const menuOrigX = STATS.width() * 0.6;
const menuOrigY = STATS.height() * 0.3;
const menuHeight = STATS.height() * 0.1;
const menuPad = STATS.height() * 0.01;
const menuWidth = STATS.width() * 0.25;
class Skills extends Phaser.Scene {
constructor() {
super({ key: 'Skills' });
}
create(cryp) {
this.cryp = cryp;
this.forget = false;
// Destroy the old registry event if it exists
this.registry.events.off('changedata', this.updateData, this);
this.registry.events.on('changedata', this.updateData, this);
this.add.text(X_ORIG_KNOWN, Y_ORIG, 'Skills', TEXT.HEADER);
this.addKnownSkills(cryp);
const infoSkills = this.add
.rectangle(menuOrigX, menuOrigY, menuWidth, menuHeight, 0x222222)
.setInteractive()
.setOrigin(0)
.on('pointerdown', () => {
this.forget = false;
this.addKnownSkills(this.cryp);
if (this.learnSkills) this.learnSkills.destroy(true);
});
this.add.text(infoSkills.getCenter().x, infoSkills.getCenter().y, 'Skill Info', TEXT.HEADER)
.setOrigin(0.5, 0.5);
const learnSkills = this.add
.rectangle(menuOrigX, menuOrigY + (menuHeight + menuPad) * 2, menuWidth, menuHeight, 0x222222)
.setInteractive()
.setOrigin(0)
.on('pointerdown', () => {
this.forget = false;
this.addKnownSkills(this.cryp);
this.addLearnableSkills(this.cryp);
});
this.add.text(learnSkills.getCenter().x, learnSkills.getCenter().y, 'Learn Skills', TEXT.HEADER)
.setOrigin(0.5, 0.5);
const forgetSkill = this.add
.rectangle(menuOrigX, menuOrigY + menuHeight + menuPad, menuWidth, menuHeight, 0x222222)
.setInteractive()
.setOrigin(0)
.on('pointerdown', () => {
this.forget = true;
this.addKnownSkills(this.cryp);
});
this.add.text(forgetSkill.getCenter().x, forgetSkill.getCenter().y, 'Forget Skills', TEXT.HEADER)
.setOrigin(0.5, 0.5);
}
addKnownSkills(cryp) {
if (this.knownSkills) this.knownSkills.destroy(true);
this.knownSkills = this.add.group();
const knownSkill = (skill, i) => {
const SKILL_X = X_ORIG;
const SKILL_X = X_ORIG_KNOWN;
const SKILL_Y = (i * TEXT_MARGIN) + Y_ORIG + TEXT_MARGIN;
const text = scene.add.text(SKILL_X, SKILL_Y, skill.skill, TEXT.NORMAL)
.setInteractive();
text.on('pointerdown', () => {
this.ws.sendCrypForget(cryp.id, skill.skill);
});
this.add(text);
const color = this.forget ? '#ff0000' : '#ffffff';
const style = { fontFamily: 'monospace', fontSize: 16, color };
this.knownSkills.add(this.add.text(SKILL_X, SKILL_Y, skill.skill, style)
.setInteractive()
.on('pointerdown', () => {
if (this.forget) {
this.registry.get('ws').sendCrypForget(cryp.id, skill.skill);
}
}));
};
this.add(scene.add.text(X_ORIG, Y_ORIG, 'Skills', TEXT.HEADER));
cryp.skills.forEach(knownSkill);
}
}
class SkillsLearn extends Phaser.GameObjects.Group {
constructor(scene, cryp) {
super(scene);
this.id = cryp.id;
this.scene = scene;
this.ws = scene.registry.get('ws');
const TEXT_MARGIN = STATS.textMargin();
const X_ORIG = STATS.learnableX();
const Y_ORIG = STATS.y();
addLearnableSkills(cryp) {
if (this.learnSkills) this.learnSkills.destroy(true);
this.learnSkills = this.add.group();
const learnable = (skill, i) => {
const SKILL_X = X_ORIG;
const SKILL_X = X_ORIG_LEARN;
const SKILL_Y = Y_ORIG + (i * TEXT_MARGIN) + TEXT_MARGIN;
const text = scene.add.text(SKILL_X, SKILL_Y, skill, TEXT.NORMAL)
.setInteractive();
text.on('pointerdown', () => {
this.ws.sendCrypLearn(cryp.id, skill);
});
this.add(text);
text.cryp = cryp;
this.learnSkills.add(this.add.text(SKILL_X, SKILL_Y, skill, TEXT.NORMAL)
.setInteractive()
.on('pointerdown', () => {
this.registry.get('ws').sendCrypLearn(cryp.id, skill);
}));
};
this.add(scene.add.text(X_ORIG, Y_ORIG, 'Learnable', TEXT.HEADER));
this.learnSkills.add(this.add.text(X_ORIG_LEARN, Y_ORIG, 'Learnable', TEXT.HEADER));
SKILLS.LEARNABLE.forEach(learnable);
}
updateData(parent, key, data) {
if (key === 'cryps') {
const cryp = data.find(c => c.id === this.cryp.id);
this.cryp = cryp;
this.addKnownSkills(cryp);
}
}
}
module.exports = { SkillsKnown, SkillsLearn };
module.exports = Skills;