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

More attack animations

Browse Source
This commit is contained in:
Mashy 2018-11-05 16:31:48 +10:00
parent 8aebc1dd5b
commit 79374a3cd5
3 changed files with 134 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
client/src/components/phaser.combat.js
View File

@ -10,6 +10,12 @@ class PhaserCombat extends Phaser.Scene {
this.load.image('sky', 'http://labs.phaser.io/assets/skies/nebula.jpg');
this.load.image('proj', 'http://labs.phaser.io/assets/sprites/bullet.png');
this.load.image('blue', 'http://labs.phaser.io/assets/particles/blue.png');
this.load.image('green', 'http://labs.phaser.io/assets/particles/green.png');
this.load.image('red', 'http://labs.phaser.io/assets/particles/red.png');
this.load.image('white', 'http://labs.phaser.io/assets/particles/white.png');
this.load.image('yellow', 'http://labs.phaser.io/assets/particles/yellow.png');
/* Spritesheets */
this.load.spritesheet({
key: 'explosion',
@ -61,7 +67,6 @@ class PhaserCombat extends Phaser.Scene {
this.emitter.stop();
const sprite = this.add.sprite(proj.x, proj.y, 'explosion').play('explodeAnimation');
sprite.setScale(3);
this.combat = false;
}
}
PhaserCombat.prototype.skills = require('./phaser.skills.js');

14
client/src/components/phaser.container.jsx
View File

@ -5,8 +5,12 @@ const PhaserCombat = require('./phaser.combat');
const addState = connect(
function receiveState(state) {
const { game, activeSkill, activeIncoming, account } = state;
return {game, activeSkill, activeIncoming, account };
const {
game, activeSkill, activeIncoming, account,
} = state;
return {
game, activeSkill, activeIncoming, account,
};
}
);
@ -25,9 +29,11 @@ class PhaserInstance extends preact.Component {
this.PhaserCombat.setPlayerTwoHp(`${otherTeams[0].cryps[0].hp.value.toString()} / ${otherTeams[0].cryps[0].stam.value.toString()} HP`);
if (playerTeam.cryps[0].hp.value === 0) {
this.PhaserCombat.skills('blast', 400, -250); //Left Blast
// 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, 250); //Right Blast
// this.PhaserCombat.skills('blast', 180, 150);
this.PhaserCombat.skills('chargeBall', 'green', 180, 250);
}
}
}

122
client/src/components/phaser.skills.js
View File

@ -1,27 +1,141 @@
// Skill function called by phaser combat
const Phaser = require('phaser');
function skills(skill, speed, location) {
function skills(skill, img, location, spd) {
if (this.combat) {
return;
}
this.combat = true;
const particles = this.add.particles(img);
switch (skill) {
case 'blast':
this.proj = this.physics.add.image(-100, 300, 'proj');
this.emitter = this.add.particles('blue').createEmitter({
this.emitter = particles.createEmitter({
speed: 25,
scale: { start: 1, end: 0 },
blendMode: 'ADD',
});
this.emitter.startFollow(this.proj);
this.physics.add.overlap(this.proj, this.players, this.explode, null, this);
this.proj.x = speed;
this.proj.setVelocity(location, 0);
this.proj.x = location;
this.proj.setVelocity(spd, 0);
break;
case 'wall':
this.emitter = particles.createEmitter({
x: location,
y: { min: 200, max: 350 },
lifespan: 2000,
speedX: { min: spd, max: spd * 2 },
scale: { start: 0.4, end: 0 },
quantity: 4,
blendMode: 'ADD',
});
this.time.delayedCall(1000, () => { this.emitter.stop(); }, [], this);
break;
case 'spit':
if (location > 250) {
this.angleMin = 180;
this.angleMax = 220;
} else {
this.angleMin = 320;
this.angleMax = 360;
}
this.emitter = particles.createEmitter({
x: location,
y: 300,
lifespan: 2000,
angle: { min: this.angleMin, max: this.angleMax },
speed: spd * 2,
scale: { start: 0.4, end: 1 },
gravityY: 250,
quantity: 4,
blendMode: 'ADD',
});
this.time.delayedCall(1000, () => { this.emitter.stop(); }, [], this);
break;
case 'gravBomb':
this.well = particles.createGravityWell({
x: 150,
y: 150,
power: 4,
gravity: 500,
});
this.emitter = particles.createEmitter({
x: 150,
y: 150,
lifespan: 1500,
speed: 1000,
scale: { start: 0.7, end: 1 },
blendMode: 'ADD',
});
this.time.delayedCall(1000, () => {
this.emitter.stop();
this.well.active = false;
}, [], this);
break;
case 'gravBlast':
this.well = particles.createGravityWell({
x: 400,
y: 300,
power: 4,
gravity: 500,
});
this.emitter = particles.createEmitter({
x: 400,
y: 300,
lifespan: 2000,
speed: 1000,
scale: { start: 0.7, end: 1 },
blendMode: 'ADD',
bounds: {
x: 0, y: 250, w: 450, h: 150,
},
});
this.time.delayedCall(1000, () => {
this.emitter.stop();
this.well.x = 100;
}, [], this);
this.time.delayedCall(3000, () => {
this.well.active = false;
}, [], this);
break;
case 'chargeBall':
this.emitter = particles.createEmitter({
x: -400,
y: -100,
lifespan: 1000,
moveToX: 450,
moveToY: 150,
scale: 0.75,
quantity: 4,
_frequency: 20,
blendMode: 'ADD',
emitZone: { source: new Phaser.Geom.Rectangle(0, 0, 1600, 700) },
});
this.emitter2 = particles.createEmitter({
radial: false,
x: { min: 450, max: 50, steps: 256 },
y: { min: 150, max: 300, steps: 256 },
lifespan: 1000,
speedX: { min: 200, max: 400 },
quantity: 4,
gravityY: 0,
scale: { start: 1.5, end: 0, ease: 'Power3' },
blendMode: 'ADD',
active: false,
});
this.time.delayedCall(1000, () => { this.emitter.stop(); }, [], this);
this.time.delayedCall(2000, () => { this.emitter2.active = true; }, [], this);
this.time.delayedCall(3000, () => { this.emitter2.stop(); }, [], this);
break;
default:
break;
}
}
module.exports = skills;