kiwiengine 0.0.1-alpha → 0.5.2

package/examples/simple-battle/stage.ts

@@ -0,0 +1,176 @@
+import { checkCollision, IntervalNode, isMobile, Joystick, musicPlayer, PhysicsWorld } from '../../src'
+import { Hero } from './objects/hero'
+import { Orc } from './objects/orc'
+import { Potion } from './objects/potion'
+
+function createTextElement() {
+  const el = document.createElement('div')
+  el.style.color = 'white'
+  el.style.position = 'absolute'
+  el.style.top = '10px'
+  el.style.zIndex = '1'
+  return el
+}
+
+const SCORE_PER_ORC = 100
+
+export class Stage extends PhysicsWorld {
+  #hero = new Hero();
+  #orcs: Set<Orc> = new Set();
+  #potions: Set<Potion> = new Set();
+
+  #time = 0
+  #score = 0
+  #isGameOver = false
+
+  #timeText: HTMLDivElement
+  #hpText: HTMLDivElement
+  #scoreText: HTMLDivElement
+
+  #spawnOrcInterval: IntervalNode
+  #spawnPotionInterval: IntervalNode
+
+  constructor() {
+    super()
+    musicPlayer.play('assets/bgm/battle.mp3')
+
+    this.add(this.#hero)
+    this.add(this.#spawnOrcInterval = new IntervalNode(1, () => this.#spawnOrc()))
+    this.add(this.#spawnPotionInterval = new IntervalNode(3, () => this.#spawnPotion()))
+
+    //for (let i = 0; i < 1000; i++) {
+    //this.#spawnOrc()
+    //}
+
+    const joystickImage = new Image()
+    joystickImage.src = 'assets/joystick/joystick.png'
+
+    const knobImage = new Image()
+    knobImage.src = 'assets/joystick/knob.png'
+
+    this.add(
+      new Joystick({
+        onMove: (r, d) => this.#hero.move(r, d),
+        onRelease: () => this.#hero.stop(),
+        onKeyDown: (code) => {
+          if (code === 'KeyA') this.#hero.attack()
+        },
+        joystickImage,
+        knobImage,
+        maxKnobDistance: 70,
+      }),
+    )
+
+    this.#timeText = createTextElement()
+    this.#hpText = createTextElement()
+    this.#scoreText = createTextElement()
+
+    this.#timeText.textContent = `Time: ${this.#time}`
+    this.#hpText.textContent = `HP: ${this.#hero.hp}`
+    this.#scoreText.textContent = `Score: ${this.#score}`
+
+    this.#timeText.style.left = '10px'
+    this.#hpText.style.left = '50%'
+    this.#hpText.style.transform = 'translate(-50%, 0)'
+    this.#scoreText.style.right = '10px'
+
+    this.#hero.on('hit', (damage) => {
+      for (const o of this.#orcs) {
+        if (checkCollision(this.#hero.hitbox, this.#hero.worldTransform, o.hurtbox, o.worldTransform)) {
+          o.takeDamage(damage)
+        }
+      }
+    })
+
+    this.#hero.on('changeHp', () => {
+      this.#hpText.textContent = `HP: ${this.#hero.hp}`
+    })
+
+    this.#hero.on('dead', () => {
+      this.#gameOver()
+    })
+  }
+
+  #gameOver() {
+    this.#isGameOver = true
+    this.#spawnOrcInterval.remove()
+    this.#spawnPotionInterval.remove()
+    for (const o of this.#orcs) {
+      o.stop()
+    }
+
+    const gameOverText = createTextElement()
+    gameOverText.textContent = 'Game Over'
+    gameOverText.style.left = '50%'
+    gameOverText.style.top = '50%'
+    gameOverText.style.transform = 'translate(-50%, -50%)'
+    this.renderer?.container.append(gameOverText)
+  }
+
+  protected override set renderer(renderer) {
+    super.renderer = renderer
+
+    if (renderer) {
+      const c = renderer.container
+      c.append(this.#timeText, this.#hpText, this.#scoreText)
+    }
+  }
+
+  protected override get renderer() {
+    return super.renderer
+  }
+
+  #spawnOrc() {
+    const o = new Orc()
+    o.x = Math.random() * 800 - 400
+    o.y = Math.random() * 600 - 300
+    o.on('hit', (damage) => {
+      if (checkCollision(this.#hero.hurtbox, this.#hero.worldTransform, o.hitbox, o.worldTransform)) {
+        this.#hero.takeDamage(damage)
+      }
+    })
+    this.add(o)
+    this.#orcs.add(o)
+    o.on('dead', () => {
+      this.#orcs.delete(o)
+      this.#score += SCORE_PER_ORC
+      this.#scoreText.textContent = `Score: ${this.#score}`
+    })
+  }
+
+  #spawnPotion() {
+    const p = new Potion()
+    p.x = Math.random() * 800 - 400
+    p.y = Math.random() * 600 - 300
+    this.add(p)
+    this.#potions.add(p)
+    p.on('remove', () => this.#potions.delete(p))
+  }
+
+  protected override update(dt: number) {
+    super.update(dt)
+    if (this.#isGameOver) return
+
+    const h = this.#hero
+    if (h.dead) return
+
+    for (const o of this.#orcs) {
+      if (checkCollision(h.hurtbox, h.worldTransform, o.hitbox, o.worldTransform)) {
+        o.attack()
+      } else {
+        o.moveTo(this.#hero.x, this.#hero.y)
+      }
+
+      if (isMobile && checkCollision(h.hitbox, h.worldTransform, o.hurtbox, o.worldTransform)) {
+        h.attack()
+      }
+    }
+
+    for (const p of this.#potions) {
+      if (checkCollision(h.hitbox, h.worldTransform, p.triggerCollider, p.worldTransform)) {
+        h.heal(p.healAmount)
+        p.remove()
+      }
+    }
+  }
+}

package/examples/spine-test/assets/spine/spineboy.atlas

@@ -0,0 +1,95 @@
+spineboy-pma.png
+	size: 1024, 256
+	filter: Linear, Linear
+	pma: true
+	scale: 0.5
+crosshair
+	bounds: 352, 7, 45, 45
+eye-indifferent
+	bounds: 862, 105, 47, 45
+eye-surprised
+	bounds: 505, 79, 47, 45
+front-bracer
+	bounds: 826, 66, 29, 40
+front-fist-closed
+	bounds: 786, 65, 38, 41
+front-fist-open
+	bounds: 710, 51, 43, 44
+	rotate: 90
+front-foot
+	bounds: 210, 6, 63, 35
+front-shin
+	bounds: 665, 128, 41, 92
+	rotate: 90
+front-thigh
+	bounds: 2, 2, 23, 56
+	rotate: 90
+front-upper-arm
+	bounds: 250, 205, 23, 49
+goggles
+	bounds: 665, 171, 131, 83
+gun
+	bounds: 798, 152, 105, 102
+head
+	bounds: 2, 27, 136, 149
+hoverboard-board
+	bounds: 2, 178, 246, 76
+hoverboard-thruster
+	bounds: 722, 96, 30, 32
+	rotate: 90
+hoverglow-small
+	bounds: 275, 81, 137, 38
+mouth-grind
+	bounds: 614, 97, 47, 30
+mouth-oooo
+	bounds: 612, 65, 47, 30
+mouth-smile
+	bounds: 661, 64, 47, 30
+muzzle-glow
+	bounds: 382, 54, 25, 25
+muzzle-ring
+	bounds: 275, 54, 25, 105
+	rotate: 90
+muzzle01
+	bounds: 911, 95, 67, 40
+	rotate: 90
+muzzle02
+	bounds: 792, 108, 68, 42
+muzzle03
+	bounds: 956, 171, 83, 53
+	rotate: 90
+muzzle04
+	bounds: 275, 7, 75, 45
+muzzle05
+	bounds: 140, 3, 68, 38
+neck
+	bounds: 250, 182, 18, 21
+portal-bg
+	bounds: 140, 43, 133, 133
+portal-flare1
+	bounds: 554, 65, 56, 30
+portal-flare2
+	bounds: 759, 112, 57, 31
+	rotate: 90
+portal-flare3
+	bounds: 554, 97, 58, 30
+portal-shade
+	bounds: 275, 121, 133, 133
+portal-streaks1
+	bounds: 410, 126, 126, 128
+portal-streaks2
+	bounds: 538, 129, 125, 125
+rear-bracer
+	bounds: 857, 67, 28, 36
+rear-foot
+	bounds: 663, 96, 57, 30
+rear-shin
+	bounds: 414, 86, 38, 89
+	rotate: 90
+rear-thigh
+	bounds: 756, 63, 28, 47
+rear-upper-arm
+	bounds: 60, 5, 20, 44
+	rotate: 90
+torso
+	bounds: 905, 164, 49, 90