pixi-rainman-game-engine 0.1.1 → 0.1.2

package/README.md

@@ -6,9 +6,65 @@ This repository contains all of the mechanics that used in rainMan games. This l
 
 1. To build library
     ```sh
-    npm run build
+    yarn build
     ```
-2. Lint project
+2. To build library during development
+
+    ```sh
+     yarn dev:build
+    ```
+
+    Modifying css files does not automatically reload server, after each change manual restart is needed.
+
+    To have live updates in one of the games, link is recommended:
+
+    ```shell
+    yarn dev:link
+    ```
+
+    After that you can use following command in one of the games. If there will be problems or the changes will not reflect in the game, uninstalling npm package may be needed.
+
+    ```sh
+    yarn remove pixi-rainman-game-engine
+    npm link pixi-rainman-game-engine
+    ```
+
+    By using package from npm, in vite optimizeDeps you must exclude this package, but must include each package that throws error in the console. This is probably due to problem with [excluding commonJS dependencies](https://vitejs.dev/config/dep-optimization-options#optimizedeps-exclude). An example is below.
+
+    ```ts
+    defineConfig({
+        optimizeDeps: {
+            include: [
+                "ts-money",
+                "adaptive-scale/lib",
+                "stats.js",
+                "url",
+                "eventemitter3",
+                "earcut",
+                "react",
+                "react-dom",
+                "use-sync-external-store/shim",
+                "classnames",
+                "react-is",
+                "react-custom-scroll",
+                "react-dom/client",
+            ],
+            exclude: ["pixi-rainman-game-engine"],
+        },
+    });
+    ```
+
+    For each error in the console, e.g.:
+
+    ```
+    Uncaught SyntaxError: The requested module '/node_modules/eventemitter3/index.js?v=ec22a584' does not provide an export named 'default'
+    ```
+
+    you must include it in the optimizeDeps.include array. Typically it is the name after /node_modules/.
+
+    **On the other hand, when linking package with npm link, the whole optimizeDeps.include an optimzieDeps.exclude should be commented out.**
+
+3. Lint project
     ```sh
     npm run lint
     ```
@@ -22,4 +78,4 @@ In utils directory there all of the utility functions and types.
 ### Test environment
 
 To simulate behavior of game engine mechanics, this repository contains react-pixi app, where you can test features that are included in game engine.
-Test environment uses local built of game engine. To setup test environment go to [README](./src/test-environment/README.md) of test environment.
+Test environment uses local built of game engine. To setup test environment go to [README](./test-environment/README.md) of test environment.

package/dist/application/ButtonsEventManager/ButtonsEventManager.js

@@ -81,7 +81,7 @@ export class ButtonsEventManager {
     }
     setUpUIElementsInteractivity() {
         const animatedBackground = RainMan.componentRegistry.get(Background.registryName);
-        animatedBackground.interactive = true;
+        animatedBackground.eventMode = "static";
         animatedBackground.addListener("pointerdown", () => {
             if (hideLayerIfPresent() && !RainMan.settingsStore.isAutoplayEnabled) {
                 this.enableButtons();

package/dist/components/AbstractFreeSpinContainer/AbstractFreeSpinContainer.js

@@ -7,7 +7,7 @@ export class AbstractFreeSpinContainer extends Container {
     scaleMultiplier = 1;
     constructor() {
         super();
-        this.interactive = true;
+        this.eventMode = "static";
         this.shownAt = performance.now();
         this.parentLayer = UXLayer;
     }

package/dist/components/AbstractMainContainer/AbstractMainContainer.js

@@ -80,7 +80,7 @@ export class AbstractMainContainer extends Container {
         this.overlay.parentLayer = UXLayer;
         this.overlay.beginFill(0x000000, 0.5);
         this.overlay.drawRect(0, 0, width, height);
-        this.overlay.interactive = true;
+        this.overlay.eventMode = "static";
         this.overlay.endFill();
         this.addChild(this.overlay);
     }

package/dist/components/buttons/BaseButton/BaseButton.js

@@ -72,7 +72,7 @@ export class BaseButton extends Sprite {
     }
     flipDisabledFlag(makeDisabled) {
         this.isDisabled = makeDisabled;
-        this.interactive = !makeDisabled;
+        this.eventMode = makeDisabled ? "auto" : "static";
         this.tint = makeDisabled ? TINT_DISABLED : TINT_ENABLED;
     }
     switchTexture(state) {

package/dist/components/common/FreeSpinBox.js

@@ -16,7 +16,7 @@ export class FreeSpinBox extends ResumableContainer {
         this.spine.state.addAnimation(0, "freeBox", true, 0);
         this.spine.state.timeScale = 1;
         this.addChild(this.spine);
-        this.interactive = true;
+        this.eventMode = "static";
         this.x = 0;
         this.y = 0;
     }
@@ -24,8 +24,7 @@ export class FreeSpinBox extends ResumableContainer {
         this.addListener("pointerdown", onClick);
     }
     setInteractivity(newValue) {
-        this.interactive = newValue;
-        this.interactiveChildren = newValue;
+        this.eventMode = newValue ? "static" : "auto";
         this.spine.tint = Number(newValue ? TINT_ENABLED : TINT_DISABLED);
     }
 }

package/dist/components/symbols/AbstractSymbolBase.js

@@ -25,7 +25,7 @@ export class AbstractSymbolBase extends Container {
         this.setSymbol(symbolId);
         this.spine.x = 0;
         this.spine.y = 0;
-        this.interactive = true;
+        this.eventMode = "static";
         const symbolRadius = 150;
         this.hitArea = new Rectangle(-symbolRadius, -symbolRadius, 2 * symbolRadius, 2 * symbolRadius);
         this.setupClickListener();
@@ -34,7 +34,7 @@ export class AbstractSymbolBase extends Container {
         return this._id;
     }
     setInteractiveFlag(flag) {
-        this.interactive = flag;
+        this.eventMode = flag ? "static" : "auto";
     }
     updateTimeScaleOfSpine(scale = 0) {
         this.animationSpeedMultiplier = scale;

package/dist/winComponents/PositioningFrame.d.ts

@@ -1,6 +1,6 @@
-import { Graphics } from "pixi.js";
+import { ColorSource, Graphics } from "pixi.js";
 export declare class PositioningFrame extends Graphics {
-    private readonly backgroundColor;
-    constructor(frameWidth: number, frameHeight: number, color: number);
+    private backgroundColor;
+    constructor(frameWidth: number, frameHeight: number, backgroundColor: ColorSource);
     resize(frameWidth: number, frameHeight: number): void;
 }

package/dist/winComponents/PositioningFrame.js

@@ -1,11 +1,11 @@
 import { Graphics } from "pixi.js";
 export class PositioningFrame extends Graphics {
     backgroundColor;
-    constructor(frameWidth, frameHeight, color) {
+    constructor(frameWidth, frameHeight, backgroundColor) {
         super();
-        this.backgroundColor = color;
+        this.backgroundColor = backgroundColor;
         this.resize(frameWidth, frameHeight);
-        this.interactive = true;
+        this.eventMode = "static";
     }
     resize(frameWidth, frameHeight) {
         this.x = 0;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "pixi-rainman-game-engine",
-    "version": "0.1.1",
+    "version": "0.1.2",
     "description": "This repository contains all of the mechanics that used in rainman games.",
     "main": "./dist/index.js",
     "module": "./dist/index.js",
@@ -8,7 +8,7 @@
     "scripts": {
         "copyCss": "copyfiles -u 1 \"src/**/*.css\" dist/",
         "build": "rimraf dist/ && tsc && yarn copyCss",
-        "dev:build": "tsc-watch",
+        "dev:build": "tsc-watch --onSuccess \"yarn copyCss\"",
         "dev:link": "npm link && cd test-environment && npm link pixi-rainman-game-engine",
         "dev:server": "cd test-environment && yarn dev",
         "lint": "eslint src/** --fix",