Package Exports
- @inglorious/engine/ai/movement/dynamic/align.js
- @inglorious/engine/ai/movement/dynamic/arrive.js
- @inglorious/engine/ai/movement/dynamic/evade.js
- @inglorious/engine/ai/movement/dynamic/face.js
- @inglorious/engine/ai/movement/dynamic/flee.js
- @inglorious/engine/ai/movement/dynamic/look-where-youre-going.js
- @inglorious/engine/ai/movement/dynamic/match-velocity.js
- @inglorious/engine/ai/movement/dynamic/pursue.js
- @inglorious/engine/ai/movement/dynamic/seek.js
- @inglorious/engine/ai/movement/dynamic/wander.js
- @inglorious/engine/ai/movement/kinematic/align.js
- @inglorious/engine/ai/movement/kinematic/arrive.js
- @inglorious/engine/ai/movement/kinematic/face.js
- @inglorious/engine/ai/movement/kinematic/flee.js
- @inglorious/engine/ai/movement/kinematic/seek.js
- @inglorious/engine/ai/movement/kinematic/seek.test.js
- @inglorious/engine/ai/movement/kinematic/wander-as-seek.js
- @inglorious/engine/ai/movement/kinematic/wander.js
- @inglorious/engine/animation/sprite.js
- @inglorious/engine/animation/ticker.js
- @inglorious/engine/behaviors/camera.js
- @inglorious/engine/behaviors/controls/dynamic/modern.js
- @inglorious/engine/behaviors/controls/dynamic/shooter.js
- @inglorious/engine/behaviors/controls/dynamic/tank.js
- @inglorious/engine/behaviors/controls/event-handlers.js
- @inglorious/engine/behaviors/controls/kinematic/modern.js
- @inglorious/engine/behaviors/controls/kinematic/shooter.js
- @inglorious/engine/behaviors/controls/kinematic/tank.js
- @inglorious/engine/behaviors/debug/collision.js
- @inglorious/engine/behaviors/fps.js
- @inglorious/engine/behaviors/fsm.js
- @inglorious/engine/behaviors/fsm.test.js
- @inglorious/engine/behaviors/game.js
- @inglorious/engine/behaviors/input/controls.js
- @inglorious/engine/behaviors/input/gamepad.js
- @inglorious/engine/behaviors/input/input.js
- @inglorious/engine/behaviors/input/keyboard.js
- @inglorious/engine/behaviors/input/mouse.js
- @inglorious/engine/behaviors/physics/bouncy.js
- @inglorious/engine/behaviors/physics/clamped.js
- @inglorious/engine/behaviors/physics/collidable.js
- @inglorious/engine/behaviors/physics/jumpable.js
- @inglorious/engine/behaviors/ui/button.js
- @inglorious/engine/collision/detection.js
- @inglorious/engine/core/core-events.js
- @inglorious/engine/core/dev-tools.js
- @inglorious/engine/core/engine.js
- @inglorious/engine/core/loop.js
- @inglorious/engine/core/loops/animation-frame.js
- @inglorious/engine/core/loops/elapsed.js
- @inglorious/engine/core/loops/fixed.js
- @inglorious/engine/core/loops/flash.js
- @inglorious/engine/core/loops/lag.js
- @inglorious/engine/core/middlewares.js
- @inglorious/engine/core/multiplayer.js
- @inglorious/engine/main.js
- @inglorious/engine/movement/dynamic/modern.js
- @inglorious/engine/movement/dynamic/tank.js
- @inglorious/engine/movement/kinematic/modern.js
- @inglorious/engine/movement/kinematic/modern.test.js
- @inglorious/engine/movement/kinematic/tank.js
- @inglorious/engine/physics/bounds.js
- @inglorious/engine/physics/position.js
- @inglorious/engine/physics/position.test.js
- @inglorious/engine/systems/sprite-animation.js
Readme
Inglorious Engine
The core orchestrator for the Inglorious Engine. This package provides a complete game loop, state management, and rendering pipeline in a single, cohesive unit. It is designed to be highly configurable and extensible, allowing you to build games with a functional, data-oriented approach.
Core Concepts
The @inglorious/engine package acts as the central hub that brings together all the engine's components. Its main responsibilities are:
Orchestrating the Game Loop: The
Engineclass manages the game loop, which is responsible for continuously updating the state and rendering the game. The loop can be configured to use different timing mechanisms, such asanimationFrameor a fixedfps.State Management: It leverages the
@inglorious/storepackage to manage the game's state. It provides methods to start, stop, and update the state manager, processing a queue of events on each frame.Integrating the Renderer: The engine is headless by design, but it can be configured with a renderer to display the game. The engine takes a renderer object in its configuration and integrates its systems and logic into the main game loop.
Dev Tools Integration: The engine automatically connects to a browser's dev tools for debugging and time-travel capabilities if
devModeis enabled in the game's state.
Installation
npm install @inglorious/engineAPI
new Engine(gameConfig)
Creates a new Engine instance.
Parameters:
gameConfig(object): The game-specific configuration. It is an object with the following properties:loop(object, optional): Configuration for the game loop.type(string, optional): The type of loop to use (animationFrameorfixed). Defaults toanimationFrame.fps(number, optional): The target frames per second. Only used with thefixedloop type. Defaults to60.
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 implementgetSystems()andinit(engine)methods.
Returns:
- A new
Engineinstance.
engine.start()
Starts the game loop, triggering the first update and render calls.
engine.stop()
Halts the game loop and cleans up any resources. This method also processes a final stop event to ensure a clean shutdown.
Basic Usage
Here is a complete example showing how to set up and run a game using the engine.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/logo.png" />
<link rel="stylesheet" href="/style.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Inglorious Engine</title>
</head>
<body>
<canvas id="canvas"></canvas>
<script type="text/javascript">
window.process = { env: "development" }
</script>
<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@0.1.0/",
"@inglorious/engine/": "https://unpkg.com/@inglorious%2Fengine@0.4.0/",
"@inglorious/renderers/": "https://unpkg.com/@inglorious%2Frenderer-2d@0.2.0/",
"game": "/game.js"
}
}
</script>
<script
type="module"
src="https://unpkg.com/@inglorious%2Fengine@0.2.0/src/main.js"
></script>
</body>
</html>Contributing
We welcome contributions from the community! Whether you're fixing a bug, adding a feature, or improving the documentation, your help is appreciated. Please read our Contributing Guidelines for details on how to get started.