What is the ProjectOrchestrator?

The ProjectOrchestrator is the unified controller for Cocos Creator. It reads project_data.json and manages all particles, VFX spritesheets, timeline playback, state machine, and force fields from a single component attached to a UI node.

How do I control the timeline at runtime?

Use setTimelineLoop(true) to enable looping, setTimelineDuration(5.0) to set duration, seek(1.5) to jump to a specific time, and pause()/resume() for playback control. These methods are available on both Cocos Orchestrator and PixiJS runtime.

Can I control individual emitters from the Orchestrator?

Yes. The Orchestrator provides convenience wrappers: triggerBurst(id, count) for burst emission, setEmitterEmissionRate(id, rate) to change rate, setEmitterTimeScale(id, scale) for speed, and stopParticle(id)/resetParticle(id) for lifecycle control.

How do I use the PixiJS runtime API?

Create a SlotFXPixiRuntime instance with your PIXI.Application, load your exported project_data.json, then call play(), pause(), resume(), seek(), trigger(), and other methods. The runtime is a self-contained 3000+ line class that handles all particle features.

API Reference — SlotVFX Runtime API for Cocos Creator & PixiJS

ProjectOrchestrator

Cocos

Unified controller that reads project_data.json and manages all particles, VFX, timeline, and state machine playback. Attach this component to a UI node in Cocos Creator.

▶️ Playback

Method	Description
`play()`	Play all elements from current time
`pause()`	Pause all elements
`resume()`	Resume after pause
`stop()`	Stop and reset to start
`seek(time)`	Jump to a specific time (seconds)
`setSpeed(multiplier)`	Set playback speed (e.g. 2.0 for 2×)

🎛️ Element Control

Method	Description
`playParticle(id)`	Play a specific particle emitter
`pauseParticle(id)`	Pause a specific particle emitter
`playVFX(id)`	Play a VFX spritesheet
`pauseVFX(id)`	Pause a VFX spritesheet
`setVisible(id, visible)`	Show/hide any element by ID

💥 Emitter Convenience Wrappers

Shorthand methods to control individual emitter behavior from the orchestrator level.

Method	Description
`triggerBurst(id, count)`	Emit a burst of count particles on emitter id
`setEmitterEmissionRate(id, rate)`	Override emission rate
`setEmitterTimeScale(id, scale)`	Set per-emitter time scale
`stopParticle(id)`	Stop emission (existing particles fade out)
`resetParticle(id)`	Clear all particles and restart

🔍 Getters

Method	Returns
`getParticle(id)`	Particle component reference
`getVFX(id)`	VFX player component reference
`getNode(id)`	Cocos Node for any element
`getAllIds()`	Array of all element IDs
`getParticleIds()`	Array of particle IDs
`getVFXIds()`	Array of VFX IDs

📊 Properties (Read-only)

Property	Type	Description
`time`	number	Current timeline time (seconds)
`totalDuration`	number	Total timeline duration
`progress`	number	0–1 playback progress
`playing`	boolean	Whether currently playing
`projectName`	string	Project name from data
`elementCount`	number	Total managed elements

AdvancedParticleSystem

Cocos

Per-emitter component with full control over emission, physics, curves, timeline, and FX layers. Used directly when not using the Orchestrator (single-emitter mode).

⚡ Lifecycle

Method	Description
`play()`	Start emission
`stop()`	Stop emission (particles fade out)
`reset()`	Clear all particles and restart
`emitBurst(count)`	Emit a burst of particles

🎨 Runtime Overrides

Method	Description
`setEmissionRate(rate)`	Particles per second
`setTimeScale(scale)`	Speed multiplier
`setActivePath(name)`	Switch emitter path
`setSpriteFrame(frame)`	Change particle texture

🧲 Force Fields

Method	Description
`updateForceField(name, params)`	Update position, strength, radius of a named field
`setForceFieldEnabled(name, on)`	Enable/disable a force field

Timeline Control

Both Runtimes

Scrub, loop, and override the timeline at runtime. Available on both per-emitter components (Cocos) and the PixiJS runtime.

⏱️ Timeline Methods

Method	Description	Available On
`getTimelineTime()`	Current timeline time (seconds)	Cocos per-emitter, Orchestrator, Pixi
`setTimelineTime(t)`	Jump to specific time	Cocos per-emitter
`getTimelineDuration()`	Get current duration	Cocos per-emitter
`setTimelineDuration(d)`	Override timeline duration	All
`getTimelineLoop()`	Check if looping	All
`setTimelineLoop(on)`	Enable/disable looping	All
`pause()`	Pause timeline (keeps state)	Pixi
`resume()`	Resume from pause	Orchestrator, Pixi
`seek(t)`	Seek to time	Orchestrator, Pixi

💡 Example: Slow-Mo Win

// Cocos: slow-motion big win reveal
orchestrator.setSpeed(0.3);          // 30% speed
scheduleOnce(() => {
    orchestrator.setSpeed(1.0);      // back to normal
}, 2.0);

// PixiJS equivalent
runtime.setTimeScale(0.3);
setTimeout(() => runtime.setTimeScale(1.0), 2000);

FX Layer Control

Cocos

Dynamically enable/disable FX items and tweak their parameters at runtime. Works on per-emitter components and via the Orchestrator proxy.

✨ Per-Emitter FX Methods

Method	Description
`setFxEnabled(index, on)`	Enable/disable FX at stack index
`getFxEnabled(index)`	Check if FX is enabled at index
`setFxParam(index, name, value)`	Set a named param on FX at index

🎬 Orchestrator FX Proxy

Control FX on specific emitters through the orchestrator without needing direct component access.

Method	Description
`setParticleFxParam(id, idx, name, val)`	Set FX param on emitter id
`setParticleFxEnabled(id, idx, on)`	Enable/disable FX on emitter id

💡 Example: Dissolve on Win

// Animate dissolve threshold on big win
const particle = orchestrator.getParticle('main_burst');
let t = 0;
this.schedule(() => {
    t += 0.02;
    particle.setFxParam(0, 'threshold', t);
    if (t >= 1) this.unscheduleAllCallbacks();
}, 0.016);

State Machine

Both Runtimes

Trigger-based VFX state switching for game events. Define states in the editor, control them at runtime.

🎰 State Control

Method	Description
`trigger(name)`	Fire a named trigger (e.g. `'start_bonus'`)
`setState(id)`	Force-set a specific state (skips transitions)
`getCurrentState()`	Get current state ID
`getCurrentStateName()`	Get human-readable state name
`getAvailableTriggers()`	List triggers valid from current state

🔄 What Happens on State Change

All entities reset to defaults (visibility, config)
New state overrides are applied (active on/off, property values)
Timeline resets to t=0
State can override timelineLoop and timelineDuration

Force Fields

Both Runtimes

Attract, repel, orbit, and vortex particles with physics-based force fields. Supports automation, kill zones, and path following.

🧲 Cocos API

Method	Description
`updateForceField(name, { x, y, strength, radius })`	Move or resize a force field
`setForceFieldEnabled(name, on)`	Enable/disable by name

🎮 PixiJS API

Method	Description
`getForceFields()`	Returns array of all force field objects

Force fields with automation play automatically from exported data. No manual setup needed.

SlotFXPixiRuntime

PixiJS

The unified PixiJS runtime — load, play, and control SlotVFX effects in any PixiJS v7/v8 project.

⚡ Lifecycle

Method	Description
`load(data, assetsPath)`	Load project data and assets (async)
`play()`	Start playback
`stop()`	Stop playback
`pause()`	Pause (keeps state)
`resume()`	Resume from pause
`seek(time)`	Jump to specific time
`reset()`	Reset to beginning
`destroy()`	Cleanup all resources

🎛️ Global Controls

Method	Description
`setTimeScale(scale)`	Global speed multiplier
`setPosition(x, y)`	Move entire effect
`setTimelineLoop(on)`	Enable/disable looping
`getTimelineLoop()`	Check if looping
`setTimelineDuration(d)`	Override duration
`getTimelineTime()`	Current time in seconds

🎨 Emitter Control

Method	Description
`getEmitter(nameOrId)`	Get an emitter by name or ID
`triggerBurst(nameOrId, count)`	Burst particles on an emitter
`setEmitterVisible(nameOrId, on)`	Show/hide an emitter
`setEmitterEmissionRate(nameOrId, rate)`	Override emission rate

🎰 State Machine

Method	Description
`trigger(name)`	Fire a named trigger
`setState(id)`	Force-set state
`getCurrentState()`	Get current state ID
`getCurrentStateName()`	Get state name
`getAvailableTriggers()`	List valid triggers

VFXSpritesheetPlayer

Cocos

Plays Energy Beam and Lightning effect spritesheets exported from SlotVFX.

▶️ Playback

Method / Property	Description
`play()`	Start playback
`stop()`	Stop playback
`pause()`	Pause
`resume()`	Resume
`reset()`	Reset to frame 0
`loop`	Boolean — enable looping
`speed`	Playback speed multiplier
`currentFrame`	Current frame (read-only)
`totalFrames`	Total frames (read-only)
`progress`	0–1 progress (read-only)
`playing`	Is playing (read-only)

API Reference

ProjectOrchestrator

▶️ Playback

🎛️ Element Control

💥 Emitter Convenience Wrappers

🔍 Getters

📊 Properties (Read-only)

AdvancedParticleSystem

⚡ Lifecycle

🎨 Runtime Overrides

🧲 Force Fields

Timeline Control

⏱️ Timeline Methods

💡 Example: Slow-Mo Win

FX Layer Control

✨ Per-Emitter FX Methods

🎬 Orchestrator FX Proxy

💡 Example: Dissolve on Win

State Machine

🎰 State Control

🔄 What Happens on State Change

Force Fields

🧲 Cocos API

🎮 PixiJS API

SlotFXPixiRuntime

⚡ Lifecycle

🎛️ Global Controls

🎨 Emitter Control

🎰 State Machine

VFXSpritesheetPlayer

▶️ Playback

Frequently Asked Questions