ReelViewport

pixi-reels

pixi-reels / index / ReelViewport

Class: ReelViewport

Defined in: core/ReelViewport.ts:238

The clipping window + layering tricks for a reel set.

The viewport is the “looking-glass” of the slot: a rectangle the size of the visible grid with a PixiJS mask so symbols scrolling above or below the visible cells are hidden. It also provides three stacking layers so win animations can break out of the mask:

• maskedContainer. the normal place for reels. Clipped to the visible area so buffer cells never leak.
• unmaskedContainer. rendered on top of the mask. Use for a symbol whose celebration animation expands beyond its cell (a big expanding wild, a splash frame).
• spotlightContainer. above everything else. Win spotlight lifts winning symbols here temporarily so dim overlay + bounce don’t clip.
• promotedLayer. a RenderLayer above all three, where ReelSet.promote() draws a symbol without moving it. Empty unless someone calls promote().

dimOverlay is a semi-transparent rectangle the spotlight fades in behind the promoted winners to visually push the losers into the background.

Extends#

• Container

Implements#

• Disposable

Constructors#

Constructor#

new ReelViewport(
   width: number, 
   height: number, 
   position?: {
  x: number;
  y: number;
}, 
   maskStrategy?: MaskStrategy, 
   axis?: ReelAxis, 
   bleed?: number
): ReelViewport;

Defined in: core/ReelViewport.ts:267

Parameters#

Returns#

ReelViewport

Overrides#

Container.constructor

Properties#

Accessors#

axis#

Get Signature#

get axis(): ReelAxis;

Defined in: core/ReelViewport.ts:322

The set’s travel axis. Read by debug overlays and mask strategies.

Returns

ReelAxis

isDestroyed#

Get Signature#

get isDestroyed(): boolean;

Defined in: core/ReelViewport.ts:334

Returns

boolean

Implementation of#

Disposable.isDestroyed

maskGraphics#

Get Signature#

get maskGraphics(): Graphics;

Defined in: core/ReelViewport.ts:320

Internal mask Graphics. Exposed so debug helpers can recolor it.

Returns

Graphics

maskHeight#

Get Signature#

get maskHeight(): number;

Defined in: core/ReelViewport.ts:316

The viewport mask bounding box height.

Returns

number

maskRects#

Get Signature#

get maskRects(): readonly ReelMaskRect[];

Defined in: core/ReelViewport.ts:318

Per-reel mask rects last passed to the strategy. Used by debug overlays.

Returns

readonly ReelMaskRect[]

maskWidth#

Get Signature#

get maskWidth(): number;

Defined in: core/ReelViewport.ts:314

The viewport mask bounding box width (independent of children bounds).

Returns

number

Methods#

destroy()#

destroy(): void;

Defined in: core/ReelViewport.ts:364

Removes all internal references and listeners as well as removes children from the display list. Do not use a Container after calling destroy.

Returns#

void

Example#

container.destroy();
container.destroy(true);
container.destroy({ children: true });
container.destroy({ children: true, texture: true, textureSource: true });

Implementation of#

Disposable.destroy

Overrides#

Container.destroy

hideDim()#

hideDim(): void;

Defined in: core/ReelViewport.ts:346

Release one dim request; hides the overlay only when the last one clears.

Returns#

void

showDim()#

showDim(alpha?: number): void;

Defined in: core/ReelViewport.ts:339

Show the dim overlay with given opacity. Reference-counted with hideDim.

Parameters#

Returns#

void

updateMaskSize()#

updateMaskSize(
   width: number, 
   height: number, 
   rects?: ReelMaskRect[]
): void;

Defined in: core/ReelViewport.ts:352

Update mask size and per-reel rects. Used after pyramid/MultiWays shape changes.

Parameters#

Returns#

void