pixi-rainman-game-engine 0.2.18 → 0.2.19

package/dist/Rainman/appConfig.js

@@ -41,6 +41,7 @@ export const defaultAppConfig = {
         mysteryWinMinimumTime: 2000,
         bigWinMinimumTime: 2000,
         bigWinPhaseTimeout: 2800,
+        mysteryPhaseTimeout: 2800,
         bonusWinPhaseTimeout: 2800,
         bonusWinMinimumTime: 2000,
         superBonusWinMinimumTime: 2000,

package/dist/Rainman/types.d.ts

@@ -48,6 +48,7 @@ export type OptionalAppConfig = {
         mysteryWinMinimumTime: number;
         bigWinMinimumTime: number;
         bigWinPhaseTimeout: number;
+        mysteryPhaseTimeout: number;
         bonusWinPhaseTimeout: number;
         bonusWinMinimumTime: number;
         superBonusWinPhaseTimeout: number;

package/dist/SettingsUI/components/CloseModalButton/index.d.ts

@@ -4,4 +4,6 @@ export type CloseModalButtonProps = {
     layerId: string;
     afterClose?: () => void;
 };
-export declare const CloseModalButton: ({ layerId, afterClose }: CloseModalButtonProps) => JSX.Element;
+export declare const CloseModalButton: (({ layerId, afterClose }: CloseModalButtonProps) => JSX.Element) & {
+    displayName: string;
+};

package/dist/SettingsUI/components/CloseModalButton/index.jsx

@@ -1,17 +1,23 @@
 import "./closeModalButton.css";
+import { observer } from "mobx-react-lite";
 import React from "react";
 import { UI_ITEMS } from "../../../utils";
 import { useStores } from "../../hooks";
-export const CloseModalButton = ({ layerId, afterClose }) => {
+export const CloseModalButton = observer(({ layerId, afterClose }) => {
     const { settingStore } = useStores();
+    const { isFreeSpinsPlayEnabled, isFreeSpinsBought, betChangeDisabled } = settingStore;
+    const isBetDisabled = isFreeSpinsPlayEnabled || betChangeDisabled || isFreeSpinsBought;
     const onClose = () => {
         settingStore.handleModalInvocation?.(layerId);
         if (layerId === UI_ITEMS.speedSettings) {
             settingStore.setSpeedPopupVisibility?.("none");
         }
+        if (isBetDisabled) {
+            settingStore.enableButtons?.();
+        }
         afterClose?.();
     };
     return (<button className="close-modal-button" onClick={onClose}>
             x
         </button>);
-};
+});

package/dist/application/ButtonsEventManager/ButtonsEventManager.js

@@ -44,7 +44,12 @@ export class ButtonsEventManager {
      * @returns {() => void} function for enabling/disabling buttons
      */
     setButtonAvailability = (makeDisabled) => () => {
-        const buttonsToDisable = [SpeedControlButton.registryName, BUTTONS.neg, BUTTONS.plus];
+        const isDisabled = RainMan.settingsStore.isFreeSpinsPlayEnabled ||
+            RainMan.settingsStore.isFreeSpinsBought ||
+            RainMan.settingsStore.betChangeDisabled;
+        const buttonsToDisable = isDisabled
+            ? [SpeedControlButton.registryName]
+            : [SpeedControlButton.registryName, BUTTONS.neg, BUTTONS.plus];
         buttonsToDisable.forEach((buttonRegistryName) => RainMan.componentRegistry.get(buttonRegistryName).flipDisabledFlag(makeDisabled));
         RainMan.componentRegistry.get(VolumeButton.registryName).changeTextureDependOnVolume();
     };
@@ -53,6 +58,7 @@ export class ButtonsEventManager {
     constructor() {
         RainMan.settingsStore.handleModalInvocation = this.handleModalInvocation.bind(this);
         RainMan.settingsStore.setSpeedPopupVisibility = this.setSpeedPopupVisibility.bind(this);
+        RainMan.settingsStore.enableButtons = this.enableButtons.bind(this);
     }
     /**
      * Method for initializing events in Settings UI

package/dist/components/AbstractMainContainer/AbstractMainContainer.d.ts

@@ -3,7 +3,7 @@ import { ButtonsEventManager } from "../../application";
 import { AbstractController } from "../../controllers";
 import { RainMan } from "../../Rainman";
 import { Nullable } from "../../utils";
-import { UpdatableSpineContainer } from "../../winComponents";
+import { MysteryWinContainer, UpdatableSpineContainer } from "../../winComponents";
 import { AbstractFreeSpinContainer } from "../AbstractFreeSpinContainer";
 import { LeftButtons, LeftButtonsLandscape, LeftButtonsMobile, MiddleButtons, RightButtons, RightButtonsLandscape, RightButtonsMobile } from "../buttons";
 import { FreeSpinButton, Logo, ResponsiveContainer } from "../common";
@@ -33,7 +33,7 @@ export declare abstract class AbstractMainContainer extends Container {
     static readonly registryName = "mainContainer";
     messageBox: MessageBox;
     protected bigWinContainer: Nullable<UpdatableSpineContainer>;
-    protected mysteryWinContainer: Nullable<UpdatableSpineContainer>;
+    protected mysteryWinContainer: Nullable<UpdatableSpineContainer> | MysteryWinContainer;
     protected bonusWinContainer: Nullable<UpdatableSpineContainer>;
     protected superBonusWinContainer: Nullable<UpdatableSpineContainer>;
     protected overlay: Nullable<Graphics>;
@@ -88,7 +88,7 @@ export declare abstract class AbstractMainContainer extends Container {
      * Function for creating mystery win container
      * @returns {Nullable<UpdatableSpineContainer>} The container for the mystery win animation, or null.
      */
-    protected createMysteryWinContainer(): Nullable<UpdatableSpineContainer>;
+    protected createMysteryWinContainer(): Nullable<UpdatableSpineContainer> | MysteryWinContainer;
     /**
      * Function for specifying the container for the free spin summary
      * This needs to be implemented in each game

package/dist/components/updatable/UpdatableValueComponent.d.ts

@@ -14,7 +14,7 @@ import { UpdatableMode } from "./types";
 export declare abstract class UpdatableValueComponent extends Container implements SpeedAdapterInterface<number> {
     private mode;
     private updateCallback?;
-    private updatableValue;
+    protected updatableValue: number;
     protected finalValue: number;
     protected readonly baseTextComponent: Text;
     protected readonly valueTextComponent: Text;

package/dist/controllers/AbstractController.js

@@ -922,8 +922,8 @@ export class AbstractController {
                 this.mainContainer.destroyMysteryWin();
                 this.resolveMysteryWin();
                 this.resolveMysteryWin = undefined;
-            }, RainMan.config.durationOfActions.bigWinPhaseTimeout /
-                (RainMan.settingsStore.currentSpeed === SPEED_LEVELS.fast ? 3 : 1));
+            }, RainMan.config.durationOfActions.mysteryPhaseTimeout /
+                (RainMan.settingsStore.currentSpeed === SPEED_LEVELS.fast ? 2 : 1));
         });
     }
     /**

package/dist/stores/SettingsStore.d.ts

@@ -47,6 +47,7 @@ export declare class SettingsStore {
     handleModalInvocation?: (layerId: string) => void;
     increaseBet?: () => void;
     decreaseBet?: () => void;
+    enableButtons?: () => void;
     private readonly initialAutoplaySettingsState;
     private modalsAvailable;
     private paytableMap;

package/dist/stores/SettingsStore.js

@@ -53,6 +53,7 @@ export class SettingsStore {
     handleModalInvocation;
     increaseBet;
     decreaseBet;
+    enableButtons;
     initialAutoplaySettingsState = {
         infinitySpinsEnabled: false,
         onAnyWin: false,

package/dist/winComponents/MysteryWinContainer.d.ts

@@ -0,0 +1,32 @@
+import { Container, ITextStyle } from "pixi.js";
+import { Spine } from "pixi-spine";
+import { COMPONENTS } from "../components";
+import { AnimableParticlesEmitter } from "./AnimableParticlesEmitter";
+import { PositioningFrame } from "./PositioningFrame";
+/**
+ * Class for Mystery win. Every animation must be named "mystery_big" in spine.
+ * @class MysteryWinContainer
+ * @augments {Container}
+ */
+export declare class MysteryWinContainer extends Container {
+    plateSpineSrc: string;
+    animationSpineSrc: string;
+    plateSpineBgSrc: string;
+    protected frame: PositioningFrame;
+    spineScale: number;
+    private emitters;
+    static readonly name = "mysteryWinContainer";
+    plateSpine: Spine;
+    animationSpine: Spine;
+    plateSpineBg: Spine;
+    textComponent: Container;
+    constructor(componentType: typeof COMPONENTS.mysteryWin | typeof COMPONENTS.bigWin, plateSpineSrc: string, animationSpineSrc: string, plateSpineBgSrc: string, frame: PositioningFrame, text: string, spineScale?: number, emitters?: AnimableParticlesEmitter[], textTexture?: string, textStyle?: ITextStyle, isBgAnimated?: boolean);
+    setScale(scale: number): void;
+    fadeInTextComponent(duration?: number, delay?: number): void;
+    positionTextElement(x?: number, y?: number, scale?: number): void;
+    positionAnimationElement(x?: number, y?: number, scale?: number): void;
+    adjustToScreen(): void;
+    resize(): void;
+    destroyAnimations(): Promise<void>;
+    private animateBox;
+}

package/dist/winComponents/MysteryWinContainer.js

@@ -0,0 +1,134 @@
+import * as TWEEN from "@tweenjs/tween.js";
+import { Container, TextStyle, Ticker } from "pixi.js";
+import { Spine } from "pixi-spine";
+import { COMPONENTS } from "../components";
+import { UXLayer } from "../layers";
+import { RainMan } from "../Rainman";
+import { getSpineData, globalMinRatio } from "../utils";
+import { TexturedText } from "./TexturedText";
+/**
+ * Class for Mystery win. Every animation must be named "mystery_big" in spine.
+ * @class MysteryWinContainer
+ * @augments {Container}
+ */
+export class MysteryWinContainer extends Container {
+    plateSpineSrc;
+    animationSpineSrc;
+    plateSpineBgSrc;
+    frame;
+    spineScale;
+    emitters;
+    static name = "mysteryWinContainer";
+    plateSpine;
+    animationSpine;
+    plateSpineBg;
+    textComponent;
+    constructor(componentType, plateSpineSrc, animationSpineSrc, plateSpineBgSrc, frame, text, spineScale = 0.9, emitters = [], textTexture, textStyle, isBgAnimated) {
+        super();
+        this.plateSpineSrc = plateSpineSrc;
+        this.animationSpineSrc = animationSpineSrc;
+        this.plateSpineBgSrc = plateSpineBgSrc;
+        this.frame = frame;
+        this.spineScale = spineScale;
+        this.emitters = emitters;
+        this.textComponent = new TexturedText(COMPONENTS.mysteryWin, text, new TextStyle({
+            fontFamily: RainMan.config.fontFace,
+            fill: "#ffffff",
+            align: "center",
+            fontWeight: "bold",
+            ...textStyle,
+        }), textTexture);
+        this.plateSpine = new Spine(getSpineData(plateSpineSrc));
+        this.animationSpine = new Spine(getSpineData(animationSpineSrc));
+        this.plateSpineBg = new Spine(getSpineData(plateSpineBgSrc));
+        this.sortableChildren = true;
+        this.plateSpineBg.zIndex = 1;
+        this.animationSpine.zIndex = 2;
+        this.textComponent.zIndex = 2;
+        this.plateSpine.zIndex = 3;
+        this.parentLayer = UXLayer;
+        this.plateSpine.state.setAnimation(0, "mystery_big", false);
+        this.animationSpine.state.setAnimation(0, "mystery_big", true);
+        if (isBgAnimated) {
+            this.plateSpineBg.state.setAnimation(0, "mystery_big", false);
+        }
+        this.addChild(this.frame);
+        this.addChild(this.plateSpineBg);
+        this.emitters.forEach((emitter) => {
+            this.addChild(emitter);
+            emitter.zIndex = 0;
+        });
+        this.addChild(this.animationSpine);
+        this.addChild(this.textComponent);
+        this.addChild(this.plateSpine);
+        this.resize();
+        Ticker.shared.add(this.animateBox, this);
+    }
+    setScale(scale) {
+        this.plateSpine.scale.set(scale);
+        this.animationSpine.scale.set(scale);
+        this.plateSpineBg.scale.set(scale);
+        this.textComponent.scale.set(scale);
+    }
+    fadeInTextComponent(duration = 1000, delay = 0) {
+        this.textComponent.alpha = 0;
+        new TWEEN.Tween({ alpha: 0 })
+            .to({ alpha: 1 }, duration)
+            .delay(delay)
+            .onUpdate((obj) => {
+            this.textComponent.alpha = obj.alpha;
+        })
+            .start();
+    }
+    positionTextElement(x, y, scale) {
+        if (x) {
+            this.textComponent.x = this.textComponent.x - x;
+            this.plateSpineBg.x = this.plateSpineBg.x - x;
+            this.plateSpine.x = this.plateSpine.x - x;
+        }
+        if (y) {
+            this.textComponent.y = this.textComponent.y - y;
+            this.plateSpineBg.y = this.plateSpineBg.y - y;
+            this.plateSpine.y = this.plateSpine.y - y;
+        }
+        if (scale) {
+            this.textComponent.scale.set(scale);
+            this.plateSpineBg.scale.set(scale);
+            this.plateSpine.scale.set(scale);
+        }
+    }
+    positionAnimationElement(x, y, scale) {
+        if (x) {
+            this.animationSpine.x = x;
+        }
+        if (y) {
+            this.animationSpine.y = y;
+        }
+        if (scale) {
+            this.animationSpine.scale.set(scale);
+        }
+    }
+    adjustToScreen() { }
+    resize() {
+        this.setScale(this.spineScale * globalMinRatio());
+        const { width, height } = RainMan.app.screen;
+        this.x = width / 2;
+        this.y = height / 2;
+        this.plateSpine.y = this.animationSpine.skeleton.data.height / 2;
+        this.plateSpineBg.x = this.plateSpine.x;
+        this.plateSpineBg.y = this.plateSpine.y;
+        this.textComponent.x = this.plateSpineBg.x;
+        this.textComponent.y = this.plateSpineBg.y;
+        this.frame.resize(width, height);
+        this.adjustToScreen();
+    }
+    async destroyAnimations() {
+        this.emitters.forEach((emitter) => emitter.cleanAnimation());
+        Ticker.shared.remove(this.animateBox, this);
+        RainMan.componentRegistry.removeMany([this, this.textComponent]);
+    }
+    animateBox() {
+        this.emitters.forEach((emitter) => emitter.animate());
+        TWEEN.update();
+    }
+}

package/dist/winComponents/TexturedText.d.ts

@@ -0,0 +1,8 @@
+import { ITextStyle, Sprite } from "pixi.js";
+import { UpdatableValueComponent } from "../components";
+export declare class TexturedText extends UpdatableValueComponent {
+    static registryName: string;
+    textureSprite?: Sprite;
+    constructor(registryName: string, text: string, textStyle: ITextStyle, textureName?: string);
+    randomizeSet(value: number, _possibleValues: number[]): void;
+}

package/dist/winComponents/TexturedText.js

@@ -0,0 +1,26 @@
+import { TilingSprite } from "pixi.js";
+import { UpdatableValueComponent } from "../components";
+import { MoneyText } from "../Money";
+import { RainMan } from "../Rainman";
+import { getTexture } from "../utils";
+export class TexturedText extends UpdatableValueComponent {
+    static registryName = "mysteryWinText";
+    textureSprite;
+    constructor(registryName, text, textStyle, textureName) {
+        super(registryName, text, textStyle, textStyle, "money");
+        this.valueTextComponent.style = { ...this.valueTextComponent.style, fontSize: 120, padding: 50 };
+        this.valueTextComponent.anchor.set(0.5, 0.5);
+        if (textureName) {
+            this.textureSprite = new TilingSprite(getTexture(textureName), this.valueTextComponent.width, this.valueTextComponent.height);
+            this.textureSprite.scale.set(1.1);
+            this.textureSprite.mask = this.valueTextComponent;
+            this.textureSprite.anchor.set(0.5);
+            this.addChildAt(this.textureSprite, 0);
+        }
+        RainMan.componentRegistry.add(this);
+    }
+    randomizeSet(value, _possibleValues) {
+        this.valueTextComponent.style.fontSize = -10 * new MoneyText(value).toString().length + 190;
+        super.update(value, 0);
+    }
+}

package/dist/winComponents/index.d.ts

@@ -1,4 +1,5 @@
 export * from "./AnimableParticlesEmitter";
+export * from "./MysteryWinContainer";
 export * from "./PositioningFrame";
 export * from "./UpdatableSpineContainer";
 export * from "./winFactory";

package/dist/winComponents/index.js

@@ -1,4 +1,5 @@
 export * from "./AnimableParticlesEmitter";
+export * from "./MysteryWinContainer";
 export * from "./PositioningFrame";
 export * from "./UpdatableSpineContainer";
 export * from "./winFactory";

package/dist/winComponents/winFactory.d.ts

@@ -1,5 +1,7 @@
 import { ITextStyle } from "pixi.js";
+import { COMPONENTS } from "../components";
 import { AnimableParticlesEmitter } from "./AnimableParticlesEmitter";
+import { MysteryWinContainer } from "./MysteryWinContainer";
 import { UpdatableSpineContainer } from "./UpdatableSpineContainer";
 /**
  * Factory function for creating BigWin and Mystery win containers
@@ -13,3 +15,30 @@ import { UpdatableSpineContainer } from "./UpdatableSpineContainer";
  * @returns {UpdatableSpineContainer} - container with scalable spine, text and emitters
  */
 export declare const winFactory: (textRegistryName: string, defaultText: string, spineName: string, animationName: string, emitters?: AnimableParticlesEmitter[], textStyleOverrides?: Partial<ITextStyle>, spineScale?: number) => UpdatableSpineContainer;
+type WinFactoryType = typeof COMPONENTS.mysteryWin | typeof COMPONENTS.bigWin;
+type WinFactoryProps = {
+    type: WinFactoryType;
+    plateSpine: string;
+    animationSpine: string;
+    plateSpineBg: string;
+    text: string;
+    textStyle?: ITextStyle;
+    textTexture?: string;
+    spineScale?: number;
+    isBgAnimated?: boolean;
+    emitters?: AnimableParticlesEmitter[];
+};
+/**
+ * New factory function for creating BigWin and Mystery win containers. It differs from winFactory
+ * in that it creates MysteryWinContainer instead of UpdatableSpineContainer
+ * @param {typeof COMPONENTS.mysteryWin | typeof COMPONENTS.bigWin} type - type of win
+ * @param {string} plateSpine - name of plate spine
+ * @param {string} animationSpine - name of animation spine
+ * @param {string} plateSpineBg - name of plate spine bg
+ * @param {string} text - text
+ * @param {string | undefined} textTexture - texture for text
+ * @param {number | undefined} spineScale - scale of spine, default is 0.9
+ * @returns {MysteryWinContainer}
+ */
+export declare const winFactoryV2: ({ type, plateSpine, plateSpineBg, animationSpine, text, textTexture, spineScale, emitters, textStyle, isBgAnimated, }: WinFactoryProps) => MysteryWinContainer;
+export {};

package/dist/winComponents/winFactory.js

@@ -1,5 +1,6 @@
-import { ScalableSpine, StylefulUpdatableText, UPDATABLE_MODES } from "../components";
+import { COMPONENTS, ScalableSpine, StylefulUpdatableText, UPDATABLE_MODES } from "../components";
 import { RainMan } from "../Rainman";
+import { MysteryWinContainer } from "./MysteryWinContainer";
 import { PositioningFrame } from "./PositioningFrame";
 import { UpdatableSpineContainer } from "./UpdatableSpineContainer";
 /**
@@ -33,3 +34,25 @@ export const winFactory = (textRegistryName, defaultText, spineName, animationNa
     const bigWinShadow = new PositioningFrame(width, height, 0x000000);
     return new UpdatableSpineContainer(bigWinText, bigWinSpine, bigWinShadow, emitters, spineScale);
 };
+/**
+ * New factory function for creating BigWin and Mystery win containers. It differs from winFactory
+ * in that it creates MysteryWinContainer instead of UpdatableSpineContainer
+ * @param {typeof COMPONENTS.mysteryWin | typeof COMPONENTS.bigWin} type - type of win
+ * @param {string} plateSpine - name of plate spine
+ * @param {string} animationSpine - name of animation spine
+ * @param {string} plateSpineBg - name of plate spine bg
+ * @param {string} text - text
+ * @param {string | undefined} textTexture - texture for text
+ * @param {number | undefined} spineScale - scale of spine, default is 0.9
+ * @returns {MysteryWinContainer}
+ */
+export const winFactoryV2 = ({ type, plateSpine, plateSpineBg, animationSpine, text, textTexture, spineScale, emitters, textStyle, isBgAnimated = false, }) => {
+    const { width, height } = RainMan.app.screen;
+    const bigWinShadow = new PositioningFrame(width, height, 0x000000);
+    if (type === COMPONENTS.bigWin) {
+        return new MysteryWinContainer(COMPONENTS.bigWin, plateSpine, animationSpine, plateSpineBg, bigWinShadow, text, spineScale, emitters, textTexture, textStyle, isBgAnimated);
+    }
+    else {
+        return new MysteryWinContainer(COMPONENTS.mysteryWin, plateSpine, animationSpine, plateSpineBg, bigWinShadow, text, spineScale, emitters, textTexture, textStyle, isBgAnimated);
+    }
+};

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "pixi-rainman-game-engine",
-    "version": "0.2.18",
+    "version": "0.2.19",
     "description": "This repository contains all of the mechanics that used in rainman games.",
     "main": "./dist/index.js",
     "module": "./dist/index.js",