@theatrejs/theatrejs
v1.9.0
Published
🎮 A JavaScript 2D Game Engine focused on creating pixel art games.
Downloads
882
Maintainers
Readme
Theatre.js
🎮 A JavaScript 2D Game Engine focused on creating pixel art games.
Installation
npm install @theatrejs/theatrejs --save
Quick Start
⚠️ This example does not include the preloading of assets.
import {Actor, Engine, Sprite, Stage, Vector2} from '@theatrejs/theatrejs';
import textureHero from './hero-16x16.png';
class Hero extends Actor {
onCreate() {
this.setSprite(new Sprite({
$sizeTarget: new Vector2(16, 16),
$textureColor: textureHero
}));
}
}
class Level1 extends Stage {
onCreate() {
this.createActor(Hero);
}
}
const engine = new Engine({$container: document.body});
engine.initiate();
engine.createStage(Level1);
With Preloading
⚠️ Assets are preloaded asynchronously.
asynchronous module
import {Engine, FACTORIES, Sprite, Vector2} from '@theatrejs/theatrejs';
import textureHero from './hero-16x16.png';
class Hero extends FACTORIES.ActorWithPreloadables([FACTORIES.PreloadableTexture(textureHero)]) {
onCreate() {
this.setSprite(new Sprite({
$sizeTarget: new Vector2(16, 16),
$textureColor: textureHero
}));
}
}
class Level1 extends FACTORIES.StageWithPreloadables([Hero]) {
onCreate() {
this.createActor(Hero);
}
}
const engine = new Engine({$container: document.body});
engine.initiate();
await engine.preloadStage(Level1);
engine.createStage(Level1);
synchronous module
...
const engine = new Engine({$container: document.body});
engine.initiate();
engine.preloadStage(Level1).then(() => {
engine.createStage(Level1);
});