Pascal/MI2Mario
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

started skeleton and zombie, added GUI and menu system

Browse Source 
Signed-off-by: Pascal Syma <pascal@syma.dev>
This commit is contained in:
Pascal
2020-07-16 04:42:39 +02:00
parent e3b9eff67d
commit f1d6c7d69f
15 changed files with 1636 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/scenes/GUI.js
+78
View File
@@ -0,0 +1,78 @@
/*
* Copyright (c) 2020. Antonio Martinez Casadesus and Pascal Syma.
* All rights reserved.
*/
import TextElement from "../TextElement";
import Player from "../entities/Player";
export default class GUI extends Phaser.Scene {
constructor() {
super({
key: "GUI",
pixelArt: true,
physics: {
default: 'arcade',
arcade: {
gravity: {y: 0}
}
}
});
}
create() {
const key = this.scene.settings.data.key;
const map = this.make.tilemap({key: "menu"});
const menuTileset = map.addTilesetImage("menu", "menutiles", 16, 16);
const buttonTileset = map.addTilesetImage("button", "buttontiles", 16, 16);
map.layers.filter(obj => obj.name.startsWith(key)).forEach(l => map.createStaticLayer(l.name, [menuTileset, buttonTileset], 0, 0))
this.cameras.main.setBounds(0, 0, map.widthInPixels, map.heightInPixels);
map.objects.filter(obj => obj.name === key + "Objects")[0].objects.filter(obj => obj.type === "text").forEach(s => {
new TextElement(this, s);
});
map.objects.filter(obj => obj.name === key + "Objects")[0].objects.filter(obj => obj.type === "selectChar").forEach(s => {
const charKey = s.name;
this.anims.create({
key: 'idle' + charKey,
frames: this.anims.generateFrameNumbers('char' + charKey, {start: 126, end: 131}),
frameRate: 10,
repeat: -1
});
new Player(this, s, 'char' + charKey).play('idle' + charKey, true)
.setInteractive()
.on('pointerdown', () => {
if (this.textures.exists('char'))
this.textures.removeKey('char');
this.textures.addSpriteSheet('char', this.textures.get('char' + charKey).getSourceImage(), {
frameWidth: 79,
frameHeight: 63,
margin: 1,
spacing: 2
});
this.anims.remove('idle');
this.anims.create({
key: 'idle',
frames: this.anims.generateFrameNumbers('char', {start: 126, end: 131}),
frameRate: 10,
repeat: -1
});
this.scene.start('Game');
})
});
}
}
src/scenes/Game.js
+25 -3
View File
@@ -10,6 +10,8 @@ import Storage from "../Storage";
import Win from "../entities/Win";
import TextElement from "../TextElement";
import DamageEntity from "../entities/Enemys/DamageEntity";
import Zombie from "../entities/Enemys/Zombie";
import Skeleton from "../entities/Enemys/Skeleton";
export default class Game extends Phaser.Scene {
@@ -22,7 +24,7 @@ export default class Game extends Phaser.Scene {
default: 'arcade',
arcade: {
gravity: {y: 300},
debug: true
// debug: true
}
}
});
@@ -75,8 +77,12 @@ export default class Game extends Phaser.Scene {
create() {
this.anims.create({
key: 'idle',
frames: this.anims.generateFrameNumbers('char', {start: 126, end: 131}),
key: 'skeleton_run',
frames: this.anims.generateFrameNames('skeleton', {
start: 1,
end: 8,
prefix: 'skeleton_archer_style_A/run/frame'
}),
frameRate: 10,
repeat: -1
});
@@ -165,6 +171,14 @@ export default class Game extends Phaser.Scene {
this.enemys.add(bat)
});
map.objects[0].objects.filter(obj => obj.name === "zombie").forEach(s => {
this.enemys.add(new Zombie(this, s))
});
map.objects[0].objects.filter(obj => obj.name === "skelleton").forEach(s => {
this.enemys.add(new Skeleton(this, s))
});
map.objects[0].objects.filter(obj => obj.type === "dmg").forEach(s => {
this.enemys.add(new DamageEntity(this, s))
});
@@ -230,6 +244,7 @@ export default class Game extends Phaser.Scene {
this.keyPickup = this.input.keyboard.addKey(controls.pickup.bind);
this.keyAction1 = this.input.keyboard.addKey(controls.use_left.bind);
this.keyAction2 = this.input.keyboard.addKey(controls.use_right.bind);
this.keyEsc = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.ESC);
this.physics.add.overlap(this.player, this.items, (p, i) => {
if (this.keyPickup.isDown && i.canPickup()) {
@@ -246,6 +261,13 @@ export default class Game extends Phaser.Scene {
}
update(time, delta) {
if (this.keyEsc.isDown) {
this.scene.pause();
this.input.keyboard.keys.forEach(k => k.reset());
this.scene.launch('GUI', {key: 'Pause'}).bringToTop('GUI');
return;
}
this.enemys.getChildren().forEach(c => {
c.update()
});
src/scenes/MainMenu.js
-32
View File
@@ -1,32 +0,0 @@
/*
* Copyright (c) 2020. Antonio Martinez Casadesus and Pascal Syma.
* All rights reserved.
*/
import TextElement from "../TextElement";
export default class MainMenu extends Phaser.Scene {
constructor() {
super({
key: "MainMenu",
pixelArt: true,
});
}
create() {
const map = this.make.tilemap({key: "menu"});
const tileset = map.addTilesetImage("menu", "menutiles", 16, 16);
this.backLayer = map.createStaticLayer("MainMenu", tileset, 0, 0);
this.cameras.main.setBounds(0, 0, map.widthInPixels, map.heightInPixels);
this.cameras.main.setBackgroundColor('#000');
map.objects[0].objects.filter(obj => obj.type === "text").forEach(s => {
console.log(s);
new TextElement(this, s);
});
}
}
src/scenes/Menu.js
+8 -22
View File
@@ -3,8 +3,6 @@
* All rights reserved.
*/
import Player from "../entities/Player";
export default class Menu extends Phaser.Scene {
constructor() {
@@ -24,6 +22,14 @@ export default class Menu extends Phaser.Scene {
create() {
const w = this.cameras.main.centerX;
const h = this.cameras.main.centerY;
this.anims.create({
key: 'idle',
frames: this.anims.generateFrameNumbers('char', {start: 126, end: 131}),
frameRate: 10,
repeat: -1
});
[{x: w / 2, y: h / 2, key: 'A'},
{x: w / 2 + w, y: h / 2, key: 'B'},
{x: w / 2, y: h / 2 + h, key: 'C'},
@@ -33,25 +39,5 @@ export default class Menu extends Phaser.Scene {
}
addOption(options) {
this.anims.create({
key: 'idle' + options.key,
frames: this.anims.generateFrameNumbers('char' + options.key, {start: 126, end: 131}),
frameRate: 10,
repeat: -1
});
new Player(this, options, 'char' + options.key).play('idle' + options.key, true)
.setInteractive()
.on('pointerdown', () => {
this.textures.addSpriteSheet('char', this.textures.get('char' + options.key).getSourceImage(), {
frameWidth: 79,
frameHeight: 63,
margin: 1,
spacing: 2
});
this.scene.start('Game');
})
}
}
src/scenes/Preload.js
+16 -1
View File
@@ -6,12 +6,15 @@
import logoImg from "../../public/favicon.png";
import map from "../assets/lvl1.json";
import menu from "../assets/menu.json";
import skeletonAtlas from "../assets/skeleton.json";
import skeletonSprite from "../assets/skeleton.png";
import charA from "../assets/char_a/spritesheet.png";
import charB from "../assets/char_b/spritesheet.png";
import charC from "../assets/char_c/spritesheet.png";
import charD from "../assets/char_d/spritesheet.png";
import tiles from "../assets/newtiles.png";
import menutiles from "../assets/menu.png";
import buttontiles from "../assets/buttons.png";
import batFly from "../assets/BatFly.png";
import batDie from "../assets/BatDie.png";
import item_01 from "../assets/items/itemshard_01.png";
@@ -36,17 +39,29 @@ export default class Preload extends Phaser.Scene {
this.load.spritesheet('charD', charD, {frameWidth: 79, frameHeight: 63, margin: 1, spacing: 2});
this.load.spritesheet('tiles', tiles, {frameWidth: 16, frameHeight: 16, margin: 1, spacing: 2});
this.load.spritesheet('menutiles', menutiles, {frameWidth: 16, frameHeight: 16, margin: 1, spacing: 2});
this.load.spritesheet('buttontiles', buttontiles, {frameWidth: 16, frameHeight: 16, margin: 1, spacing: 2});
this.load.spritesheet('batFly', batFly, {frameWidth: 48, frameHeight: 32/*, margin: 1, spacing: 2*/});
this.load.spritesheet('batDie', batDie, {frameWidth: 48, frameHeight: 32/*, margin: 1, spacing: 2*/});
this.load.tilemapTiledJSON("map", map);
this.load.tilemapTiledJSON("menu", menu);
this.load.atlas({key: 'skeleton', textureURL: skeletonSprite, atlasURL: skeletonAtlas});
}
create() {
this.add.image(this.cameras.main.centerX, this.cameras.main.centerY, 'logo').setOrigin(0.5, 0.5).setDisplaySize(this.cameras.main.centerX, this.cameras.main.centerX);
setTimeout(() => {
this.scene.start('Menu');
// this.scene.start('Menu');
this.scene.start('GUI', {key: 'MainMenu'});
}, 2 * 1000)
this.anims.create({
key: 'idle',
frames: this.anims.generateFrameNumbers('charA', {start: 126, end: 131}),
frameRate: 10,
repeat: -1
});
}
loadingScreen() {