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

Fixed animation targets

Browse Source
This commit is contained in:
Mashy 2018-12-06 15:27:58 +10:00
parent 0e9a2a4ee6
commit eb12e4c568
4 changed files with 58 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
client/src/scenes/combat.cryps.js
View File

@ -37,13 +37,13 @@ const crypPosition = (team, iter) => {
};
class CrypImage extends Phaser.GameObjects.Image {
constructor(scene, team, iter, avatar, cryp, healthbar) {
constructor(scene, team, iter, avatar, cryp, healthBar) {
// Avatar will be a property of cryp
const { crypAvatarX, crypAvatarY } = crypPosition(team, iter);
super(scene, crypAvatarX, crypAvatarY, avatar);
this.scene = scene;
this.cryp = cryp;
this.healthbar = healthbar;
this.healthBar = healthBar;
this.iter = iter;
this.team = team;
}
@ -67,7 +67,7 @@ class CrypImage extends Phaser.GameObjects.Image {
takeDamage(damage) {
this.setTint(0xff0000);
this.healthbar.takeDamage(damage);
this.healthBar.takeDamage(damage);
this.scene.time.delayedCall(DELAYS.DAMAGE_TICK, () => {
this.clearTint();
});
@ -107,9 +107,12 @@ class HealthBar extends Phaser.GameObjects.Graphics {
this.fillRect(healthBarX + 2, healthBarY + 2, healthWidth, healthBarHeight - 4);
}
takeDamage(damage) {
const takeDamage = (damage > this.hp) ? this.hp : damage;
this.hp -= takeDamage;
takeDamage(value) {
if (value > 0) {
this.hp = (value >= this.hp) ? 0 : this.hp -= value;
} else {
this.hp = (this.hp - value > this.stam) ? this.stam : this.hp -= value;
}
this.drawHealthBar();
}
}
@ -152,18 +155,20 @@ class CombatCryps extends Phaser.Scene {
const crypHpText = this.add.text(healthTextX, healthTextY, '', TEXT.NORMAL);
const healthBar = this.add.existing(new HealthBar(this, cryp, team, iter, crypHpText));
// Add cryp name
this.cryps.add(
this.add.existing(new CrypImage(this, team, iter, avatar, cryp, healthBar))
const crypObj = new CrypImage(this, team, iter, avatar, cryp, healthBar);
this.cryps.add(this.add.existing(crypObj)
.setScale(0.5)
.setInteractive()
);
.setInteractive());
return crypObj;
};
const renderTeam = (cryp, iter, team) => {
const crypObj = this.cryps.children.entries
.filter(obj => obj instanceof CrypImage)
.find(c => c.cryp.id === cryp.id);
if (!crypObj) renderCryp(cryp, iter, team);
.find(c => c.cryp.id === cryp.id)
|| renderCryp(cryp, iter, team);
crypObj.healthBar.hp = cryp.hp.base;
crypObj.healthBar.drawHealthBar();
};
const allyTeam = game.teams.find(t => t.id === this.account.id);

2
client/src/scenes/combat.js
View File

@ -50,8 +50,8 @@ class Combat extends Phaser.Scene {
startGame(game) {
this.scene.manager.add('CombatCryps', CombatCryps, true, game);
this.scene.manager.add('CombatLog', CombatLog, true, game);
this.scene.manager.add('CombatSkills', CombatSkills, true, game);
this.renderedResolves = game.resolved.length; // In case you rejoin mid way
this.scene.manager.add('CombatSkills', CombatSkills, true, game.phase);
this.registry.set('gamePhase', game.phase);
return true;
}

56
client/src/scenes/combat.render.resolutions.js
View File

@ -11,21 +11,19 @@ const randomAnimation = () => {
return animations[Math.floor(Math.random() * 5)];
};
function findResolutionCryps(scene, group, resolution, allyTeam, enemyTeam) {
const allyCryp = allyTeam.cryps.find(
c => c.id === resolution.source_cryp_id || c.id === resolution.target_cryp_id
);
const allySpawn = group.children.entries
.find(c => c.cryp.id === allyCryp.id);
function findResolutionCryps(scene, group, resolution, game) {
const enemyCryp = enemyTeam.cryps.find(
c => c.id === resolution.source_cryp_id || c.id === resolution.target_cryp_id
);
const enemySpawn = group.children.entries
.find(c => c.cryp.id === enemyCryp.id);
const sourceCryp = game.teams.find(t => t.cryps.find(c => c.id === resolution.source_cryp_id))
.cryps.find(c => c.id === resolution.source_cryp_id);
const sourceSpawn = group.children.entries.find(c => c.cryp.id === sourceCryp.id);
const target = allyCryp.id === resolution.target_cryp_id ? allySpawn : enemySpawn;
return { allySpawn, enemySpawn, target };
const targetCryp = game.teams.find(t => t.cryps.find(c => c.id === resolution.target_cryp_id))
.cryps.find(c => c.id === resolution.target_cryp_id);
const targetSpawn = group.children.entries
.find(c => c.cryp.id === targetCryp.id);
return { sourceSpawn, targetSpawn };
}
function animatePhase(scene, game, resolution, cb) {
@ -35,7 +33,11 @@ function animatePhase(scene, game, resolution, cb) {
const group = scene.scene.get('CombatCryps').cryps;
const animations = new CombatAnimations(scene);
// Find cryps and targets
const tweenParams = (targets, centreSpot, enemy) => {
const account = scene.registry.get('account');
const { sourceSpawn, targetSpawn } = findResolutionCryps(scene, group, resolution, game);
const tweenParams = (targets, centreSpot) => {
const enemy = targets.cryp.account !== account.id;
let x = centreSpot ? COMBAT.width() * 0.3 : targets.x;
x = (enemy && centreSpot) ? x + COMBAT.width() * 0.4 : x;
const y = centreSpot ? COMBAT.height() * 13.25 / 35 : targets.y;
@ -44,20 +46,15 @@ function animatePhase(scene, game, resolution, cb) {
return { targets, x, y, ease, duration };
};
// find the teams
const account = scene.registry.get('account');
const allyTeam = game.teams.find(t => t.id === account.id);
// in future there will be more than one
const [enemyTeam] = game.teams.filter(t => t.id !== account.id);
const { allySpawn, enemySpawn, target } = findResolutionCryps(scene, group, resolution, allyTeam, enemyTeam);
const moveAllyBattle = tweenParams(allySpawn, true, false);
const moveAllyOrig = tweenParams(allySpawn, false, false);
const moveEnemyBattle = tweenParams(enemySpawn, true, true);
const moveEnemyOrig = tweenParams(enemySpawn, false, true);
const moveSourceBattle = sourceSpawn.cryp.account !== targetSpawn.cryp.account
? tweenParams(sourceSpawn, true) : null;
const moveSourceOrig = sourceSpawn.cryp.account !== targetSpawn.cryp.account
? tweenParams(sourceSpawn, false) : null;
const moveEnemyBattle = tweenParams(targetSpawn, true);
const moveEnemyOrig = tweenParams(targetSpawn, false);
// Move cryps into posistion
scene.tweens.add(moveAllyBattle);
if (moveSourceBattle) scene.tweens.add(moveSourceBattle);
scene.tweens.add(moveEnemyBattle);
// animate animation
const animation = randomAnimation();
@ -67,13 +64,14 @@ function animatePhase(scene, game, resolution, cb) {
// Target cryp takes damage
scene.time.delayedCall(ANIMATION_DURATION, () => {
const damage = resolution.resolution.results[0][1].amount;
target.takeDamage(damage);
const combatTick = resolution.resolution.results[0][1];
const damage = combatTick.category === 'PhysHeal' ? combatTick.amount * -1 : combatTick.amount;
targetSpawn.takeDamage(damage);
scene.registry.set('gameLog', scene.registry.get('gameLog') + 1);
// Move cryps back
scene.time.delayedCall(DAMAGE_TICK, () => {
scene.tweens.add(moveAllyOrig);
if (moveSourceOrig) scene.tweens.add(moveSourceOrig);
scene.tweens.add(moveEnemyOrig);
// all done

21
client/src/scenes/combat.skills.js
View File

@ -52,7 +52,9 @@ class CrypSkill extends Phaser.GameObjects.Text {
}
clickHandler() {
this.scene.game.events.emit('SET_ACTIVE_SKILL', this);
if (this.scene.phase === 'Skill') this.scene.activeSkill = this;
if (this.scene.phase === 'Target') this.scene.activeTarget = this;
this.select();
}
select() {
@ -73,7 +75,9 @@ class CombatSkills extends Phaser.Scene {
super({ key: 'CombatSkills' });
}
create() {
create(phase) {
this.phase = phase;
this.registry.events.off('changedata', this.updateData);
this.registry.events.on('changedata', this.updateData, this);
this.account = this.registry.get('account');
@ -82,11 +86,10 @@ class CombatSkills extends Phaser.Scene {
obj[0].clickHandler();
}
});
if (phase === 'animating') return true;
// can't set this.game cause of phaser class named the same
const game = this.registry.get('game');
this.phase = this.registry.get('gamePhase');
this.renderSkills(game);
this.renderSkills(game, phase);
return true;
}
@ -94,15 +97,15 @@ class CombatSkills extends Phaser.Scene {
updateData(parent, key, data) {
if (key === 'gamePhase' && data) {
const shouldUpdate = data !== this.phase;
if (shouldUpdate) return this.scene.restart();
if (shouldUpdate) return this.scene.restart(data);
return false;
}
return true;
}
renderSkills(game) {
if (this.phase === 'Skill') return this.renderSkillPhase(game);
if (this.phase === 'Target') return this.renderTargetPhase(game);
renderSkills(game, phase) {
if (phase === 'Skill') return this.renderSkillPhase(game);
if (phase === 'Target') return this.renderTargetPhase(game);
return false;
}