63 lines
2.3 KiB
TypeScript
63 lines
2.3 KiB
TypeScript
import Phaser from 'phaser'
|
|
|
|
const CHAR_FRAME_W = 16
|
|
const CHAR_FRAME_H = 32
|
|
const CHAR_COUNT = 6
|
|
|
|
export class BootScene extends Phaser.Scene {
|
|
constructor() {
|
|
super('Boot')
|
|
}
|
|
|
|
preload() {
|
|
this.load.image('office-bg', 'assets/office-bg.png')
|
|
this.load.spritesheet('office-tileset-32', 'assets/office-tileset-32.png', {
|
|
frameWidth: 32,
|
|
frameHeight: 32,
|
|
})
|
|
|
|
for (let i = 0; i < CHAR_COUNT; i++) {
|
|
this.load.spritesheet(`char_${i}`, `assets/characters/char_${i}.png`, {
|
|
frameWidth: CHAR_FRAME_W,
|
|
frameHeight: CHAR_FRAME_H,
|
|
})
|
|
}
|
|
|
|
const bar = this.add.graphics()
|
|
this.load.on('progress', (v: number) => {
|
|
bar.clear()
|
|
bar.fillStyle(0x4a90d9, 1)
|
|
bar.fillRect(this.scale.width / 2 - 100, this.scale.height / 2 - 8, 200 * v, 16)
|
|
})
|
|
this.load.on('complete', () => bar.destroy())
|
|
}
|
|
|
|
create() {
|
|
this.createCharacterAnimations()
|
|
console.log('[BootScene] All assets loaded')
|
|
this.scene.start('Office')
|
|
}
|
|
|
|
private createCharacterAnimations() {
|
|
const COLS = 7
|
|
const dirs = [
|
|
{ name: 'down', row: 0 },
|
|
{ name: 'up', row: 1 },
|
|
{ name: 'right', row: 2 },
|
|
{ name: 'left', row: 2 },
|
|
]
|
|
for (let p = 0; p < CHAR_COUNT; p++) {
|
|
const key = `char_${p}`
|
|
for (const dir of dirs) {
|
|
const base = dir.row * COLS
|
|
this.anims.create({ key: `${key}_walk_${dir.name}`, frames: [{ key, frame: base }, { key, frame: base + 1 }, { key, frame: base + 2 }, { key, frame: base + 1 }], frameRate: 8, repeat: -1 })
|
|
this.anims.create({ key: `${key}_idle_${dir.name}`, frames: [{ key, frame: base + 1 }], frameRate: 1 })
|
|
this.anims.create({ key: `${key}_type_${dir.name}`, frames: [{ key, frame: base + 3 }, { key, frame: base + 4 }], frameRate: 3, repeat: -1 })
|
|
this.anims.create({ key: `${key}_read_${dir.name}`, frames: [{ key, frame: base + 5 }, { key, frame: base + 6 }], frameRate: 2, repeat: -1 })
|
|
this.anims.create({ key: `${key}_coffee_${dir.name}`, frames: [{ key, frame: base + 1 }, { key, frame: base }], frameRate: 2, repeat: -1 })
|
|
this.anims.create({ key: `${key}_celebrate_${dir.name}`, frames: [{ key, frame: base }, { key, frame: base + 1 }, { key, frame: base + 2 }, { key, frame: base + 1 }], frameRate: 6, repeat: -1 })
|
|
}
|
|
}
|
|
}
|
|
}
|