@inglorious/engine 0.7.0 → 0.9.0

package/README.md

@@ -31,9 +31,9 @@ npm install @inglorious/engine
 
 ## API
 
-### `new Engine(gameConfig)`
+### `new Engine(...gameConfigs)`
 
-Creates a new `Engine` instance.
+Creates a new `Engine` instance, given one or more configuration objects.
 
 **Parameters:**
 
@@ -41,10 +41,9 @@ Creates a new `Engine` instance.
   - `loop` (object, optional): Configuration for the game loop.
     - `type` (string, optional): The type of loop to use (`animationFrame` or `fixed`). Defaults to `animationFrame`.
     - `fps` (number, optional): The target frames per second. Only used with the `fixed` loop type. Defaults to `60`.
-  - `systems` (array, optional): An array of system objects, which define behaviors for the whole state.
   - `types` (object, optional): A map of entity types.
   - `entities` (object, optional): A map of initial entities.
-  - `renderer` (object, optional): A renderer entity responsible for drawing the game. It must implement `getSystems()` and `init(engine)` methods.
+  - `systems` (array, optional): An array of system objects, which define behaviors for the whole state.
 
 **Returns:**
 
@@ -81,11 +80,11 @@ Here is a complete example showing how to set up and run a game using the engine
     <script type="importmap">
       {
         "imports": {
-          "immer": "https://unpkg.com/immer@10.1.1/dist/immer.mjs",
-          "@inglorious/utils/": "https://unpkg.com/@inglorious%2Futils@1.1.0/",
-          "@inglorious/store/": "https://unpkg.com/@inglorious%2Fstore@2.0.0/",
-          "@inglorious/engine/": "https://unpkg.com/@inglorious%2Fengine@0.7.0/",
-          "@inglorious/renderers/": "https://unpkg.com/@inglorious%2Frenderer-2d@0.2.0/",
+          "immer": "https://unpkg.com/immer@latest/dist/immer.mjs",
+          "@inglorious/utils/": "https://unpkg.com/@inglorious%2Futils@latest/src/",
+          "@inglorious/store/": "https://unpkg.com/@inglorious%2Fstore@latest/src/",
+          "@inglorious/engine/": "https://unpkg.com/@inglorious%2Fengine@latest/src/",
+          "@inglorious/renderers/": "https://unpkg.com/@inglorious%2Frenderer-2d@latest/src/",
           "game": "/game.js"
         }
       }
@@ -93,7 +92,7 @@ Here is a complete example showing how to set up and run a game using the engine
 
     <script
       type="module"
-      src="https://unpkg.com/@inglorious%2Fengine@0.7.0/main.js"
+      src="https://unpkg.com/@inglorious%2Fengine@latest/src/main.js"
     ></script>
   </body>
 </html>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inglorious/engine",
-  "version": "0.7.0",
+  "version": "0.9.0",
   "description": "A JavaScript game engine written with global state, immutability, and pure functions in mind. Have fun(ctional programming) with it!",
   "author": "IceOnFire <antony.mistretta@gmail.com> (https://ingloriouscoderz.it)",
   "license": "MIT",
@@ -24,16 +24,14 @@
     "./*": "./src/*"
   },
   "files": [
-    "src",
-    "README.md",
-    "LICENSE"
+    "src"
   ],
   "publishConfig": {
     "access": "public"
   },
   "dependencies": {
-    "@inglorious/utils": "1.1.0",
-    "@inglorious/store": "2.0.0"
+    "@inglorious/store": "3.0.0",
+    "@inglorious/utils": "2.1.0"
   },
   "devDependencies": {
     "prettier": "^3.5.3",

package/src/behaviors/audio.js

@@ -1,13 +1,17 @@
+const DEFAULT_VOLUME = 1
+
 export function audio() {
   const audioContext = new (window.AudioContext || window.webkitAudioContext)()
+
   const audioBufferCache = new Map()
+  const activeSources = new Map()
 
   return {
     async init(entity) {
       const sounds = entity.sounds || {}
 
       await Promise.all(
-        Object.entries(sounds).map(async ([name, url]) => {
+        Object.entries(sounds).map(async ([name, { url }]) => {
           const response = await fetch(url)
           const arrayBuffer = await response.arrayBuffer()
           const audioBuffer = await audioContext.decodeAudioData(arrayBuffer)
@@ -16,13 +20,36 @@ export function audio() {
       )
     },
 
-    playSound(entity, name) {
+    soundPlay(entity, name) {
+      const { volume = DEFAULT_VOLUME, loop } = entity.sounds[name]
       const audioBuffer = audioBufferCache.get(name)
 
       const source = audioContext.createBufferSource()
+      const gainNode = audioContext.createGain()
+
       source.buffer = audioBuffer
-      source.connect(audioContext.destination)
+      gainNode.gain.value = volume
+
+      source.connect(gainNode)
+      gainNode.connect(audioContext.destination)
+
+      source.loop = loop
       source.start()
+
+      activeSources.set(name, source)
+    },
+
+    soundStop(entity, name) {
+      const source = activeSources.get(name)
+      source?.stop()
+      activeSources.delete(name)
+    },
+
+    stop() {
+      for (const source of activeSources.values()) {
+        source.stop()
+      }
+      activeSources.clear()
     },
   }
 }

package/src/core/engine.js

@@ -2,7 +2,9 @@ import { audio } from "@inglorious/engine/behaviors/audio.js"
 import { game } from "@inglorious/engine/behaviors/game.js"
 import { createApi } from "@inglorious/store/api.js"
 import { createStore } from "@inglorious/store/store.js"
-import { extend } from "@inglorious/utils/data-structures/objects.js"
+import { augmentType } from "@inglorious/store/types.js"
+import { isArray } from "@inglorious/utils/data-structures/array.js"
+import { extendWith } from "@inglorious/utils/data-structures/objects.js"
 
 import { coreEvents } from "./core-events.js"
 import { disconnectDevTools, initDevTools, sendAction } from "./dev-tools.js"
@@ -21,7 +23,7 @@ const DEFAULT_GAME_CONFIG = {
 
   types: {
     game: [game()],
-    audio: audio(),
+    audio: [audio()],
   },
 
   entities: {
@@ -41,8 +43,8 @@ export class Engine {
    * @param {Object} [gameConfig] - Game-specific configuration.
    * @param {Object} [renderer] - UI entity responsible for rendering. It must have a `render` method.
    */
-  constructor(gameConfig) {
-    this._config = extend(DEFAULT_GAME_CONFIG, gameConfig)
+  constructor(...gameConfigs) {
+    this._config = extendWith(merger, DEFAULT_GAME_CONFIG, ...gameConfigs)
 
     // Determine devMode from the entities config.
     const devMode = this._config.entities.game?.devMode
@@ -50,9 +52,6 @@ export class Engine {
 
     // Add user-defined systems
     const systems = [...(this._config.systems ?? [])]
-    if (this._config.renderer) {
-      systems.push(...this._config.renderer.getSystems())
-    }
 
     this._store = createStore({ ...this._config, systems })
 
@@ -86,10 +85,13 @@ export class Engine {
   }
 
   async init() {
-    return Promise.all([
-      this._config.types.audio.init(this._config.entities.audio),
-      this._config.renderer?.init(this),
-    ])
+    return Promise.all(
+      Object.values(this._config.entities).map((entity) => {
+        const originalType = this._config.types[entity.type]
+        const type = augmentType(originalType)
+        return type.init?.(entity, null, this._api)
+      }),
+    )
   }
 
   /**
@@ -108,7 +110,6 @@ export class Engine {
     this._api.notify("stop")
     this._store.update(this._api)
     this._loop.stop()
-    this._config.renderer?.destroy()
     this.isRunning = false
   }
 
@@ -145,3 +146,9 @@ export class Engine {
     }
   }
 }
+
+function merger(targetValue, sourceValue) {
+  if (isArray(targetValue) && isArray(sourceValue)) {
+    return [...targetValue, ...sourceValue]
+  }
+}

package/src/main.js

@@ -1,11 +1,11 @@
 import { Engine } from "@inglorious/engine/core/engine.js"
-import { Renderer2D } from "@inglorious/renderer-2d/index.js"
+import { createRenderer } from "@inglorious/renderer-2d/index.js"
 import game from "game"
 
 const canvas = document.getElementById("canvas")
 window.addEventListener("load", async () => {
-  const renderer = new Renderer2D(canvas)
-  const engine = new Engine({ ...game, renderer })
+  const renderer = createRenderer(canvas)
+  const engine = new Engine(renderer, game)
   await engine.init()
   engine.start()
 })