Class: PhaserEngineService

Service for loading the Phaser game engine and its in-house plugins (avatars, visual effects), for use in game-type apps.

Remarks

Accessible everywhere via k.gameEngines.phaser. You never have to instantiate this service yourself — it is created by the SDK when the app/widget starts.

Each method injects the corresponding script into the page (via k.dom.loadScript) and then registers it with Phaser. `load` must be called before creating a Phaser game; the avatar/effects modules are then loaded into an existing scene.

Example

// Load Phaser, create a game, then add avatars and effects
await k.gameEngines.phaser.load();

const game = new Phaser.Game({  ...config  });
const scene = game.scene.getScene('main');

await k.gameEngines.phaser.loadAvatarModule(scene);
await k.gameEngines.phaser.loadEffectsModule(scene);

Implements

• ServiceInterface

Methods

avatarToPng()

avatarToPng(data, options?): Promise<string>;

Renders a Kappapps avatar as a PNG image, with no game or scene needed.

Parameters

data

Partial<AvatarData>

The avatar's pieces, typically await user.getAvatarData(). Missing pieces are randomized.

options?

AvatarPngOptions = {}

Render options (size, animation, equipment, trimming…).

Returns

Promise<string>

A data:image/png;base64,… URL, usable straight as an <img> source inside the app, or convertible to a Blob with k.Utils.Media.base64ToBlob(png, 'image/png') (to upload it, for instance). Announcement visuals do not accept data URLs.

Default Value

{}

Remarks

The Phaser engine and the avatar module are loaded on demand on the first call (a few hundred KB), then an off-screen game renders one frame and is destroyed. An app hidden with App.undisplay | undisplay still renders, but a page the browser has stopped painting (background tab) cannot produce an image and the call ends on its timeout.

Example

const png = await k.gameEngines.phaser.avatarToPng(await user.getAvatarData(), { height: 256 });
document.querySelector('img').src = png;

See

User.getAvatarPng | user.getAvatarPng for the shortcut on a viewer.

---

load()

load(version?): Promise<void>;

Loads the Phaser engine itself (the phaser.min.js script) into the page.

Parameters

version?

string = '3.55.2'

Phaser version to load.

Returns

Promise<void>

A promise that resolves once the Phaser script is loaded.

Default Value

'3.55.2'

Remarks

Call this before creating a Phaser.Game and before the avatar/effects modules.

Example

await k.gameEngines.phaser.load();
const game = new Phaser.Game({  ...config  });

---

loadAvatarModule()

loadAvatarModule(
   scene, 
   src?, 
opts?): Promise<void>;

Loads the Kappapps avatar plugin and installs it into a Phaser scene, then preloads its assets (Spine skeletons, arrows, spells).

Parameters

scene

Scene

The Phaser scene into which to install the plugin and load the assets.

src?

string = null

URL of the plugin script to load. If null, the default URL served by the platform is used.

opts?

AvatarPluginConfig = {}

Overrides for the plugin's configuration URLs (Spine plugin, Rex move-to, Spine skeleton, arrows, spells). Each field provided overrides the default value.

Returns

Promise<void>

A promise that resolves once the plugin is installed and its assets are loaded.

Default Value

null

Default Value

{}

Remarks

Requires Phaser to be already loaded (see load).

Example

await k.gameEngines.phaser.loadAvatarModule(scene);

See

loadEffectsModule for visual effects.

---

loadEffectsModule()

loadEffectsModule(
   scene, 
   src?, 
opts?): Promise<void>;

Loads the Kappapps visual effects plugin and installs it into a Phaser scene, then preloads its texture atlas.

Parameters

scene

Scene

The Phaser scene into which to install the plugin and load the assets.

src?

string = null

URL of the plugin script to load. If null, the default URL served by the platform is used.

opts?

EffectsPluginConfig = {}

Overrides for the atlas configuration (base URL, JSON file, atlas key, size index). Each field provided overrides the default value.

Returns

Promise<void>

A promise that resolves once the plugin is installed and its assets are loaded.

Default Value

null

Default Value

{}

Remarks

Requires Phaser to be already loaded (see load).

Example

await k.gameEngines.phaser.loadEffectsModule(scene);

See

loadAvatarModule for avatars.