brick-engine-js 1.0.1

package/src/config/configs.ts

@@ -0,0 +1,197 @@
+export default {
+    /** Colors used for styling the game interface. */
+    colors: {
+        /** Primary background color for the game screen. */
+        background: 'rgb(172, 189, 173)',
+        /** Active Font/Cell color. */
+        active: 'rgb(19, 26, 18)',
+        /** Inactive Font/Cell color. */
+        inactive: 'rgba(161, 178, 160, 1)',
+
+        /** Main theme color for the game device body. */
+        bodyMain: 'rgb(0, 68, 187)',
+        /** Secondary theme color for the buttons on the device body. */
+        bodyButton: 'rgb(247, 222, 57)',
+    },
+    /** Screen layout configurations. */
+    screenLayout: {
+        /** Main game grid dimensions. */
+        grid: {
+            columns: 11,
+            rows: 18,
+        },
+
+        /** Head-Up Display (HUD) grid dimensions. */
+        hudGrid: {
+            columns: 4,
+            rows: 4,
+        },
+
+        /** Logical display settings within the container. */
+        display: {
+            width: 0.65,
+            height: 0.956,
+            margin: 0.022,
+            borderWeight: 0.0075,
+        },
+
+        /** Predefined font scale factors relative to container size. */
+        fontSize: {
+            extraSmall: 0.05,
+            small: 0.065,
+            medium: 0.1,
+            large: 0.125,
+            extraLarge: 0.15,
+        },
+
+        /** Sizing and spacing for individual grid cells. */
+        cell: {
+            margin: 0.1,
+            padding: 0.3,
+            strokeWeight: 0.075,
+        },
+    },
+    /** View layout configurations. */
+    viewLayout: {
+        /** Aspect ratio multiplier for the device body height relative to width. */
+        bodyHeightWidthMultiplier: 1.9,
+
+        /** Screen width threshold for switching to mobile layout (in pixels). */
+        mobileBreakpoint: 600,
+
+        /** Responsive canvas scaling and aspect ratio settings. */
+        canvas: {
+            widthRatio: 0.7,
+            aspectRatio: 1.114, // Height relative to width
+        },
+
+        /** Delay before hiding the splash screen after initialization (in milliseconds). */
+        splashHideDelayMs: 250,
+
+        /** Dimensions and ratios for the game interface. */
+        dimensions: {
+            /** Border radius as a ratio of container width. */
+            borderRadiusRatio: 0.05,
+            /** Border width as a ratio of container width. */
+            borderWidthRatio: 0.006,
+
+            /** Button-specific scaling factors. */
+            button: {
+                /** Small button size ratio. */
+                smSizeRatio: 0.08,
+                /** Medium/Standard button size ratio. */
+                mdSizeRatio: 0.18,
+                /** Large action button size ratio. */
+                lgSizeRatio: 0.25,
+
+                /** Scaling factors specifically for mobile viewports. */
+                mobile: {
+                    /** Mobile small button size ratio. */
+                    smSizeRatio: 0.13,
+                    /** Mobile medium/standard button size ratio. */
+                    mdSizeRatio: 0.26,
+                    /** Mobile large action button size ratio. */
+                    lgSizeRatio: 0.35,
+                    /** Standard font ratio for mobile buttons. */
+                    fontRatio: 0.05,
+                    /** Small font ratio for mobile buttons. */
+                    smFontRatio: 0.04,
+                    /** Large font ratio for mobile buttons. */
+                    lgFontRatio: 0.055,
+                    /** Spacing ratio between mobile buttons. */
+                    spacingRatio: 0.018,
+                },
+                /** Button border width as a ratio of container width. */
+                borderRatio: 0.0045,
+                /** Duration for button press animations. */
+                animationDuration: '0.15s',
+            },
+        },
+
+        /** Standard shadow dispersion size for UI depth. */
+        shadowDispersion: '3px',
+    },
+    /** Input query parameters. */
+    inputQueryParams: {
+        /** Key for customizing the device body main color. */
+        mainColor: 'body-color',
+        /** Key for customizing the device body button color. */
+        buttonColor: 'button-color',
+        /** Key for detecting if the game is running on a mobile app wrapper. */
+        runningOnApp: 'mobile',
+    },
+    /** Selectors for DOM elements. */
+    selectors: {
+        /** Root container where the p5 instance is attached. */
+        parent: '#brick-game',
+
+        /** Splash screen shown during initial load. */
+        splash: '#splash',
+
+        /** Modal IDs used for session continuation. */
+        modalIds: {
+            /** Modal shown when continuing a previous session. */
+            sessionModal: '#session-modal',
+            /** Confirmation button in the session modal. */
+            sessionContinueYes: '#session-modal-yes',
+            /** Cancellation button in the session modal. */
+            sessionContinueNo: '#session-modal-no',
+        },
+
+        /** Explicit IDs assigned to dynamically created DOM elements. */
+        viewElementIds: {
+            canvas: 'brick-game-canvas',
+            container: 'container',
+            frame: 'frame',
+            buttonContainer: 'button-container',
+            smallButtonContainer: 'small-button-container',
+            innerButtonContainer: 'inner-button-container',
+            mediumButtonContainer: 'medium-button-container',
+            directionVerticalContainer: 'direction-vertical-container',
+            directionHorizontalContainer: 'direction-horizontal-container',
+            largeButtonContainer: 'large-button-container',
+        },
+    },
+    /** Storage keys for persisting data in LocalStorage. */
+    storageKeys: {
+        /** Key for audio muting preference. */
+        muted: 'STATE.MUTED',
+        /** Key for color mode preference. */
+        colorEnabled: 'STATE.COLOR_ENABLED',
+
+        /** Key for the current game grid state. */
+        grid: 'GAME.GRID',
+        /** Key for the current HUD grid state. */
+        hudGrid: 'GAME.HUD_GRID',
+        /** Key for the game speed/tick interval. */
+        tickInterval: 'GAME.TICK_INTERVAL',
+        /** Key for the user's high score. */
+        score: 'GAME.SCORE',
+    },
+    /** Button hold settings. */
+    buttonHold: {
+        /** Initial delay before a held button starts repeating (in milliseconds). */
+        holdDelayMs: 250,
+        /** Interval between repeated actions while a button is held (in milliseconds). */
+        holdIntervalMs: 50,
+    },
+    /** Game settings. */
+    game: {
+        /** Interval between game ticks (in milliseconds). */
+        tickInterval: 1000 / 30, // 30 ticks per second
+        /** Minimum interval between game ticks (in milliseconds). */
+        minTickInterval: 1000 / 60, // 60 ticks per second
+
+        /** Performance Monitor settings. */
+        debugger: {
+            /** Number of milliseconds to count before updating the performance. */
+            msInterval: 100,
+            /** Enable performance overlay. */
+            enabled: true,
+        },
+
+        sound: {
+            volume: 0.025,
+        },
+    },
+} as const;

package/src/config/env.test.ts

@@ -0,0 +1,59 @@
+import { describe, it, expect, afterEach } from 'vitest';
+import { isClientMode, isServerMode } from './env';
+
+describe('env configuration', () => {
+    const originalEnv = process.env;
+
+    afterEach(() => {
+        // Restore original env after each test
+        process.env = { ...originalEnv };
+    });
+
+    describe('isClientMode', () => {
+        it('should return true when APP_MODE is client', () => {
+            // [ARRANGE]
+            process.env.APP_MODE = 'client';
+
+            // [ACT]
+            const result = isClientMode();
+
+            // [ASSERT]
+            expect(result).toBe(true);
+        });
+
+        it('should return false when APP_MODE is not client', () => {
+            // [ARRANGE]
+            process.env.APP_MODE = 'server';
+
+            // [ACT]
+            const result = isClientMode();
+
+            // [ASSERT]
+            expect(result).toBe(false);
+        });
+    });
+
+    describe('isServerMode', () => {
+        it('should return true when APP_MODE is server', () => {
+            // [ARRANGE]
+            process.env.APP_MODE = 'server';
+
+            // [ACT]
+            const result = isServerMode();
+
+            // [ASSERT]
+            expect(result).toBe(true);
+        });
+
+        it('should return false when APP_MODE is not server', () => {
+            // [ARRANGE]
+            process.env.APP_MODE = 'client';
+
+            // [ACT]
+            const result = isServerMode();
+
+            // [ASSERT]
+            expect(result).toBe(false);
+        });
+    });
+});

package/src/config/env.ts

@@ -0,0 +1,7 @@
+export function isClientMode() {
+    return process.env.APP_MODE === 'client';
+}
+
+export function isServerMode() {
+    return process.env.APP_MODE === 'server';
+}

package/src/config/styles.ts

@@ -0,0 +1,5 @@
+/**
+ * Dynamically load all CSS files from the public/style directory.
+ * This allows Webpack to bundle them without needing explicit imports for each file.
+ */
+require.context('../../public/style', true, /\.css$/);

package/src/core/Game.test.ts

@@ -0,0 +1,167 @@
+/** @vitest-environment jsdom */
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import Game from './Game';
+import p5 from 'p5';
+import type GameView from '../view/GameView';
+import { ControlEventType, ControlKey } from './types/Types';
+
+// Mock localStorage
+const localStorageMock = (() => {
+    let store: Record<string, string> = {};
+    return {
+        getItem: vi.fn((key: string) => store[key] || null),
+        setItem: vi.fn((key: string, value: string) => {
+            store[key] = value.toString();
+        }),
+        removeItem: vi.fn((key: string) => {
+            delete store[key];
+        }),
+        clear: vi.fn(() => {
+            store = {};
+        }),
+    };
+})();
+vi.stubGlobal('localStorage', localStorageMock);
+vi.stubGlobal(
+    'AudioContext',
+    vi.fn().mockImplementation(function () {
+        return {
+            createGain: vi.fn().mockReturnValue({
+                connect: vi.fn(),
+                gain: { setValueAtTime: vi.fn() },
+            }),
+            destination: {},
+        };
+    }),
+);
+
+class MockGame extends Game {
+    update = vi.fn();
+    render = vi.fn();
+    setupGame = vi.fn();
+    getPersistenceKey = () => 'test-game';
+    drawTitleScreen = vi.fn();
+    drawGameOverScreen = vi.fn();
+}
+
+describe('Game', () => {
+    let game: MockGame;
+    let mockP5: Record<string, unknown>;
+    let mockView: GameView;
+
+    beforeEach(() => {
+        mockP5 = {
+            deltaTime: 16.6,
+            noLoop: vi.fn(),
+            push: vi.fn(),
+            pop: vi.fn(),
+            translate: vi.fn(),
+            strokeWeight: vi.fn(),
+            stroke: vi.fn(),
+            noFill: vi.fn(),
+            rect: vi.fn(),
+            fill: vi.fn(),
+            text: vi.fn(),
+            textFont: vi.fn(),
+            textSize: vi.fn(),
+            textAlign: vi.fn(),
+            image: vi.fn(),
+            createGraphics: vi.fn().mockReturnValue({
+                background: vi.fn(),
+                strokeWeight: vi.fn(),
+                noFill: vi.fn(),
+                stroke: vi.fn(),
+                rect: vi.fn(),
+            }),
+        };
+        mockView = {
+            build: vi.fn(),
+            bindControls: vi.fn(),
+            showSessionModal: vi.fn(),
+            onModal: vi.fn(),
+        } as unknown as GameView;
+
+        game = new MockGame(mockP5 as unknown as p5, mockView);
+    });
+
+    describe('setup', () => {
+        it('should initialize all modules and sync state', () => {
+            // [ACT]
+            game.setup();
+
+            // [ASSERT]
+            expect(game.modules).toBeDefined();
+            expect(game.modules.state).toBeDefined();
+            expect(game.modules.grid).toBeDefined();
+            expect(mockView.build).toHaveBeenCalled();
+            expect(game.setupGame).toHaveBeenCalled();
+        });
+    });
+
+    describe('draw', () => {
+        beforeEach(() => {
+            game.setup();
+        });
+
+        it('should render title screen if game is ON but not STARTED', () => {
+            // [ARRANGE]
+            game.modules.state.turnOn();
+            // state.isStarted() is false by default
+
+            // [ACT]
+            game.draw();
+
+            // [ASSERT]
+            expect(game.drawTitleScreen).toHaveBeenCalled();
+        });
+
+        it('should update and render if game is PLAYING', () => {
+            // [ARRANGE]
+            game.modules.state.turnOn();
+            game.modules.state.startGame(); // sets started and playing to true
+
+            // Mock time to trigger tick
+            // Tick interval is in configs, let's assume 1000ms
+            game.modules.time.update(2000);
+
+            // [ACT]
+            game.draw();
+
+            // [ASSERT]
+            expect(game.update).toHaveBeenCalled();
+            expect(game.render).toHaveBeenCalled();
+        });
+    });
+
+    describe('System Controls', () => {
+        beforeEach(() => {
+            game.setup();
+        });
+
+        it('should handle POWER button press', () => {
+            const control = game.modules.control;
+            const state = game.modules.state;
+
+            // Simulate Power Press
+            control.notify(ControlKey.POWER, ControlEventType.PRESSED);
+            expect(state.isOn()).toBe(true);
+
+            control.notify(ControlKey.POWER, ControlEventType.PRESSED);
+            expect(state.isOn()).toBe(false);
+        });
+
+        it('should handle RESET button press', () => {
+            const control = game.modules.control;
+            const state = game.modules.state;
+            const grid = game.modules.grid;
+
+            state.turnOn();
+            const spy = vi.spyOn(grid, 'resetGrid');
+
+            control.notify(ControlKey.RESET, ControlEventType.PRESSED);
+
+            expect(spy).toHaveBeenCalled();
+            expect(state.isStarted()).toBe(true);
+        });
+    });
+});