pixi-rainman-game-engine 0.1.20 → 0.1.22

package/dist/SettingsUI/SystemSettings/SystemSettingsComponent.jsx

@@ -2,15 +2,17 @@ import i18next from "i18next";
 import React from "react";
 import { UI_ITEMS } from "../../utils";
 import { BetSettings, CloseModalButton, UXSettings } from "../components";
+import { useDeviceOrientations } from "../hooks";
 export const SystemSettingsComponent = () => {
-    return (<div className="flex w-full max-w-lg flex-col justify-center gap-2 p-4">
+    const deviceOrientation = useDeviceOrientations();
+    return (<div className="flex w-full max-w-lg flex-col justify-center gap-2 p-4 sm:max-w-xl">
             <div className="flex w-full justify-center">
                 <h2 className="text-2xl font-bold uppercase text-primary-500">{i18next.t("systemSettings")}</h2>
             </div>
             <CloseModalButton layerId={UI_ITEMS.settings}/>
             <div className="flex w-full flex-col justify-center">
                 <UXSettings />
-                <BetSettings className="hidden w-full justify-center sm:flex"/>
+                {!deviceOrientation.includes("mobile") ? <BetSettings className="flex w-full justify-center"/> : null}
             </div>
         </div>);
 };

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

@@ -51,7 +51,7 @@ export const AutoplaySettings = observer(() => {
         updateLimitsBounds(initialAutoSpinCount);
     }, []);
     const { singleWinExceeds, balancedIncreased, balancedDecreased, howManyAutoSpinsLeft, infinitySpinsEnabled, setSingleWinExceeds, setBalancedIncreased, setBalancedDecreased, setAutoSpinsCount, flipInfinitySpinsFlag, resetAutoplaySettings, } = settingStore;
-    return (<div className="flex w-full max-w-xs flex-col items-center justify-between gap-8 p-4 sm:max-w-md">
+    return (<div className="flex w-full max-w-xs flex-col items-center justify-between gap-8 p-4 sm:max-w-xl">
             <CloseModalButton layerId={UI_ITEMS.autoplay}/>
             <h2 className="text-center text-3xl font-bold text-primary-500">{i18next.t("autoPlay")}</h2>
             <div className="flex h-12 w-full flex-wrap items-center justify-center gap-2 sm:max-w-72 sm:flex-nowrap">

package/dist/SettingsUI/components/Bet/BetControls.jsx

@@ -5,7 +5,7 @@ import { useStores } from "../../hooks";
 import { Button } from "../Button";
 export const BetControls = observer(() => {
     const { settingStore } = useStores();
-    return (<div className="my-7 flex w-full flex-col items-center justify-center gap-2">
+    return (<div className="flex w-full flex-col items-center justify-center gap-2 p-4">
             <h2 className="font-bold uppercase text-primary-500 sm:text-2xl">{i18next.t("totalBet")}</h2>
             <div className="flex w-full items-center justify-center gap-4">
                 <Button className="flex h-10 w-8 items-center justify-center rounded-lg bg-primary-400 p-4 font-bold text-black shadow-md transition duration-300 hover:bg-primary-300" name="bet-minus">

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

@@ -22,15 +22,17 @@ export const GameRules = observer(() => {
         }
         setPageNumber(pageNumber + incrementor);
     };
-    return (<div className="flex h-full max-h-[90vh] w-[90%] flex-col items-center gap-4 p-5">
-            <h2 className="text-pr text-center text-3xl font-bold text-primary-500">{i18next.t("gameRules")}</h2>
+    return (<div className="max-w-5/6 flex h-fit flex-col items-center gap-4 p-5">
+            <h2 className="text-center text-3xl font-bold text-primary-500">{i18next.t("gameRules")}</h2>
             <CloseModalButton layerId={UI_ITEMS.gameRules}/>
-            <div className="custom-scroll mb-5 h-full min-h-[60vh]">
-                <CustomScroll className="h-[70%]" allowOuterScroll={true}>
-                    <div className="text-md h-full w-[90%] text-justify">{gameRulesContent.pages[pageNumber]}</div>
+            <div className="custom-scroll max-w-5/6 h-full min-h-[60vh]">
+                <CustomScroll className="h-full w-full overflow-y-auto portrait:max-h-[60vh]" allowOuterScroll={true}>
+                    <div className="text-md max-w-5/6 w-full overflow-y-auto landscape:max-h-[50vh]">
+                        {gameRulesContent.pages[pageNumber]}
+                    </div>
                 </CustomScroll>
             </div>
-            <div className="relative bottom-5 left-5 flex h-[50px] items-center justify-center gap-2">
+            <div className="flex h-[50px] items-center justify-center gap-2">
                 <div className="flex h-[24px] w-6 items-center bg-[url('/assets/settings/gameRules/left.png')] bg-contain bg-right bg-no-repeat hover:opacity-50" onClick={() => changePage(-1)}/>
                 <div className="flex h-[24px] w-6 items-center bg-[url('/assets/settings/gameRules/cross.png')] bg-contain bg-no-repeat hover:opacity-50" onClick={() => settingStore.handleModalInvocation?.(UI_ITEMS.gameRules)}/>
                 <div className="flex h-[24px] w-6 items-center bg-[url('/assets/settings/gameRules/right.png')] bg-contain bg-no-repeat hover:opacity-50" onClick={() => changePage(1)}/>

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

@@ -15,7 +15,7 @@ export const Modal = observer(({ layerId, children, className }) => {
             <div onClick={() => setOpen(!open)} className="fixed inset-0 bg-zinc-800 bg-opacity-75 transition-opacity"/>
             <div className="fixed inset-0 z-10 w-screen overflow-y-auto p-6">
                 <div className="flex min-h-full w-full items-center justify-center rounded-lg shadow">
-                    <div ref={ref} className={cn("min-w-3/4 relative flex h-5/6 w-full transform flex-col items-center overflow-hidden rounded-lg bg-zinc-900 p-2 text-left shadow-xl transition-all", className)}>
+                    <div ref={ref} className={cn("relative flex h-5/6 transform flex-col items-center overflow-hidden rounded-lg bg-zinc-900 p-2 text-left shadow-xl transition-all", className)}>
                         {children}
                     </div>
                 </div>

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

@@ -15,10 +15,10 @@ export const SpeedSettingsPopup = observer(() => {
         fast: SPEED_LEVELS.fast,
     };
     const { settingStore } = useStores();
-    return (<div className="flex h-full w-[90%] flex-col items-center justify-between gap-2 p-4">
+    return (<div className="flex h-fit w-fit flex-col items-center justify-between gap-2 p-4 portrait:max-w-72">
             <CloseModalButton layerId={UI_ITEMS.speedSettings}/>
             <h1 className="mt-3 font-bold uppercase text-white sm:text-xl">{i18next.t("howDoYouWantToPlay")}</h1>
-            <div className="flex h-fit w-full flex-wrap justify-between gap-2">
+            <div className="flex h-fit w-full flex-wrap justify-between gap-2 portrait:items-center portrait:justify-center">
                 {Object.keys(speedLevelMapper).map((speedLevelKey) => (<div id={`${SPEED_PREFIX}${speedLevelKey}`} key={`${SPEED_PREFIX}${speedLevelKey}`} className={cn("flex h-fit w-[145px] items-center justify-center border-2 border-zinc-400 bg-zinc-800 bg-contain bg-no-repeat p-4", speedLevelKey === settingStore.currentSpeed ? "h-fit border-2 border-primary-500" : "")}>
                         <img className="h-12 w-fit" src={`../../../assets/settings/speedPopup/speed-${speedLevelMapper[speedLevelKey]}.png`}/>
                     </div>))}

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

@@ -26,7 +26,7 @@ export const SymbolMultiplierPopup = observer(() => {
                 left: popupPaytablePosition.x,
                 top: popupPaytablePosition.y,
             }}>
-                <div className="flex h-full w-fit flex-col items-center justify-center sm:w-full">
+                <div className="flex h-fit w-fit flex-col items-center justify-center sm:w-full">
                     {popupPaytableData.map((popupPaytableRow) => (<div key={popupPaytableRow.prefix} className="flex gap-1 text-xs sm:text-2xl">
                             <div className="text-xs font-bold text-primary-500 sm:text-2xl">
                                 {popupPaytableRow.prefix}x

package/dist/SettingsUI/index.jsx

@@ -18,7 +18,7 @@ export const SettingsUI = () => {
             <Modal layerId={UI_ITEMS.autoplay}>
                 <AutoplaySettings />
             </Modal>
-            <Modal layerId={UI_ITEMS.speedSettings} className="absolute left-[25wv] top-[40vh] flex h-fit w-fit items-center justify-center rounded-xl bg-zinc-900 p-4 shadow-primary-500/30 landscape:top-[20vh]">
+            <Modal layerId={UI_ITEMS.speedSettings} className="absolute flex h-fit items-center justify-center rounded-xl bg-zinc-900 p-4 shadow-primary-500/30 sm:left-auto sm:top-auto portrait:left-auto portrait:top-auto portrait:items-center">
                 <SpeedSettingsPopup />
             </Modal>
             <div id={UI_ITEMS.symbolPayTable}>

package/dist/SettingsUI/packedStyles.css

@@ -628,10 +628,6 @@ video {
   bottom: 0.5rem;
 }
 
-.bottom-5 {
-  bottom: 1.25rem;
-}
-
 .bottom-\[5vh\] {
   bottom: 5vh;
 }
@@ -648,10 +644,6 @@ video {
   left: 1rem;
 }
 
-.left-5 {
-  left: 1.25rem;
-}
-
 .left-9 {
   left: 2.25rem;
 }
@@ -660,10 +652,6 @@ video {
   left: 1vw;
 }
 
-.left-\[25wv\] {
-  left: 25wv;
-}
-
 .right-0 {
   right: 0px;
 }
@@ -680,23 +668,10 @@ video {
   top: 0.5rem;
 }
 
-.top-\[40vh\] {
-  top: 40vh;
-}
-
 .z-10 {
   z-index: 10;
 }
 
-.my-7 {
-  margin-top: 1.75rem;
-  margin-bottom: 1.75rem;
-}
-
-.mb-5 {
-  margin-bottom: 1.25rem;
-}
-
 .ml-4 {
   margin-left: 1rem;
 }
@@ -725,10 +700,6 @@ video {
   display: table;
 }
 
-.hidden {
-  display: none;
-}
-
 .h-10 {
   height: 2.5rem;
 }
@@ -765,10 +736,6 @@ video {
   height: 50px;
 }
 
-.h-\[70\%\] {
-  height: 70%;
-}
-
 .h-\[90\%\] {
   height: 90%;
 }
@@ -782,10 +749,6 @@ video {
   height: 100%;
 }
 
-.max-h-\[90vh\] {
-  max-height: 90vh;
-}
-
 .min-h-\[60vh\] {
   min-height: 60vh;
 }
@@ -1141,10 +1104,6 @@ video {
   text-align: center;
 }
 
-.text-justify {
-  text-align: justify;
-}
-
 .text-2xl {
   font-size: 1.5rem;
   line-height: 2rem;
@@ -1557,6 +1516,10 @@ html.is-locked .ios-scroller-animation {
 }
 
 @media (min-width: 640px) {
+  .sm\:left-auto {
+    left: auto;
+  }
+
   .sm\:right-8 {
     right: 2rem;
   }
@@ -1565,6 +1528,10 @@ html.is-locked .ios-scroller-animation {
     top: 1rem;
   }
 
+  .sm\:top-auto {
+    top: auto;
+  }
+
   .sm\:ml-5 {
     margin-left: 1.25rem;
   }
@@ -1573,10 +1540,6 @@ html.is-locked .ios-scroller-animation {
     margin-top: 1.25rem;
   }
 
-  .sm\:flex {
-    display: flex;
-  }
-
   .sm\:w-full {
     width: 100%;
   }
@@ -1585,8 +1548,8 @@ html.is-locked .ios-scroller-animation {
     max-width: 18rem;
   }
 
-  .sm\:max-w-md {
-    max-width: 28rem;
+  .sm\:max-w-xl {
+    max-width: 36rem;
   }
 
   .sm\:flex-row {
@@ -1617,8 +1580,34 @@ html.is-locked .ios-scroller-animation {
   }
 }
 
+@media (orientation: portrait) {
+  .portrait\:left-auto {
+    left: auto;
+  }
+
+  .portrait\:top-auto {
+    top: auto;
+  }
+
+  .portrait\:max-h-\[60vh\] {
+    max-height: 60vh;
+  }
+
+  .portrait\:max-w-72 {
+    max-width: 18rem;
+  }
+
+  .portrait\:items-center {
+    align-items: center;
+  }
+
+  .portrait\:justify-center {
+    justify-content: center;
+  }
+}
+
 @media (orientation: landscape) {
-  .landscape\:top-\[20vh\] {
-    top: 20vh;
+  .landscape\:max-h-\[50vh\] {
+    max-height: 50vh;
   }
 }

package/dist/components/AbstractMainContainer/AbstractMainContainer.js

@@ -39,9 +39,6 @@ export class AbstractMainContainer extends Container {
     }
     triggerStoreInitState(...containersWithSpines) {
         RainMan.settingsStore.containersWithSpines.push(...containersWithSpines);
-        RainMan.settingsStore.containersWithSpines.forEach((spine) => {
-            spine.setAnimationTimescale(RainMan.settingsStore.batterySaverFlag);
-        });
         RainMan.settingsStore.refreshBatterySaver();
     }
     get freeSpinPlate() {
@@ -189,7 +186,7 @@ export class AbstractMainContainer extends Container {
     }
     createUnderFramePanel() {
         const underFramePanel = new Graphics();
-        underFramePanel.beginFill(0x0, 0.5);
+        underFramePanel.beginFill(0x0, 0.75);
         underFramePanel.drawRect(0, 0, 800, 100);
         return underFramePanel;
     }

package/dist/components/symbols/AbstractSymbolsColumn.js

@@ -306,15 +306,15 @@ export class AbstractSymbolsColumn extends Container {
         this.swapSymbolFace(symbol);
     }
     shouldPlaySpecialRollStopSound() {
-        for (let i = 0; i <= RainMan.config.numberOfColumns; i++) {
-            const currentColumn = this.columnsContainer.getColumnAtPosition(i);
-            if (currentColumn !== this)
-                continue;
-            return !!currentColumn.symbols
-                .slice(0, RainMan.config.numberOfRows)
-                .find((symbol) => symbol.id === this.bonusSymbol);
-        }
-        return false;
+        return (Array.from({ length: RainMan.config.numberOfColumns }, (_, i) => i)
+            .map((i) => {
+            const column = this.columnsContainer.getColumnAtPosition(i);
+            if (column !== this)
+                return null;
+            return column.symbols.slice(0, RainMan.config.numberOfRows);
+        })
+            .flat()
+            .filter((symbol) => symbol && symbol.id === this.bonusSymbol).length >= 1);
     }
     handleStopping() {
         if (!this.topMostSymbol || this.phase === Phase.END)

package/dist/connectivity/ConnectionWrapper.js

@@ -1,3 +1,4 @@
+import i18next from "i18next";
 import { Currencies } from "ts-money";
 import { ApiConfig } from "../application";
 import { SpinData, } from "../connectivity";
@@ -69,6 +70,7 @@ export class ConnectionWrapper {
                 landscape: true,
                 matched_ratio: "16:9",
             },
+            locale: i18next.language,
             vendor_id: RainMan.config.gameInitVendorId,
         }));
         RainMan.globals.currency = Currencies[this._initData.currency];

package/dist/connectivity/serverConnection.d.ts

@@ -26,6 +26,7 @@ export type InitServerRequest = BaseServerRequest & {
         landscape: boolean;
         matched_ratio: string;
     };
+    locale: string;
 };
 export type SpinServerRequest = BaseServerRequest & {
     action: "spin";

package/dist/controllers/AbstractController.d.ts

@@ -59,6 +59,7 @@ export declare abstract class AbstractController<T> {
     private setRefreshButtonBasedOnPhase;
     private setMessageBoxBasedOnPhase;
     protected getReelIndexesToShowMysteryFx(spinLogic: SpinLogic): number[];
+    protected showSuperBonusWin(removeBonusWin: Promise<void>): void;
     protected handleSpinLogic(): void;
     protected throttledSpin(): void;
     private getBoughtNumberOfFreeSpins;

package/dist/controllers/AbstractController.js

@@ -46,6 +46,7 @@ export class AbstractController {
         this.uiController = new UiController(this.config);
         this.componentRegistry = RainMan.componentRegistry;
         this.setupSpaceOrEnterListener();
+        RainMan.settingsStore.showSuperBonusWin = this.showSuperBonusWin.bind(this);
     }
     init() {
         const initData = this.connection.initData();
@@ -259,6 +260,17 @@ export class AbstractController {
         }
         return reelsIndexesWithScatter;
     }
+    showSuperBonusWin(removeBonusWin) {
+        this.changeGamePhase(gamePhases.BIG_WIN_INVOKED);
+        const winAmount = RainMan.settingsStore.cumulativeWinAmount > 0
+            ? RainMan.settingsStore.cumulativeWinAmount
+            : this.uiController.recentWin;
+        this.countWinBigWin(winAmount).then(async () => {
+            await removeBonusWin;
+            this.changeGamePhase(gamePhases.IDLE);
+        });
+        RainMan.settingsStore.resetCumulativeWinAmount();
+    }
     handleSpinLogic() {
         if (this.mainContainer.freeSpinPlate) {
             if (this.mainContainer.freeSpinPlate.shownAt === null ||

package/dist/stores/SettingsStore.d.ts

@@ -28,6 +28,7 @@ export declare class SettingsStore {
     HiResolutionFlag: boolean;
     batterySaverFlag: boolean;
     containersWithSpines: (ResumableContainer | SpineWithResumableContainer | SpriteWithResumableContainer)[];
+    cumulativeWinAmount: number;
     progress: number;
     singleWinExceeds: number;
     balancedIncreased: number;
@@ -41,6 +42,7 @@ export declare class SettingsStore {
     popupPaytableRepositionCallback?: () => void;
     updateVolumeButtonTexture?: () => void;
     handleModalInvocation?: (layerId: string) => void;
+    showSuperBonusWin?: (callback: Promise<void>) => void;
     private readonly initialAutoplaySettingsState;
     private modalsAvailable;
     private paytableMap;
@@ -48,6 +50,8 @@ export declare class SettingsStore {
     updateBetText(newText: string): void;
     get indexOfSpeedLevel(): number;
     get isFreeSpinsPlayEnabled(): boolean;
+    addCumulativeWinAmount(amount: number): void;
+    resetCumulativeWinAmount(): void;
     updateBet(newBet: number): void;
     setBatteryFlag(flag: boolean): void;
     refreshBatterySaver(): void;
@@ -65,6 +69,7 @@ export declare class SettingsStore {
     setBalancedDecreased(newValue: number): void;
     getMinimumPaytableValue(multipliers: RangeQuantityValue[keyof RangeQuantityValue]): number;
     getMaximumPaytableValue(multipliers: RangeQuantityValue[keyof RangeQuantityValue]): number;
+    forceSuperBigWin(removeBonusWin: Promise<void>): void;
     setDataForSymbolPaytablePopup(symbolId: SymbolId, repositionCallback: () => void): void;
     resetDataForSymbolPaytablePopup(): void;
     setUpdateVolumeButtonTexture(fn: () => void): void;

package/dist/stores/SettingsStore.js

@@ -34,6 +34,7 @@ export class SettingsStore {
     HiResolutionFlag = getFromLocalStorage(LOCAL_STORAGE.hiResolution, true);
     batterySaverFlag = getFromLocalStorage(LOCAL_STORAGE.batterySaver, false);
     containersWithSpines = [];
+    cumulativeWinAmount = 0;
     progress = 0;
     singleWinExceeds = 0;
     balancedIncreased = 0;
@@ -47,6 +48,7 @@ export class SettingsStore {
     popupPaytableRepositionCallback;
     updateVolumeButtonTexture;
     handleModalInvocation;
+    showSuperBonusWin;
     initialAutoplaySettingsState = {
         infinitySpinsEnabled: false,
         onAnyWin: false,
@@ -105,6 +107,12 @@ export class SettingsStore {
     get isFreeSpinsPlayEnabled() {
         return this.howManyFreeSpinsLeft > 0 || this.isLastFreeSpin;
     }
+    addCumulativeWinAmount(amount) {
+        this.cumulativeWinAmount = this.cumulativeWinAmount + amount;
+    }
+    resetCumulativeWinAmount() {
+        this.cumulativeWinAmount = 0;
+    }
     updateBet(newBet) {
         this.bet = newBet;
     }
@@ -205,6 +213,9 @@ export class SettingsStore {
             return last(multipliers) || 0;
         return 0;
     }
+    forceSuperBigWin(removeBonusWin) {
+        this.showSuperBonusWin?.(removeBonusWin);
+    }
     setDataForSymbolPaytablePopup(symbolId, repositionCallback) {
         this.popupPaytableRepositionCallback = repositionCallback;
         this.popupPaytableRepositionCallback();

package/dist/utils/common/functions.js

@@ -60,11 +60,11 @@ export const waitForAnimationToEnd = async (spine, animationName, loopAnimationN
 };
 export const setTimeScale = (spine, flag) => {
     spine.state.originalTimeScale ||= spine.state.timeScale;
-    if (flag)
+    if (flag) {
         spine.state.timeScale = spine.state.originalTimeScale;
+    }
     else {
         spine.state.originalTimeScale = spine.state.timeScale;
-        spine.state.timeScale = 0;
     }
 };
 export const changeResolution = (high) => {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "pixi-rainman-game-engine",
-    "version": "0.1.20",
+    "version": "0.1.22",
     "description": "This repository contains all of the mechanics that used in rainman games.",
     "main": "./dist/index.js",
     "module": "./dist/index.js",
@@ -9,6 +9,7 @@
         "copyCss": "yarn build:tailwind && copyfiles -u 1 \"src/**/*.css\" dist/",
         "build:tailwind": "tailwindcss -i ./src/SettingsUI/index.css -o ./src/SettingsUI/packedStyles.css",
         "build": "rimraf dist/ && tsc && yarn copyCss",
+        "generate:changelog": "yarn changelog generate",
         "dev:build": "tsc-watch --onSuccess \"yarn copyCss\"",
         "lint": "eslint src/** --fix",
         "prepublishOnly": "husky && yarn build",
@@ -56,6 +57,7 @@
         "eslint-plugin-simple-import-sort": "^12.0.0",
         "eslint-plugin-sort-class-members": "^1.20.0",
         "eslint-prettier-config": "^1.0.1",
+        "generate-changelog": "^1.8.0",
         "husky": "^9.0.11",
         "postcss": "^8.4.38",
         "prettier": "^3.2.5",