kiwiengine 0.5.4 → 0.5.6

package/src/node/core/renderable.ts

@@ -69,4 +69,7 @@ export abstract class RenderableNode<C extends PixiContainer, E extends EventMap
 
   set tint(t) { this._pixiContainer.tint = t }
   get tint() { return this._pixiContainer.tint }
+
+  hide() { this._pixiContainer.visible = false }
+  show() { this._pixiContainer.visible = true }
 }

package/src/node/core/transformable.ts

@@ -13,6 +13,7 @@ export type TransformableNodeOptions = {
   pivotX?: number
   pivotY?: number
   rotation?: number
+  drawOrder?: number
 
   alpha?: number
   layer?: string
@@ -38,6 +39,7 @@ export abstract class TransformableNode<C extends PixiContainer, E extends Event
     if (options.pivotY !== undefined) this.pivotY = options.pivotY
     if (options.rotation !== undefined) this.rotation = options.rotation
     if (options.alpha !== undefined) this.alpha = options.alpha
+    if (options.drawOrder !== undefined) this.drawOrder = options.drawOrder
 
     this.#layer = options.layer
     this.#useYSort = options.useYSort ?? false
@@ -75,7 +77,7 @@ export abstract class TransformableNode<C extends PixiContainer, E extends Event
     } else {
       const lt = this.localTransform
       pc.position.set(lt.x, lt.y)
-      if (this.#useYSort) pc.zIndex = lt.y
+      if (this.#useYSort) this.drawOrder = lt.y
       pc.pivot.set(lt.pivotX, lt.pivotY)
       pc.scale.set(lt.scaleX, lt.scaleY)
       pc.rotation = lt.rotation
@@ -108,4 +110,7 @@ export abstract class TransformableNode<C extends PixiContainer, E extends Event
 
   set rotation(v) { this.localTransform.rotation = v }
   get rotation() { return this.localTransform.rotation }
+
+  set drawOrder(v) { this._pixiContainer.zIndex = v }
+  get drawOrder() { return this._pixiContainer.zIndex }
 }

package/src/node/ext/animated-sprite.ts

@@ -10,7 +10,7 @@ export type AnimatedSpriteNodeOptions = {
   animation: string
 } & GameObjectOptions
 
-export class AnimatedSpriteNode<E extends EventMap = EventMap> extends GameObject<E & {
+export class AnimatedSpriteNode<E extends EventMap = {}> extends GameObject<E & {
   animationend: (animation: string) => void
 }> {
   #src: string
@@ -46,25 +46,26 @@ export class AnimatedSpriteNode<E extends EventMap = EventMap> extends GameObjec
     this.#sprite?.destroy()
     this.#sprite = undefined
 
-    if (this.#sheet) {
-      if (!this.#sheet.animations[this.#animation]) {
-        console.error(`Animation not found: ${this.#animation}`)
-        return
-      }
+    if (!this.#sheet) return
 
-      const a = this.#atlas.animations[this.#animation]
-      const s = new PixiAnimatedSprite(this.#sheet.animations[this.#animation])
+    if (!this.#sheet.animations[this.#animation]) {
+      console.error(`Animation not found: ${this.#animation}`)
+      return
+    }
 
-      s.anchor.set(0.5, 0.5)
-      s.loop = a.loop
-      s.animationSpeed = a.fps / 60
-      s.play()
-      s.onLoop = () => (this as any).emit('animationend', this.#animation)
-      s.onComplete = () => (this as any).emit('animationend', this.#animation)
+    const a = this.#atlas.animations[this.#animation]
+    const s = new PixiAnimatedSprite(this.#sheet.animations[this.#animation])
 
-      this._pixiContainer.addChild(s)
-      this.#sprite = s
-    }
+    s.anchor.set(0.5, 0.5)
+    s.zIndex = -999999
+    s.loop = a.loop
+    s.animationSpeed = a.fps / 60
+    s.play()
+    s.onLoop = () => (this as any).emit('animationend', this.#animation)
+    s.onComplete = () => (this as any).emit('animationend', this.#animation)
+
+    this._pixiContainer.addChild(s)
+    this.#sprite = s
   }
 
   set src(src) {

package/src/node/ext/bitmap-text.ts

@@ -1,18 +1,21 @@
 import { EventMap } from '@webtaku/event-emitter'
 import { Rectangle as PixiRectangle, Sprite as PixiSprite, Texture as PixiTexture } from 'pixi.js'
 import { bitmapFontLoader } from '../../asset/loaders/bitmap-font'
+import { BitmapFont } from '../../types/bitmap-font'
 import { GameObject, GameObjectOptions } from '../core/game-object'
 
 export type BitmapTextNodeOptions = {
   fnt: string
   src: string
-  text: string
+  text?: string
 } & GameObjectOptions
 
-export class BitmapTextNode<E extends EventMap = EventMap> extends GameObject<E> {
+export class BitmapTextNode<E extends EventMap = {}> extends GameObject<E> {
   #fnt: string
   #src: string
-  #text: string
+  #text?: string
+
+  #font?: BitmapFont
   #sprites: PixiSprite[] = []
 
   constructor(options: BitmapTextNodeOptions) {
@@ -23,21 +26,14 @@ export class BitmapTextNode<E extends EventMap = EventMap> extends GameObject<E>
     this.#load()
   }
 
-  async #load() {
-    let font
-    if (bitmapFontLoader.checkCached(this.#fnt)) {
-      font = bitmapFontLoader.getCached(this.#fnt)
-    } else {
-      console.info(`Bitmap font not preloaded. Loading now: ${this.#fnt}`)
-      font = await bitmapFontLoader.load(this.#fnt, this.#src)
-    }
-    if (!font) return
-
+  #updateText() {
     for (const sprite of this.#sprites) {
       sprite.destroy()
     }
     this.#sprites = []
 
+    if (!this.#font || !this.#text) return
+
     let xPos = 0, yPos = 0
     let minX = Infinity, minY = Infinity
     let maxX = -Infinity, maxY = -Infinity
@@ -47,16 +43,16 @@ export class BitmapTextNode<E extends EventMap = EventMap> extends GameObject<E>
 
       if (charCode === 10) {
         xPos = 0
-        yPos += font.lineHeight
+        yPos += this.#font.lineHeight
         continue
       }
 
-      const c = font.chars[charCode]
+      const c = this.#font.chars[charCode]
       if (!c) continue
 
       const frame = new PixiRectangle(c.x, c.y, c.width, c.height)
-      const texture = new PixiTexture({ source: font.texture.source, frame })
-      const sprite = new PixiSprite(texture)
+      const texture = new PixiTexture({ source: this.#font.texture.source, frame })
+      const sprite = new PixiSprite({ texture, zIndex: -999999 })
 
       const x0 = xPos + c.xoffset
       const y0 = yPos + c.yoffset
@@ -87,16 +83,27 @@ export class BitmapTextNode<E extends EventMap = EventMap> extends GameObject<E>
       maxY = 0
     }
 
-    const width = maxX - minX
-    const height = maxY - minY
+    const cx = (minX + maxX) / 2
+    const cy = (minY + maxY) / 2
 
     for (const s of this.#sprites) {
-      s.x -= width / 2
-      s.y -= height / 2
+      s.x -= cx
+      s.y -= cy
       this._pixiContainer.addChild(s)
     }
   }
 
+  async #load() {
+    if (bitmapFontLoader.checkCached(this.#fnt)) {
+      this.#font = bitmapFontLoader.getCached(this.#fnt)
+    } else {
+      console.info(`Bitmap font not preloaded. Loading now: ${this.#fnt}`)
+      this.#font = await bitmapFontLoader.load(this.#fnt, this.#src)
+    }
+
+    this.#updateText()
+  }
+
   changeFont(fnt: string, src: string) {
     if (this.#fnt !== fnt || this.#src !== src) {
       bitmapFontLoader.release(this.#fnt)
@@ -106,6 +113,15 @@ export class BitmapTextNode<E extends EventMap = EventMap> extends GameObject<E>
     }
   }
 
+  set text(text: string | undefined) {
+    this.#text = text
+    this.#updateText()
+  }
+
+  get text() {
+    return this.#text
+  }
+
   override remove() {
     bitmapFontLoader.release(this.#fnt)
     super.remove()

package/src/node/ext/spine.ts

@@ -19,7 +19,7 @@ export type SpineNodeOptions = {
   loop?: boolean
 } & GameObjectOptions
 
-export class SpineNode<E extends EventMap = EventMap> extends GameObject<E & {
+export class SpineNode<E extends EventMap = {}> extends GameObject<E & {
   animationend: (animation: string) => void
 }> {
   #atlas: string

package/src/node/ext/sprite.ts

@@ -7,7 +7,7 @@ export type SpriteNodeOptions = {
   src: string
 } & GameObjectOptions
 
-export class SpriteNode<E extends EventMap = EventMap> extends GameObject<E> {
+export class SpriteNode<E extends EventMap = {}> extends GameObject<E> {
   #src: string
   #sprite?: PixiSprite
 

package/src/node/physics/physics-object.ts

@@ -21,11 +21,12 @@ export type PhysicsObjectOptions = {
   useYSort?: boolean
 }
 
-export class PhysicsObject<E extends EventMap = EventMap> extends RenderableNode<PixiContainer, E> {
+export class PhysicsObject<E extends EventMap = {}> extends RenderableNode<PixiContainer, E> {
   #localTransform = new LocalTransform()
   #matterBody: Matter.Body
 
   #useYSort = false
+  #collisionsEnabled = true
 
   constructor(options: PhysicsObjectOptions) {
     super(new PixiContainer({ sortableChildren: true }))
@@ -65,7 +66,7 @@ export class PhysicsObject<E extends EventMap = EventMap> extends RenderableNode
         : parent.constructor?.name ?? typeof parent
       throw new Error(`PhysicsObject parent must be PhysicsWorld, but got ${actual}`)
     }
-    parent.addBody(this.#matterBody)
+    if (this.#collisionsEnabled) parent.addBody(this.#matterBody)
     super.parent = parent
   }
 
@@ -122,6 +123,12 @@ export class PhysicsObject<E extends EventMap = EventMap> extends RenderableNode
   get isStatic() { return this.#matterBody.isStatic }
 
   disableCollisions() {
+    this.#collisionsEnabled = false
     this.#removeFromWorld()
   }
+
+  enableCollisions() {
+    this.#collisionsEnabled = true;
+    (this.parent as PhysicsWorld)?.addBody(this.#matterBody)
+  }
 }

package/src/node/physics/physics-world.ts

@@ -7,7 +7,7 @@ export type PhysicsWorldOptions = {
   gravity?: number
 }
 
-export class PhysicsWorld<E extends EventMap = EventMap> extends RenderableNode<PixiContainer, E> {
+export class PhysicsWorld<E extends EventMap = {}> extends RenderableNode<PixiContainer, E> {
   #matterEngine = Matter.Engine.create()
 
   constructor(options?: PhysicsWorldOptions) {