diff --git a/packages/examples/src/examples/aseprite/ExampleAseprite.tsx b/packages/examples/src/examples/aseprite/ExampleAseprite.tsx index 494ed1adb..8cddc716d 100644 --- a/packages/examples/src/examples/aseprite/ExampleAseprite.tsx +++ b/packages/examples/src/examples/aseprite/ExampleAseprite.tsx @@ -18,7 +18,9 @@ export const ExampleAseprite = () => { id="animation_name" onChange={(event) => { // eslint-disable-next-line @typescript-eslint/no-unsafe-call - paladin.renderable.setCurrentAnimation(event.target.value); + (paladin.renderable as me.Sprite).setCurrentAnimation( + event.target.value, + ); }} > diff --git a/packages/examples/src/examples/aseprite/entities.ts b/packages/examples/src/examples/aseprite/entities.ts index 654e9527d..1e6c6f0b5 100644 --- a/packages/examples/src/examples/aseprite/entities.ts +++ b/packages/examples/src/examples/aseprite/entities.ts @@ -16,7 +16,7 @@ export class Paladin extends me.Entity { // create a new sprite with all animations from the paladin atlas this.renderable = textureAtlas.createAnimationFromName(); // eslint-disable-next-line @typescript-eslint/no-unsafe-call - this.renderable.setCurrentAnimation("run front"); + (this.renderable as me.Sprite).setCurrentAnimation("run front"); this.anchorPoint.set(0.5, 0.0); this.renderable.scale(4); diff --git a/packages/examples/src/examples/aseprite/play.ts b/packages/examples/src/examples/aseprite/play.ts index 651336b46..71bf8cda8 100644 --- a/packages/examples/src/examples/aseprite/play.ts +++ b/packages/examples/src/examples/aseprite/play.ts @@ -4,7 +4,7 @@ import { Paladin } from "./entities"; export let paladin: me.Entity; export class PlayScreen extends me.Stage { - onResetEvent() { + override onResetEvent() { paladin = new Paladin(); me.game.world.addChild(paladin, 2); } diff --git a/packages/examples/src/examples/graphics/ExampleGraphics.tsx b/packages/examples/src/examples/graphics/ExampleGraphics.tsx index 80a917f52..7d57e4507 100644 --- a/packages/examples/src/examples/graphics/ExampleGraphics.tsx +++ b/packages/examples/src/examples/graphics/ExampleGraphics.tsx @@ -1,10 +1,12 @@ import { + type CanvasRenderer, Color, Ellipse, Polygon, Renderable, RoundRect, Tween, + type WebGLRenderer, game, video, } from "melonjs"; @@ -25,6 +27,17 @@ const createGame = () => { } class Graphics extends Renderable { + starMask: Polygon; + polymask: Polygon; + circleMask: Ellipse; + stripe1: Polygon; + stripe2: Polygon; + stripe3: Polygon; + roundRect1: RoundRect; + roundRect2: RoundRect; + rrect1Tween: Tween; + rrect2Tween: Tween; + color: Color; // constructor constructor() { super(0, 0, game.viewport.width, game.viewport.height); @@ -105,12 +118,12 @@ const createGame = () => { this.anchorPoint.set(0, 0); } - update() { + override update() { return true; } // draw function - draw(renderer) { + override draw(renderer: WebGLRenderer | CanvasRenderer) { renderer.clearColor("#FFFFFF"); renderer.setGlobalAlpha(1.0); @@ -180,5 +193,4 @@ const createGame = () => { game.world.addChild(new Graphics()); }; - export const ExampleGraphics = createExampleComponent(createGame); diff --git a/packages/examples/src/examples/whac-a-mole/ExampleWhacAMole.ts b/packages/examples/src/examples/whac-a-mole/ExampleWhacAMole.ts index a81499556..ad4eb54f0 100644 --- a/packages/examples/src/examples/whac-a-mole/ExampleWhacAMole.ts +++ b/packages/examples/src/examples/whac-a-mole/ExampleWhacAMole.ts @@ -18,7 +18,7 @@ const createGame = () => { save.add({ hiscore: 0 }); // set the local hiscore value - data.hiscore = save.hiscore; + data.hiscore = save.hiscore as number; // set all ressources to be loaded loader.preload(resources, () => { diff --git a/packages/examples/src/examples/whac-a-mole/HUD.ts b/packages/examples/src/examples/whac-a-mole/HUD.ts index 8a427fbdb..0023d44a1 100644 --- a/packages/examples/src/examples/whac-a-mole/HUD.ts +++ b/packages/examples/src/examples/whac-a-mole/HUD.ts @@ -1,14 +1,25 @@ -import { BitmapText, Container, Renderable, video } from "melonjs"; +import { + BitmapText, + type CanvasRenderer, + Container, + Renderable, + type WebGLRenderer, + video, +} from "melonjs"; + import { data } from "./data"; /** * a basic HUD item to display score */ class ScoreItem extends Renderable { + private scoreRef: string; + private font: BitmapText; // Declare the 'font' property + /** * constructor */ - constructor(score, align, x, y) { + constructor(score: string, align: string, x: number, y: number) { // call the super constructor // (size does not matter here) super(x, y, 10, 10); @@ -31,8 +42,13 @@ class ScoreItem extends Renderable { /** * draw the score */ - draw(context) { - this.font.draw(context, data[this.scoreRef], this.pos.x, this.pos.y); + override draw(renderer: WebGLRenderer | CanvasRenderer) { + this.font.draw( + renderer, + data[this.scoreRef].toString(), + this.pos.x, + this.pos.y, + ); } } @@ -48,7 +64,7 @@ export class HUDContainer extends Container { this.isPersistent = true; // make sure our object is always draw first - this.z = Number.POSITIVE_INFINITY; + this.depth = Number.POSITIVE_INFINITY; // give a name this.name = "HUD"; diff --git a/packages/examples/src/examples/whac-a-mole/data.ts b/packages/examples/src/examples/whac-a-mole/data.ts index 24250bccd..2e7de4a82 100644 --- a/packages/examples/src/examples/whac-a-mole/data.ts +++ b/packages/examples/src/examples/whac-a-mole/data.ts @@ -1,8 +1,13 @@ +// Add an index signature to the 'data' object +interface Data { + [key: string]: number; +} + /** * local game data */ -export const data = { +export const data: Data = { // score information - score: 0, - hiscore: 0, + score: 0 as number, + hiscore: 0 as number, }; diff --git a/packages/examples/src/examples/whac-a-mole/manager.ts b/packages/examples/src/examples/whac-a-mole/manager.ts index bb939207e..ae36c1419 100644 --- a/packages/examples/src/examples/whac-a-mole/manager.ts +++ b/packages/examples/src/examples/whac-a-mole/manager.ts @@ -5,6 +5,9 @@ import { MoleEntity } from "./mole"; * a mole manager (to manage movement, etc..) */ export class MoleManager extends Renderable { + moles: MoleEntity[]; // declare the 'moles' property + timer: number; // declare the 'timer' property + constructor() { // call the super constructor super(0, 0, { @@ -39,7 +42,7 @@ export class MoleManager extends Renderable { /* * update function */ - update(dt) { + override update(dt: number) { // every 1/2 seconds display moles randomly this.timer += dt; if (this.timer >= 500) { diff --git a/packages/examples/src/examples/whac-a-mole/mole.ts b/packages/examples/src/examples/whac-a-mole/mole.ts index ca34477f2..f7b7f8713 100644 --- a/packages/examples/src/examples/whac-a-mole/mole.ts +++ b/packages/examples/src/examples/whac-a-mole/mole.ts @@ -6,7 +6,14 @@ import { data } from "./data"; * note : we don"t use EntityObject, since we wont" use regular collision, etc.. */ export class MoleEntity extends Sprite { - constructor(x, y) { + isVisible: boolean; + isOut: boolean; + timer: number; + initialPos: number; + displayTween: Tween; + hideTween: Tween; + + constructor(x: number, y: number) { // call the constructor super(x, y, { image: "mole", framewidth: 178, frameheight: 140 }); @@ -30,10 +37,6 @@ export class MoleEntity extends Sprite { this.initialPos = this.pos.y; - // tween to display/hide the moles - this.displayTween = null; - this.hideTween = null; - this.isKinematic = false; // register on mouse event @@ -124,7 +127,7 @@ export class MoleEntity extends Sprite { /** * update the mole */ - update(dt) { + override update(dt: number) { if (this.isVisible) { // call the super function to manage animation super.update(dt);