diff --git a/src/main.js b/src/main.js index 27b2c21..d7a65e0 100644 --- a/src/main.js +++ b/src/main.js @@ -13,6 +13,8 @@ class ForestScene extends Phaser.Scene { this.totalMushrooms = 5; this.touch = { left: false, right: false }; this.touchPointers = { left: new Set(), right: new Set() }; + this.wasGrounded = false; + this.landing = false; } preload() { @@ -39,7 +41,10 @@ class ForestScene extends Phaser.Scene { fill.destroy(); }); - this.load.image('player-sheet', '/assets/player-sheet.png'); + this.load.spritesheet('player-game', '/assets/player-game-sheet.png', { + frameWidth: 280, + frameHeight: 220 + }); this.load.image('flora-sheet', '/assets/flora-sheet.png'); this.load.image('fauna-sheet', '/assets/fauna-sheet.png'); this.load.image('terrain-sheet', '/assets/terrain-sheet.png'); @@ -108,20 +113,6 @@ class ForestScene extends Phaser.Scene { this.textures.get(textureKey).add(name, 0, x, y, width, height); }; - [ - ['idle0', 15, 87, 134, 153], - ['idle1', 148, 91, 129, 150], - ['idle2', 269, 90, 127, 151], - ['idle3', 393, 86, 153, 154], - ['run0', 607, 101, 148, 139], - ['run5', 1286, 105, 147, 135], - ['jump0', 23, 355, 172, 140], - ['jump1', 187, 328, 176, 146], - ['fall0', 496, 330, 134, 161], - ['fall1', 643, 325, 135, 167], - ['land0', 982, 345, 194, 146], - ['land1', 1203, 348, 163, 144] - ].forEach(([name, x, y, w, h]) => addFrame('player-sheet', name, x, y, w, h)); addFrame('terrain-sheet', 'ground-main', 24, 32, 341, 107); addFrame('terrain-sheet', 'log-platform', 21, 327, 269, 79); @@ -155,32 +146,39 @@ class ForestScene extends Phaser.Scene { this.anims.create({ key: 'squirrel-idle', - frames: frames('player-sheet', ['idle0', 'idle1', 'idle2', 'idle3']), + frames: this.anims.generateFrameNumbers('player-game', { frames: [0, 1, 2, 3, 4] }), frameRate: 4, repeat: -1 }); this.anims.create({ key: 'squirrel-run', - frames: frames('player-sheet', ['run0', 'run5']), - frameRate: 7, + frames: this.anims.generateFrameNumbers('player-game', { frames: [6, 7, 8, 9, 10, 11] }), + frameRate: 11, repeat: -1 }); this.anims.create({ key: 'squirrel-jump', - frames: frames('player-sheet', ['jump0', 'jump1']), + frames: this.anims.generateFrameNumbers('player-game', { frames: [12, 13] }), frameRate: 8, repeat: 0 }); this.anims.create({ key: 'squirrel-fall', - frames: frames('player-sheet', ['fall0', 'fall1']), + frames: this.anims.generateFrameNumbers('player-game', { frames: [14, 15] }), frameRate: 5, repeat: -1 }); + this.anims.create({ + key: 'squirrel-land', + frames: this.anims.generateFrameNumbers('player-game', { frames: [16, 17] }), + frameRate: 10, + repeat: 0 + }); + this.anims.create({ key: 'frog-hop', frames: frames('fauna-sheet', ['frog0', 'frog1', 'frog2', 'frog3', 'frog4']), @@ -449,13 +447,13 @@ class ForestScene extends Phaser.Scene { } createPlayer() { - this.player = this.physics.add.sprite(160, 520, 'player-sheet', 'idle0'); - this.player.setScale(0.58); + this.player = this.physics.add.sprite(160, 520, 'player-game', 0); + this.player.setScale(0.42); this.player.setCollideWorldBounds(true); this.player.setDragX(900); this.player.setMaxVelocity(330, 760); - this.player.body.setSize(58, 88, true); - this.player.body.setOffset(38, 54); + this.player.body.setSize(95, 145, true); + this.player.body.setOffset(92, 65); this.player.play('squirrel-idle'); } @@ -761,21 +759,36 @@ class ForestScene extends Phaser.Scene { } const grounded = this.player.body.blocked.down || this.player.body.touching.down; + + if (grounded && !this.wasGrounded) { + this.landing = true; + this.player.play('squirrel-land', true); + this.player.once('animationcomplete-squirrel-land', () => { + this.landing = false; + }); + } + if (grounded) { this.player.setAngle(0); - if (Math.abs(this.player.body.velocity.x) > 35) { - this.player.play('squirrel-run', true); - } else { - this.player.play('squirrel-idle', true); + if (!this.landing) { + if (Math.abs(this.player.body.velocity.x) > 35) { + this.player.play('squirrel-run', true); + } else { + this.player.play('squirrel-idle', true); + } } } else if (this.player.body.velocity.y < 0) { + this.landing = false; this.player.play('squirrel-jump', true); this.player.setAngle(Phaser.Math.Clamp(this.player.body.velocity.x * 0.012, -5, 5)); } else { + this.landing = false; this.player.play('squirrel-fall', true); this.player.setAngle(Phaser.Math.Clamp(this.player.body.velocity.x * 0.012, -5, 5)); } + this.wasGrounded = grounded; + this.acornGroup.children.iterate(acorn => { if (!acorn?.active) return; acorn.setAngle(Math.sin(time * 0.003 + acorn.getData('phase')) * 10);