diff --git a/public/entities/zombie-dead.png b/public/entities/zombie-dead.png new file mode 100644 index 0000000..b91e6b6 Binary files /dev/null and b/public/entities/zombie-dead.png differ diff --git a/public/entities/zombie-dead.svg b/public/entities/zombie-dead.svg deleted file mode 100644 index bb77ab7..0000000 --- a/public/entities/zombie-dead.svg +++ /dev/null @@ -1,44 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/public/entities/zombie-idle-frame1.png b/public/entities/zombie-idle-frame1.png new file mode 100644 index 0000000..625134e Binary files /dev/null and b/public/entities/zombie-idle-frame1.png differ diff --git a/public/entities/zombie-idle-frame2.png b/public/entities/zombie-idle-frame2.png new file mode 100644 index 0000000..3410164 Binary files /dev/null and b/public/entities/zombie-idle-frame2.png differ diff --git a/public/entities/zombie-idle-frame3.png b/public/entities/zombie-idle-frame3.png new file mode 100644 index 0000000..2ddc02f Binary files /dev/null and b/public/entities/zombie-idle-frame3.png differ diff --git a/public/entities/zombie-idle-frame4.png b/public/entities/zombie-idle-frame4.png new file mode 100644 index 0000000..55fb65b Binary files /dev/null and b/public/entities/zombie-idle-frame4.png differ diff --git a/public/entities/zombie-idle.svg b/public/entities/zombie-idle.svg deleted file mode 100644 index b757918..0000000 --- a/public/entities/zombie-idle.svg +++ /dev/null @@ -1,60 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/renderer/Assets.ts b/renderer/Assets.ts index b129ddd..48e347c 100644 --- a/renderer/Assets.ts +++ b/renderer/Assets.ts @@ -6,8 +6,11 @@ export interface RendererAssets { landmine: HTMLImageElement | null; player: HTMLImageElement | null; rock: HTMLImageElement | null; - zombie: HTMLImageElement | null; zombieDead: HTMLImageElement | null; + zombieIdleFrame1: HTMLImageElement | null; + zombieIdleFrame2: HTMLImageElement | null; + zombieIdleFrame3: HTMLImageElement | null; + zombieIdleFrame4: HTMLImageElement | null; zombieWalkingFrame1: HTMLImageElement | null; zombieWalkingFrame2: HTMLImageElement | null; zombieWalkingFrame3: HTMLImageElement | null; @@ -22,8 +25,11 @@ export const assets: RendererAssets = { landmine: null, player: null, rock: null, - zombie: null, zombieDead: null, + zombieIdleFrame1: null, + zombieIdleFrame2: null, + zombieIdleFrame3: null, + zombieIdleFrame4: null, zombieWalkingFrame1: null, zombieWalkingFrame2: null, zombieWalkingFrame3: null, @@ -43,8 +49,11 @@ export async function loadAssets() { landmine, player, rock, - zombie, zombieDead, + zombieIdleFrame1, + zombieIdleFrame2, + zombieIdleFrame3, + zombieIdleFrame4, zombieWalkingFrame1, zombieWalkingFrame2, zombieWalkingFrame3, @@ -55,8 +64,11 @@ export async function loadAssets() { loadAssetImage("/entities/landmine.svg"), loadAssetImage("/entities/player-attacking.svg"), loadAssetImage("/entities/rock.svg"), - loadAssetImage("/entities/zombie-idle.svg"), - loadAssetImage("/entities/zombie-dead.svg"), + loadAssetImage("/entities/zombie-dead.png"), + loadAssetImage("/entities/zombie-idle-frame1.png"), + loadAssetImage("/entities/zombie-idle-frame2.png"), + loadAssetImage("/entities/zombie-idle-frame3.png"), + loadAssetImage("/entities/zombie-idle-frame4.png"), loadAssetImage("/entities/zombie-walking-frame1.png"), loadAssetImage("/entities/zombie-walking-frame2.png"), loadAssetImage("/entities/zombie-walking-frame3.png"), @@ -69,8 +81,11 @@ export async function loadAssets() { assets.landmine = landmine; assets.player = player; assets.rock = rock; - assets.zombie = zombie; assets.zombieDead = zombieDead; + assets.zombieIdleFrame1 = zombieIdleFrame1; + assets.zombieIdleFrame2 = zombieIdleFrame2; + assets.zombieIdleFrame3 = zombieIdleFrame3; + assets.zombieIdleFrame4 = zombieIdleFrame4; assets.zombieWalkingFrame1 = zombieWalkingFrame1; assets.zombieWalkingFrame2 = zombieWalkingFrame2; assets.zombieWalkingFrame3 = zombieWalkingFrame3; diff --git a/renderer/Renderer.ts b/renderer/Renderer.ts index 5bcdc55..3632f66 100644 --- a/renderer/Renderer.ts +++ b/renderer/Renderer.ts @@ -172,7 +172,7 @@ export class Renderer { } else if (entity.hasChange(ChangeType.Walking)) { return assets.zombieWalkingFrame1; } else { - return assets.zombie; + return assets.zombieIdleFrame1; } } } @@ -307,6 +307,24 @@ export class Renderer { ], }); } + } else if (entity.getType() === EntityType.Zombie && !entity.dead()) { + if ( + assets.zombieIdleFrame2 !== null && + assets.zombieIdleFrame3 !== null && + assets.zombieIdleFrame4 !== null + ) { + rendererItem.addEffect({ + type: RendererEffectType.AssetSwap, + duration: REPLAY_SPEED, + every: REPLAY_SPEED / 4, + startedAt: Date.now(), + steps: [ + assets.zombieIdleFrame2, + assets.zombieIdleFrame3, + assets.zombieIdleFrame4, + ], + }); + } } this.items.push(rendererItem);