@vpmedia/phaser 1.106.0 → 1.108.0

package/src/phaser/core/timer.ts

@@ -84,7 +84,7 @@ export class Timer {
     loop: boolean,
     repeatCount: number,
     callback: Function,
-    callbackContext: any = null,
+    callbackContext: any | null = null,
     args: any = []
   ) {
     const roundedDelay = Math.round(delay);
@@ -109,7 +109,7 @@ export class Timer {
    * @param {...any} args - Arguments to pass to the callback function.
    * @returns {TimerEvent} The created TimerEvent.
    */
-  add(delay: number, callback: Function, callbackContext: any = null, ...args: any[]) {
+  add(delay: number, callback: Function, callbackContext: any | null = null, ...args: any[]) {
     return this.create(delay, false, 0, callback, callbackContext, args);
   }
 
@@ -137,7 +137,7 @@ export class Timer {
    * @param {...any} args - Arguments to pass to the callback function.
    * @returns {TimerEvent} The created TimerEvent.
    */
-  repeat(delay: number, repeatCount: number, callback: Function, callbackContext: any = null, ...args: any[]) {
+  repeat(delay: number, repeatCount: number, callback: Function, callbackContext: any | null = null, ...args: any[]) {
     return this.create(delay, false, repeatCount, callback, callbackContext, args);
   }
 
@@ -149,7 +149,7 @@ export class Timer {
    * @param {...any} args - Arguments to pass to the callback function.
    * @returns {TimerEvent} The created TimerEvent.
    */
-  loop(delay: number, callback: Function, callbackContext: any = null, ...args: any[]) {
+  loop(delay: number, callback: Function, callbackContext: any | null = null, ...args: any[]) {
     return this.create(delay, true, 0, callback, callbackContext, args);
   }
 

package/src/phaser/core/tween.ts

@@ -162,7 +162,8 @@ export class Tween {
       const keys = Object.keys(this.timeline[i].vEnd);
       for (let k = 0; k < keys.length; k += 1) {
         const property = keys[k];
-        this.properties[property] = this.target[property] || 0;
+        const targetProperties = this.target as unknown as Record<string, number>;
+        this.properties[property] = targetProperties[property] || 0;
         if (!Array.isArray(this.properties[property])) {
           //  Ensures we're using numbers, not strings
           this.properties[property] *= 1;
@@ -214,11 +215,11 @@ export class Tween {
       return this;
     }
     if (index === -1) {
-      for (let i = 0; i < this.timeline.length; i += 1) {
-        this.timeline[i][property] = value;
+      for (const timelineEntry of this.timeline) {
+        (timelineEntry as unknown as Record<string, unknown>)[property] = value;
       }
     } else {
-      this.timeline[index][property] = value;
+      (this.timeline[index] as unknown as Record<string, unknown>)[property] = value;
     }
     return this;
   }
@@ -494,7 +495,8 @@ export class Tween {
       const keys = Object.keys(this.timeline[i].vEnd);
       for (let k = 0; k < keys.length; k += 1) {
         const property = keys[k];
-        this.properties[property] = this.target[property] || 0;
+        const targetProperties = this.target as unknown as Record<string, number>;
+        this.properties[property] = targetProperties[property] || 0;
         if (!Array.isArray(this.properties[property])) {
           //  Ensures we're using numbers, not strings
           this.properties[property] *= 1;

package/src/phaser/core/tween_data.ts

@@ -51,7 +51,7 @@ export class TweenData {
     this.delay = 0;
     this.dt = 0;
     this.startTime = null;
-    this.easingFunction = (k) => k;
+    this.easingFunction = (k: number) => k;
     this.interpolationFunction = MathUtils.linearInterpolation;
     this.interpolationContext = MathUtils;
     this.isRunning = false;
@@ -236,7 +236,7 @@ export class TweenData {
       }
       this.percent = this.dt / this.duration;
       this.value = this.easingFunction(this.percent);
-      const blob = {};
+      const blob: Record<string, number> = {};
       const keys = Object.keys(this.vEnd);
       for (let k = 0; k < keys.length; k += 1) {
         const property = keys[k];

package/src/phaser/core/tween_manager.ts

@@ -122,7 +122,7 @@ export class TweenManager {
    * @param {object} obj - The object to remove tweens from.
    * @param {object[]} children - Optional array of child objects to remove tweens from.
    */
-  removeFrom(obj: any, children: any[] = null) {
+  removeFrom(obj: any, children: any[] | null = null) {
     let i;
     let len;
     if (Array.isArray(obj)) {
@@ -214,7 +214,7 @@ export class TweenManager {
    * @returns {boolean} True if the object is being tweened, false otherwise.
    */
   isTweening(object: any) {
-    return this._tweens.some((tween) => tween.target === object);
+    return this._tweens.some((tween: Tween) => tween.target === object);
   }
 
   /**

package/src/phaser/display/bitmap_text.ts

@@ -70,7 +70,7 @@ export class BitmapText extends DisplayObject {
   /**
    * Destroys this bitmap text and cleans up resources.
    */
-  destroy() {
+  override destroy() {
     this._prevAnchor = null;
     this._glyphs = null;
     this._text = null;
@@ -81,13 +81,13 @@ export class BitmapText extends DisplayObject {
   /**
    * Called before the update cycle for this bitmap text.
    */
-  preUpdate() {
+  override preUpdate() {
     if (this.pendingDestroy) {
       this.destroy();
       return;
     }
 
-    if (!this.exists || !this.parent.exists) {
+    if (!this.exists || !this.parent?.exists) {
       this.renderOrderID = -1;
       return;
     }
@@ -299,7 +299,7 @@ export class BitmapText extends DisplayObject {
   /**
    * Updates the transform of this bitmap text, updating its text if needed.
    */
-  updateTransform(): this {
+  override updateTransform(): this {
     if (this.dirty || !this.anchor.equals(this._prevAnchor)) {
       this.updateText();
       this.dirty = false;
@@ -312,10 +312,10 @@ export class BitmapText extends DisplayObject {
   /**
    * Adds a color to a specific position in the text.
    * @param {string} value - The color to apply (in hex format or CSS color name).
-   * @param {number} position - The character position to apply the color to.
+   * @param {number} _position - The character position to apply the color to.
    * @returns {BitmapText} This bitmap text instance for chaining.
    */
-  addColor(value: string, position: number) {
+  addColor(value: string, _position: number) {
     const color = typeof value === 'string' ? Number.parseInt(value.replace('#', ''), 16) : value;
     if (color !== this._tint) {
       this._tint = color;

package/src/phaser/display/button.ts

@@ -10,6 +10,7 @@ const STATE_UP = 'Up';
 const STATE_DISABLED = 'Disabled';
 
 export class Button extends Image {
+  [key: `_on${string}Frame`]: string | null;
   _onOverFrame!: string | null;
   _onOutFrame!: string | null;
   _onDownFrame!: string | null;
@@ -42,14 +43,14 @@ export class Button extends Image {
     game: import('../core/game.js').Game,
     x: number = 0,
     y: number = 0,
-    key: string = null,
-    callback: Function = null,
-    callbackContext: any = null,
-    overFrame: string = null,
-    outFrame: string = null,
-    downFrame: string = null,
-    upFrame: string = null,
-    disabledFrame: string = null
+    key: string | null = null,
+    callback: Function | null = null,
+    callbackContext: any | null = null,
+    overFrame: string | null = null,
+    outFrame: string | null = null,
+    downFrame: string | null = null,
+    upFrame: string | null = null,
+    disabledFrame: string | null = null
   ) {
     super(game, x, y, key, outFrame);
     this.type = BUTTON;
@@ -83,7 +84,7 @@ export class Button extends Image {
   /**
    * Destroys this button and cleans up resources.
    */
-  destroy() {
+  override destroy() {
     this._onOverFrame = null;
     this._onOutFrame = null;
     this._onDownFrame = null;
@@ -95,14 +96,14 @@ export class Button extends Image {
       this.onInputDown.dispose();
       this.onInputUp.dispose();
     }
-    this.onInputOver = null;
-    this.onInputOut = null;
-    this.onInputDown = null;
-    this.onInputUp = null;
+    this.onInputOver = null!;
+    this.onInputOut = null!;
+    this.onInputDown = null!;
+    this.onInputUp = null!;
     if (this.input) {
       this.input.destroy();
     }
-    this.input = null;
+    this.input = null!;
     super.destroy();
   }
 
@@ -142,8 +143,8 @@ export class Button extends Image {
    * @param {string} frame - The frame identifier to set for this state.
    * @param {boolean} switchImmediately - Whether to switch to the new frame immediately (default: false).
    */
-  setStateFrame(state: string, frame: string, switchImmediately: boolean = false) {
-    const frameKey = `_on${state}Frame`;
+  setStateFrame(state: string, frame: string | null, switchImmediately: boolean = false) {
+    const frameKey: `_on${string}Frame` = `_on${state}Frame`;
     if (frame) {
       this[frameKey] = frame;
       if (switchImmediately) {
@@ -164,7 +165,7 @@ export class Button extends Image {
       return false;
     }
     const state = this.input.enabled || !this._onDisabledFrame ? newState : STATE_DISABLED;
-    const frameKey = `_on${state}Frame`;
+    const frameKey: `_on${string}Frame` = `_on${state}Frame`;
     const frame = this[frameKey];
     if (typeof frame === 'string') {
       this.frameName = frame;
@@ -184,7 +185,13 @@ export class Button extends Image {
    * @param {string} upFrame - The frame identifier to use when the button is released.
    * @param {string} disabledFrame - The frame identifier to use when the button is disabled.
    */
-  setFrames(overFrame: string, outFrame: string, downFrame: string, upFrame: string, disabledFrame: string = null) {
+  setFrames(
+    overFrame: string | null,
+    outFrame: string | null,
+    downFrame: string | null,
+    upFrame: string | null,
+    disabledFrame: string | null = null
+  ) {
     this.setStateFrame(STATE_OVER, overFrame, this.input.pointerOver());
     this.setStateFrame(STATE_OUT, outFrame, !this.input.pointerOver());
     this.setStateFrame(STATE_DOWN, downFrame, this.input.pointerDown());
@@ -196,10 +203,10 @@ export class Button extends Image {
 
   /**
    * Handles the input over event for this button.
-   * @param {object} sprite - The sprite that triggered the event.
+   * @param {object} _sprite - The sprite that triggered the event.
    * @param {object} pointer - The pointer that triggered the event.
    */
-  onInputOverHandler(sprite: any, pointer: any) {
+  onInputOverHandler(_sprite: any, pointer: any) {
     if (pointer.justReleased() && (this.justReleasedPreventsOver & pointer.pointerMode) === pointer.pointerMode) {
       //  If the Pointer was only just released then we don't fire an over event
       return;
@@ -215,10 +222,10 @@ export class Button extends Image {
 
   /**
    * Handles the input out event for this button.
-   * @param {object} sprite - The sprite that triggered the event.
+   * @param {object} _sprite - The sprite that triggered the event.
    * @param {object} pointer - The pointer that triggered the event.
    */
-  onInputOutHandler(sprite: any, pointer: any) {
+  onInputOutHandler(_sprite: any, pointer: any) {
     this.changeStateFrame(STATE_OUT);
     if (this.onInputOut) {
       this.onInputOut.dispatch(this, pointer);
@@ -227,10 +234,10 @@ export class Button extends Image {
 
   /**
    * Handles the input down event for this button.
-   * @param {object} sprite - The sprite that triggered the event.
+   * @param {object} _sprite - The sprite that triggered the event.
    * @param {object} pointer - The pointer that triggered the event.
    */
-  onInputDownHandler(sprite: any, pointer: any) {
+  onInputDownHandler(_sprite: any, pointer: any) {
     this.changeStateFrame(STATE_DOWN);
     if (this.onInputDown) {
       this.onInputDown.dispatch(this, pointer);
@@ -239,11 +246,11 @@ export class Button extends Image {
 
   /**
    * Handles the input up event for this button.
-   * @param {object} sprite - The sprite that triggered the event.
+   * @param {object} _sprite - The sprite that triggered the event.
    * @param {object} pointer - The pointer that triggered the event.
    * @param {boolean} isOver - Whether the pointer is currently over the button (default: true).
    */
-  onInputUpHandler(sprite: any, pointer: any, isOver: boolean) {
+  onInputUpHandler(_sprite: any, pointer: any, isOver: boolean) {
     if (this.onInputUp) {
       this.onInputUp.dispatch(this, pointer, isOver);
     }

package/src/phaser/display/canvas/renderer.ts

@@ -41,7 +41,7 @@ export class CanvasRenderer {
   renderSession!: any;
   /**
    * Creates a new CanvasRenderer instance.
-   * @param {import('../../core/game.js').Game} game - The game instance.
+   * @param {import('../../core/game.js').Game} _game - The game instance.
    */
   constructor(game: import('../../core/game.js').Game) {
     detectCapabilities(game);
@@ -176,7 +176,7 @@ export class CanvasRenderer {
    * Initializes the WebGL context for rendering.
    * @param {import('../../core/game.js').Game} game - The game instance.
    */
-  initContext(game: import('../../core/game.js').Game) {
+  initContext(_game: import('../../core/game.js').Game) {
     // stub
   }
 }

package/src/phaser/display/canvas/util.ts

@@ -42,10 +42,8 @@ export const setBackgroundColor = (canvas: HTMLCanvasElement, color: string) =>
  */
 export const setTouchAction = (canvas: HTMLCanvasElement, value: string = 'none') => {
   value = value || 'none';
-  // @ts-ignore
-  canvas.style.msTouchAction = value;
-  canvas.style['ms-touch-action'] = value;
-  canvas.style['touch-action'] = value;
+  canvas.style.setProperty('-ms-touch-action', value);
+  canvas.style.setProperty('touch-action', value);
   return canvas;
 };
 
@@ -57,13 +55,13 @@ export const setTouchAction = (canvas: HTMLCanvasElement, value: string = 'none'
  */
 export const setUserSelect = (canvas: HTMLCanvasElement, value: string = 'none') => {
   value = value || 'none';
-  canvas.style['-webkit-touch-callout'] = value;
-  canvas.style['-webkit-user-select'] = value;
-  canvas.style['-khtml-user-select'] = value;
-  canvas.style['-moz-user-select'] = value;
-  canvas.style['-ms-user-select'] = value;
-  canvas.style['user-select'] = value;
-  canvas.style['-webkit-tap-highlight-color'] = 'rgba(0, 0, 0, 0)';
+  canvas.style.setProperty('-webkit-touch-callout', value);
+  canvas.style.setProperty('-webkit-user-select', value);
+  canvas.style.setProperty('-khtml-user-select', value);
+  canvas.style.setProperty('-moz-user-select', value);
+  canvas.style.setProperty('-ms-user-select', value);
+  canvas.style.setProperty('user-select', value);
+  canvas.style.setProperty('-webkit-tap-highlight-color', 'rgba(0, 0, 0, 0)');
   return canvas;
 };
 
@@ -137,9 +135,11 @@ export const setTransform = (
  */
 export const getSmoothingPrefix = (context: CanvasRenderingContext2D) => {
   const VENDORS = ['i', 'webkitI', 'msI', 'mozI', 'oI'];
+  // the vendor-prefixed smoothing flags predate the standard property and are absent from lib.dom
+  const smoothingFlags = context as unknown as Record<string, boolean | undefined>;
   for (let i = 0; i < VENDORS.length; i += 1) {
     const s = `${VENDORS[i]}mageSmoothingEnabled`;
-    if (context && context[s]) {
+    if (context && smoothingFlags[s]) {
       return s;
     }
   }

package/src/phaser/display/display_object.ts

@@ -20,36 +20,27 @@ export class DisplayObject {
   rotation = 0;
   /** @type {number} */
   alpha = 1;
-  /** @type {Rectangle} */
-  hitArea = null;
-  /** @type {DisplayObject} */
-  parent = null;
+  hitArea: Rectangle | null = null;
+  parent: DisplayObject | null = null;
   /** @type {number} */
   worldAlpha = 1;
   worldTransform!: Matrix;
   worldScale!: Point;
-  /** @type {Rectangle} */
-  filterArea = null;
+  filterArea: Rectangle | null = null;
   /** @type {number} */
   _sr = 0;
   /** @type {number} */
   _cr = 1;
   cachedBounds!: Rectangle;
-  /** @type {Rectangle} */
-  currentBounds = null;
-  /** @type {import('./graphics.js').Graphics} */
-  _mask = null;
-  /** @type {object[]} */
-  _filters = null;
-  /** @type {object} */
-  _filterBlock = null;
+  currentBounds: Rectangle | null = null;
+  _mask: import('./graphics.js').Graphics | null = null;
+  _filters: object[] | null = null;
+  _filterBlock: object | null = null;
   children!: any[];
   /** @type {boolean} */
   ignoreChildInput = false;
-  /** @type {string | null} */
-  name = null;
-  /** @type {object | null} */
-  data = null;
+  name: string | null = null;
+  data: Record<string, any> | null = null;
   game!: import('../core/game.js').Game;
   type!: number;
   _cachedSprite!: any;
@@ -135,7 +126,7 @@ export class DisplayObject {
         this.children[i].destroy();
       }
     }
-    this.children = null;
+    this.children = null!;
     this.exists = false;
     this.renderable = false;
     this.visible = false;
@@ -148,11 +139,11 @@ export class DisplayObject {
     */
     this.hitArea = null;
     this.parent = null;
-    this.worldTransform = null;
+    this.worldTransform = null!;
     // This.worldPosition = null;
-    this.worldScale = null;
+    this.worldScale = null!;
     this.filterArea = null;
-    this.cachedBounds = null;
+    this.cachedBounds = null!;
     this.currentBounds = null;
     this._mask = null;
     this.destroyCachedSprite();
@@ -319,12 +310,7 @@ export class DisplayObject {
     if (!this.game || !this.visible) {
       return this;
     }
-    let p = this.parent;
-    if (parent) {
-      p = parent;
-    } else if (!this.parent) {
-      p = this.game.world;
-    }
+    const p = parent ?? this.parent ?? this.game.world;
     // Create some matrix refs for easy access
     const pt = p.worldTransform;
     const wt = this.worldTransform;
@@ -510,7 +496,7 @@ export class DisplayObject {
    * @param {DisplayObject} child - The child display object to check.
    * @returns {boolean} True if the child is contained within this container, false otherwise.
    */
-  contains(child: DisplayObject) {
+  contains(child: DisplayObject | null): boolean {
     if (!child) {
       return false;
     }
@@ -778,13 +764,13 @@ export class DisplayObject {
    * Sets the mask for this display object.
    * @param {import('./graphics.js').Graphics} value - The mask object to set, or null to remove the mask.
    */
-  set mask(value: import('./graphics.js').Graphics) {
+  set mask(value: import('./graphics.js').Graphics | null) {
     if (this._mask) {
       this._mask.isMask = false;
     }
     this._mask = value;
     if (value) {
-      this._mask.isMask = true;
+      value.isMask = true;
     }
   }
 

package/src/phaser/display/graphics.ts

@@ -98,7 +98,7 @@ export class Graphics extends DisplayObject {
   /**
    * Destroys the graphics object and clears all data.
    */
-  destroy() {
+  override destroy() {
     // TODO
     this.clear();
     super.destroy();
@@ -478,7 +478,7 @@ export class Graphics extends DisplayObject {
   /**
    * Generates a texture from the graphics object (not implemented).
    */
-  generateTexture() {
+  override generateTexture() {
     // TODO
     this.game.logger.warn('graphics.generateTexture() is not implemented');
   }
@@ -487,7 +487,7 @@ export class Graphics extends DisplayObject {
    * Renders the graphics object using WebGL.
    * @param {object} renderSession - The render session to use.
    */
-  renderWebGL(renderSession: any) {
+  override renderWebGL(renderSession: any) {
     // if the sprite is not visible or the alpha is 0 then no need to render this element
     if (this.visible === false || this.alpha === 0 || this.isMask === true) {
       return;
@@ -547,7 +547,7 @@ export class Graphics extends DisplayObject {
    * Renders the graphics object using Canvas.
    * @param {object} renderSession - The render session to use.
    */
-  renderCanvas(renderSession: any) {
+  override renderCanvas(renderSession: any) {
     // if the sprite is not visible or the alpha is 0 then no need to render this element
     if (this.visible === false || this.alpha === 0 || this.isMask === true) {
       return;
@@ -604,7 +604,7 @@ export class Graphics extends DisplayObject {
    * @param {import('../geom/matrix.js').Matrix} matrix - The transformation matrix to use.
    * @returns {Rectangle} The bounds rectangle of the graphics object.
    */
-  getBounds(matrix: import('../geom/matrix.js').Matrix = null) {
+  override getBounds(matrix: import('../geom/matrix.js').Matrix | null = null) {
     if (!this.renderable) {
       return getEmptyRectangle();
     }
@@ -664,7 +664,7 @@ export class Graphics extends DisplayObject {
    * Gets the local bounds of the graphics object.
    * @returns {Rectangle} The local bounds rectangle of the graphics object.
    */
-  getLocalBounds() {
+  override getLocalBounds() {
     const matrixCache = this.worldTransform;
     this.worldTransform = getIdentityMatrix();
     for (let i = 0; i < this.children.length; i += 1) {
@@ -782,7 +782,7 @@ export class Graphics extends DisplayObject {
   /**
    * Generates a cached sprite representation of the graphics object.
    */
-  generateCachedSprite() {
+  override generateCachedSprite() {
     const bounds = this.getLocalBounds();
     if (!this._cachedSprite) {
       const canvasBuffer = new CanvasBuffer(bounds.width, bounds.height);
@@ -827,7 +827,7 @@ export class Graphics extends DisplayObject {
   /**
    * Destroys the cached sprite.
    */
-  destroyCachedSprite() {
+  override destroyCachedSprite() {
     if (!this._cachedSprite) {
       return;
     }
@@ -875,7 +875,7 @@ export class Graphics extends DisplayObject {
   /**
    * Performs post-update operations for the graphics object.
    */
-  postUpdate() {
+  override postUpdate() {
     if (this._boundsDirty) {
       this.updateLocalBounds();
       this._boundsDirty = false;

package/src/phaser/display/group.ts

@@ -30,8 +30,8 @@ export class Group extends DisplayObject {
    */
   constructor(
     game: import('../core/game.js').Game,
-    parent: DisplayObject = null,
-    name: string = null,
+    parent: DisplayObject | null = null,
+    name: string | null = null,
     addToStage: boolean = false
   ) {
     super(game);
@@ -80,7 +80,7 @@ export class Group extends DisplayObject {
    * @param {boolean} destroyChildren - Whether to destroy children as well.
    * @param {boolean} soft - Whether to perform a soft destroy (leaving the group in the parent's children list).
    */
-  destroy(destroyChildren: boolean = true, soft: boolean = false) {
+  override destroy(destroyChildren: boolean = true, soft: boolean = false) {
     if (this.game === null || this.ignoreDestroy) {
       return;
     }
@@ -93,7 +93,7 @@ export class Group extends DisplayObject {
       if (this.parent) {
         this.parent.removeChild(this);
       }
-      this.game = null;
+      this.game = null!;
       this.exists = false;
     }
   }
@@ -253,12 +253,12 @@ export class Group extends DisplayObject {
   /**
    * Updates the Z indices of all children in this group before the update cycle.
    */
-  preUpdate() {
+  override preUpdate() {
     if (this.pendingDestroy) {
       this.destroy();
       return;
     }
-    if (!this.exists || !this.parent.exists) {
+    if (!this.exists || !this.parent?.exists) {
       this.renderOrderID = -1;
       return;
     }
@@ -270,7 +270,7 @@ export class Group extends DisplayObject {
   /**
    * Updates all children in this group during the update cycle.
    */
-  update() {
+  override update() {
     let i = this.children.length;
     while (i) {
       i -= 1;
@@ -281,7 +281,7 @@ export class Group extends DisplayObject {
   /**
    * Updates all children in this group after the update cycle.
    */
-  postUpdate() {
+  override postUpdate() {
     for (let i = 0; i < this.children.length; i += 1) {
       this.children[i].postUpdate();
     }