From f8129c1c31a6c2d7f75a71c525d1f405a659c4eb Mon Sep 17 00:00:00 2001 From: neki-dev Date: Tue, 26 Sep 2023 11:24:50 +0200 Subject: [PATCH 1/7] Minor fixes --- src/lib/navigator/node.ts | 22 +++++++--------------- src/lib/navigator/process.ts | 2 +- src/lib/navigator/task.ts | 17 +++++++++-------- src/lib/navigator/tools.ts | 16 ++++++++-------- src/shaders/outline.ts | 16 ++++++---------- src/types/navigator.ts | 2 ++ 6 files changed, 33 insertions(+), 42 deletions(-) diff --git a/src/lib/navigator/node.ts b/src/lib/navigator/node.ts index 273c014c..7e946131 100644 --- a/src/lib/navigator/node.ts +++ b/src/lib/navigator/node.ts @@ -2,9 +2,7 @@ import { NavigatorPathNodeData } from '~type/navigator'; import { Vector2D } from '~type/world/level'; export class PathNode { - readonly x: number; - - readonly y: number; + readonly position: Vector2D; readonly distance: number; @@ -14,11 +12,10 @@ export class PathNode { private listOpened: Nullable = null; - constructor(parent: Nullable, { - position, cost = 1.0, distance, + constructor({ + position, cost = 1.0, distance, parent = null, }: NavigatorPathNodeData) { - this.x = position.x; - this.y = position.y; + this.position = position; this.distance = distance; this.cost = cost; this.parent = parent; @@ -61,20 +58,15 @@ export class PathNode { } public getPath() { - const path: Vector2D[] = [{ - x: this.x, - y: this.y, - }]; + const path: Vector2D[] = [this.position]; let parent = this.getParent(); while (parent) { - path.push({ - x: parent.x, - y: parent.y, - }); + path.push(parent.position); parent = parent.getParent(); } + path.reverse(); return path; diff --git a/src/lib/navigator/process.ts b/src/lib/navigator/process.ts index 1984ebe7..acc2c4f2 100644 --- a/src/lib/navigator/process.ts +++ b/src/lib/navigator/process.ts @@ -36,7 +36,7 @@ export class NavigatorProcess { continue; } - if (equalPositions(task.to, currentNode)) { + if (equalPositions(task.to, currentNode.position)) { this.taskQueue.shift(); task.complete(currentNode); continue; diff --git a/src/lib/navigator/task.ts b/src/lib/navigator/task.ts index 1c2e5449..56136dee 100644 --- a/src/lib/navigator/task.ts +++ b/src/lib/navigator/task.ts @@ -26,7 +26,7 @@ export class NavigatorTask { constructor({ id, from, to, grid, compress = false, }: NavigatorTaskData) { - this.id = id as string; + this.id = id ?? 'noid'; this.from = from; this.to = to; this.grid = grid; @@ -36,7 +36,7 @@ export class NavigatorTask { (nodeA, nodeB) => nodeA.bestGuessDistance() - nodeB.bestGuessDistance(), ); - const node = new PathNode(null, { + const node = new PathNode({ position: from, distance: getDistance(from, to), }); @@ -51,10 +51,10 @@ export class NavigatorTask { public addNode(node: PathNode) { this.nodes.push(node); - if (!this.tree[node.y]) { - this.tree[node.y] = []; + if (!this.tree[node.position.y]) { + this.tree[node.position.y] = []; } - this.tree[node.y][node.x] = node; + this.tree[node.position.y][node.position.x] = node; } public pickNode(position: Vector2D) { @@ -97,8 +97,8 @@ export class NavigatorTask { points: number[][], ) { const position: Vector2D = { - x: currentNode.x + shift.x, - y: currentNode.y + shift.y, + x: currentNode.position.x + shift.x, + y: currentNode.position.y + shift.y, }; const cost = currentNode.getCost() + getCost(currentNode, shift, points); const existNode = this.pickNode(position); @@ -110,7 +110,8 @@ export class NavigatorTask { this.upNode(existNode); } } else { - const node = new PathNode(currentNode, { + const node = new PathNode({ + parent: currentNode, position, cost, distance: getDistance(position, this.to), diff --git a/src/lib/navigator/tools.ts b/src/lib/navigator/tools.ts index 4c2d16ff..3474e15c 100644 --- a/src/lib/navigator/tools.ts +++ b/src/lib/navigator/tools.ts @@ -17,8 +17,8 @@ export function getCost( points: number[][], ) { const position: Vector2D = { - x: currentNode.x + shift.x, - y: currentNode.y + shift.y, + x: currentNode.position.x + shift.x, + y: currentNode.position.y + shift.y, }; const cost = points[position.y]?.[position.x] ?? 1.0; const isDiagonal = Math.abs(shift.x) + Math.abs(shift.y) !== 1; @@ -26,8 +26,8 @@ export function getCost( if (isDiagonal) { return ( cost * Math.SQRT2 - + (points[currentNode.y]?.[position.x] ?? 0.0) - + (points[position.y]?.[currentNode.x] ?? 0.0) + + (points[currentNode.position.y]?.[position.x] ?? 0.0) + + (points[position.y]?.[currentNode.position.x] ?? 0.0) ); } @@ -52,8 +52,8 @@ export function getDirections(grid: boolean[][], currentNode: PathNode) { const allowedDirs: Vector2D[] = []; eachEntries(straightDirs, (key, dir) => { - const x = currentNode.x + dir.x; - const y = currentNode.y + dir.y; + const x = currentNode.position.x + dir.x; + const y = currentNode.position.y + dir.y; if (grid[y]?.[x] === false) { straightFlags[key] = true; @@ -63,8 +63,8 @@ export function getDirections(grid: boolean[][], currentNode: PathNode) { eachEntries(diagonalDirs, (key, dir) => { const dontCross = key.split('').every((flag) => straightFlags[flag]); - const x = currentNode.x + dir.x; - const y = currentNode.y + dir.y; + const x = currentNode.position.x + dir.x; + const y = currentNode.position.y + dir.y; if (dontCross && grid[y]?.[x] === false) { allowedDirs.push(dir); diff --git a/src/shaders/outline.ts b/src/shaders/outline.ts index 77530916..70c85549 100644 --- a/src/shaders/outline.ts +++ b/src/shaders/outline.ts @@ -6,9 +6,9 @@ type Config = { }; export class OutlineShader extends Phaser.Renderer.WebGL.Pipelines.PostFXPipeline { - private _size: number = 1.0; + private size: number = 1.0; - private _color: Phaser.Display.Color = new Phaser.Display.Color(); + private color: Phaser.Display.Color = new Phaser.Display.Color(255, 255, 255); constructor(game: Phaser.Game) { super({ @@ -48,24 +48,20 @@ export class OutlineShader extends Phaser.Renderer.WebGL.Pipelines.PostFXPipelin } `, }); - - this.setConfig({ - color: 0xffffff, - }); } public onPreRender() { - this.set1f('thickness', this._size); - this.set3f('outlineColor', this._color.redGL, this._color.greenGL, this._color.blueGL); + this.set1f('thickness', this.size); + this.set3f('outlineColor', this.color.redGL, this.color.greenGL, this.color.blueGL); this.set2f('imageSize', this.renderer.width, this.renderer.height); } public setConfig({ size, color }: Config) { if (size !== undefined) { - this._size = size; + this.size = size; } if (color !== undefined) { - this._color.setFromRGB(Phaser.Display.Color.IntegerToRGB(color)); + this.color.setFromRGB(Phaser.Display.Color.IntegerToRGB(color)); } } } diff --git a/src/types/navigator.ts b/src/types/navigator.ts index 69ff2a29..92def446 100644 --- a/src/types/navigator.ts +++ b/src/types/navigator.ts @@ -1,3 +1,4 @@ +import { PathNode } from '~lib/navigator/node'; import { Vector2D } from '~type/world/level'; export interface INavigator { @@ -48,6 +49,7 @@ export type NavigatorTaskData = { export type NavigatorPathNodeData = { position: Vector2D + parent?: Nullable cost?: number distance: number }; From ba05e878d1ac784d811720bcfed1b9141a3a6563 Mon Sep 17 00:00:00 2001 From: neki-dev Date: Tue, 26 Sep 2023 12:42:05 +0200 Subject: [PATCH 2/7] Updated SDK --- src/const/sdk.ts | 6 ++ src/game/game.ts | 42 ++++++---- .../screen/interface/ads-reward/index.tsx | 2 +- src/lib/sdk.ts | 84 +++++++++++++++++++ src/types/game.ts | 4 +- src/types/sdk.ts | 27 ++++++ 6 files changed, 144 insertions(+), 21 deletions(-) create mode 100644 src/const/sdk.ts create mode 100644 src/lib/sdk.ts create mode 100644 src/types/sdk.ts diff --git a/src/const/sdk.ts b/src/const/sdk.ts new file mode 100644 index 00000000..44f712af --- /dev/null +++ b/src/const/sdk.ts @@ -0,0 +1,6 @@ +import { SDKPlatform } from '~type/sdk'; + +export const SDK_PLATFORMS: Record = { + [SDKPlatform.CRAZY_GAMES]: 'https://sdk.crazygames.com/crazygames-sdk-v2.js', + [SDKPlatform.POKI]: 'https://game-cdn.poki.com/scripts/v2/poki-sdk.js', +}; diff --git a/src/game/game.ts b/src/game/game.ts index a91e63ee..e89e5a29 100644 --- a/src/game/game.ts +++ b/src/game/game.ts @@ -4,9 +4,10 @@ import { AUDIO_VOLUME, CONTAINER_ID, DEBUG_MODS, SETTINGS, } from '~const/game'; import { Analytics } from '~lib/analytics'; +import { SDK } from '~lib/sdk'; import { Storage } from '~lib/storage'; import { Tutorial } from '~lib/tutorial'; -import { eachEntries, registerScript } from '~lib/utils'; +import { eachEntries } from '~lib/utils'; import { Gameover } from '~scene/gameover'; import { Menu } from '~scene/menu'; import { Screen } from '~scene/screen'; @@ -27,6 +28,7 @@ import { } from '~type/game'; import { MenuPage } from '~type/menu'; import { IScreen } from '~type/screen'; +import { ISDK, SDKPlatform } from '~type/sdk'; import { IStorage, StorageSave } from '~type/storage'; import { ITutorial } from '~type/tutorial'; import { IWorld } from '~type/world'; @@ -40,6 +42,8 @@ export class Game extends Phaser.Game implements IGame { readonly storage: IStorage; + private sdk: ISDK | null = null; + private flags: string[]; public difficulty: GameDifficulty = GameDifficulty.NORMAL; @@ -104,9 +108,7 @@ export class Game extends Phaser.Game implements IGame { this.readFlags(); this.readSettings(); - if (this.isFlagEnabled(GameFlag.ADS)) { - registerScript('https://sdk.crazygames.com/crazygames-sdk-v2.js'); - } + this.createSDK(); this.events.on(Phaser.Core.Events.READY, () => { this.screen = this.scene.getScene(GameScene.SCREEN); @@ -242,7 +244,7 @@ export class Game extends Phaser.Game implements IGame { defaultPage: MenuPage.NEW_GAME, }); - this.showAd(GameAdType.MIDGAME); + this.showAdv(GameAdType.MIDGAME); if (!IS_DEV_MODE) { window.onbeforeunload = null; @@ -305,29 +307,35 @@ export class Game extends Phaser.Game implements IGame { private readFlags() { const query = new URLSearchParams(window.location.search); - const rawFlags = query.get('flags'); + const value = query.get('flags')?.toUpperCase() ?? ''; - this.flags = rawFlags?.toUpperCase().split(',') ?? []; + this.flags = value.split(','); } - public showAd(type: GameAdType, callback?: () => void) { - if (!this.isFlagEnabled(GameFlag.ADS)) { + public showAdv(type: GameAdType, callback?: () => void) { + if (!this.sdk || !this.isFlagEnabled(GameFlag.ADS)) { return; } - // @ts-ignore - window.CrazyGames?.SDK?.ad?.requestAd(type, { - adStarted: () => { + this.sdk.showAdv( + type, + () => { this.pause(); }, - adFinished: () => { + () => { this.resume(); callback?.(); }, - adError: (error: any) => { - console.warn(`Error ${type} ad:`, error); - }, - }); + ); + } + + private createSDK() { + const query = new URLSearchParams(window.location.search); + const platform = query.get('sdk')?.toUpperCase(); + + if (platform) { + this.sdk = new SDK(platform); + } } private getRecordStat(): Nullable { diff --git a/src/game/scenes/screen/interface/ads-reward/index.tsx b/src/game/scenes/screen/interface/ads-reward/index.tsx index 7790490b..e03be828 100644 --- a/src/game/scenes/screen/interface/ads-reward/index.tsx +++ b/src/game/scenes/screen/interface/ads-reward/index.tsx @@ -24,7 +24,7 @@ export const AdsReward: React.FC = () => { }); const onConfirmAds = () => { - game.showAd(GameAdType.REWARDED, () => { + game.showAdv(GameAdType.REWARDED, () => { world.player.giveExperience(adsReward.experience); world.player.giveResources(adsReward.resources); }); diff --git a/src/lib/sdk.ts b/src/lib/sdk.ts new file mode 100644 index 00000000..8222f7c4 --- /dev/null +++ b/src/lib/sdk.ts @@ -0,0 +1,84 @@ +import { SDK_PLATFORMS } from '~const/sdk'; +import { GameAdType } from '~type/game'; +import { ISDK, SDKPlatform } from '~type/sdk'; + +import { registerScript } from './utils'; + +export class SDK implements ISDK { + private platform: SDKPlatform; + + constructor(platform: SDKPlatform) { + try { + registerScript(SDK_PLATFORMS[platform]).then(() => { + this.platform = platform; + + switch (this.platform) { + case SDKPlatform.POKI: { + window.PokiSDK?.init(); + } + } + }); + } catch (error) { + console.error('SDK initialization error:', error); + } + } + + public showAdv( + type: GameAdType, + callbackBeg: () => void, + callbackEnd: (success: boolean) => void, + ) { + try { + switch (this.platform) { + case SDKPlatform.CRAZY_GAMES: { + window.CrazyGames?.SDK?.ad?.requestAd(type, { + adStarted: callbackBeg, + adFinished: () => callbackEnd(true), + }); + break; + } + case SDKPlatform.POKI: { + const method = type === GameAdType.REWARDED ? 'rewardedBreak' : 'commercialBreak'; + + window.PokiSDK?.[method](callbackBeg).then((success: boolean) => { + callbackEnd(success); + }); + break; + } + } + } catch (error) { + console.error('SDK Show adv error:', error); + } + } + + // public toggleLoadState(state: boolean) { + // switch (this.platform) { + // case SDKPlatform.CRAZY_GAMES: { + // if (state) { + // window.CrazyGames?.SDK?.game?.sdkGameLoadingStart(); + // } else { + // window.CrazyGames?.SDK?.game?.sdkGameLoadingStop(); + // } + // break; + // } + // case SDKPlatform.POKI: { + // if (!state) { + // window.PokiSDK?.gameLoadingFinished(); + // } + // break; + // } + // } + // } + + // public togglePlayState(state: boolean) { + // switch (this.platform) { + // case SDKPlatform.POKI: { + // if (state) { + // window.PokiSDK.gameplayStart(); + // } else { + // window.PokiSDK.gameplayStop(); + // } + // } + // } + // } +} diff --git a/src/types/game.ts b/src/types/game.ts index a38df27c..cc5c3ef1 100644 --- a/src/types/game.ts +++ b/src/types/game.ts @@ -1,5 +1,3 @@ -import Phaser from 'phaser'; - import { IAnalytics } from '~type/analytics'; import { IScreen } from '~type/screen'; import { IStorage, StorageSave } from '~type/storage'; @@ -112,7 +110,7 @@ export interface IGame extends Phaser.Game { * @param type - Ad type * @param callback - Complete callback */ - showAd(type: GameAdType, callback?: () => void): void + showAdv(type: GameAdType, callback?: () => void): void /** * Get data for saving. diff --git a/src/types/sdk.ts b/src/types/sdk.ts new file mode 100644 index 00000000..aac9f071 --- /dev/null +++ b/src/types/sdk.ts @@ -0,0 +1,27 @@ +import { GameAdType } from './game'; + +export interface ISDK { + /** + * Show advertising. + * @param type - Ad type + * @param callbackBeg - Start callback + * @param callbackEnd - Complete callback + */ + showAdv( + type: GameAdType, + callbackBeg: () => void, + callbackEnd: (success: boolean) => void + ): void +} + +export enum SDKPlatform { + CRAZY_GAMES = 'CRAZY_GAMES', + POKI = 'POKI', +} + +declare global { + interface Window { + PokiSDK?: any + CrazyGames?: any + } +} From a72515ca1678a110d4d5ba09f119177340e1dbba Mon Sep 17 00:00:00 2001 From: neki-dev Date: Tue, 26 Sep 2023 14:40:58 +0200 Subject: [PATCH 3/7] Added loading progress --- src/assets/styles.css | 8 ++++---- src/game/scenes/system/system.ts | 23 ++++++++++++++--------- src/index.html | 2 +- 3 files changed, 19 insertions(+), 14 deletions(-) diff --git a/src/assets/styles.css b/src/assets/styles.css index b1a39047..9162dc7f 100644 --- a/src/assets/styles.css +++ b/src/assets/styles.css @@ -26,11 +26,11 @@ img { flex-direction: column; display: flex; padding: 100px; - font: 20px 'Verdana'; + font: 14px 'Verdana'; font-weight: bold; - line-height: 20pt; - letter-spacing: 2px; - color: #aaa; + line-height: 14pt; + letter-spacing: 1px; + color: #fff; text-align: center; z-index: 999; } diff --git a/src/game/scenes/system/system.ts b/src/game/scenes/system/system.ts index ab67b4ca..6d4cef7d 100644 --- a/src/game/scenes/system/system.ts +++ b/src/game/scenes/system/system.ts @@ -8,23 +8,26 @@ import { MenuPage } from '~type/menu'; export class System extends Scene { constructor() { - super({ - key: GameScene.SYSTEM, - pack: getAssetsPack(), - }); - - setLoadingStatus('ASSETS LOADING'); + super(GameScene.SYSTEM); } - public async create() { - await this.game.loadPayload(); + public async preload() { + this.load.on('progress', (value: number) => { + setLoadingStatus(`LOADING\n${Math.round(value * 100)}%`); + }); + + this.load.addPack([getAssetsPack()]); await Promise.all([ loadFontFace(InterfaceFont.PIXEL_LABEL, 'pixel_label.ttf'), loadFontFace(InterfaceFont.PIXEL_TEXT, 'pixel_text.ttf'), ]); + } - removeLoading(); + public async create() { + setLoadingStatus('LOADING\nDONE'); + + await this.game.loadPayload(); this.scene.launch(GameScene.WORLD); this.scene.launch(GameScene.MENU, { @@ -33,6 +36,8 @@ export class System extends Scene { this.scene.bringToTop(); + removeLoading(); + this.input.keyboard?.on(CONTROL_KEY.PAUSE, () => { if (this.game.isPaused) { // System pause diff --git a/src/index.html b/src/index.html index 4a718fb4..bb0065d7 100644 --- a/src/index.html +++ b/src/index.html @@ -14,7 +14,7 @@
-
GAME LOADING
+
PREPARING
From 78b2d149ec2bfa4aa8912129531cf2c92d75647c Mon Sep 17 00:00:00 2001 From: neki-dev Date: Tue, 26 Sep 2023 16:09:07 +0200 Subject: [PATCH 4/7] Added textures reusing for UI --- package-lock.json | 16 ++++++++-------- package.json | 4 ++-- .../screen/interface/builder/preview/index.tsx | 8 +++----- .../screen/interface/builder/preview/styles.ts | 4 +--- 4 files changed, 14 insertions(+), 18 deletions(-) diff --git a/package-lock.json b/package-lock.json index 91013399..81208017 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,9 +11,9 @@ "dependencies": { "gen-biome": "2.4.0", "heap": "0.2.7", - "idb": "^7.1.1", + "idb": "7.1.1", "phaser": "3.60.0", - "phaser-react-ui": "1.4.2", + "phaser-react-ui": "1.6.1", "react": "18.2.0", "react-dom": "18.2.0", "styled-components": "6.0.1", @@ -10570,9 +10570,9 @@ } }, "node_modules/phaser-react-ui": { - "version": "1.4.2", - "resolved": "https://registry.npmjs.org/phaser-react-ui/-/phaser-react-ui-1.4.2.tgz", - "integrity": "sha512-hMK3UnkIlpi7bRdbZ6hLyrWpuOqnBKR73vo5sZSQSg+5Uqm+eq/UVNvqBswcAFlB8Oqr+P3jGNUKr+ZUIlLg7A==" + "version": "1.6.1", + "resolved": "https://registry.npmjs.org/phaser-react-ui/-/phaser-react-ui-1.6.1.tgz", + "integrity": "sha512-dltPXWLKpkFVNlz77AzOwhCVhhIZZJmNZSdK34VgH6Si08CP6bF9HDZqLpsS8YNmKQ1vpVInLdP1Ww/3pqLPtA==" }, "node_modules/phaser3spectorjs": { "version": "0.0.8", @@ -21205,9 +21205,9 @@ } }, "phaser-react-ui": { - "version": "1.4.2", - "resolved": "https://registry.npmjs.org/phaser-react-ui/-/phaser-react-ui-1.4.2.tgz", - "integrity": "sha512-hMK3UnkIlpi7bRdbZ6hLyrWpuOqnBKR73vo5sZSQSg+5Uqm+eq/UVNvqBswcAFlB8Oqr+P3jGNUKr+ZUIlLg7A==" + "version": "1.6.1", + "resolved": "https://registry.npmjs.org/phaser-react-ui/-/phaser-react-ui-1.6.1.tgz", + "integrity": "sha512-dltPXWLKpkFVNlz77AzOwhCVhhIZZJmNZSdK34VgH6Si08CP6bF9HDZqLpsS8YNmKQ1vpVInLdP1Ww/3pqLPtA==" }, "phaser3spectorjs": { "version": "0.0.8", diff --git a/package.json b/package.json index 59e3d32f..c33cafe6 100644 --- a/package.json +++ b/package.json @@ -56,9 +56,9 @@ "dependencies": { "gen-biome": "2.4.0", "heap": "0.2.7", - "idb": "^7.1.1", + "idb": "7.1.1", "phaser": "3.60.0", - "phaser-react-ui": "1.4.2", + "phaser-react-ui": "1.6.1", "react": "18.2.0", "react-dom": "18.2.0", "styled-components": "6.0.1", diff --git a/src/game/scenes/screen/interface/builder/preview/index.tsx b/src/game/scenes/screen/interface/builder/preview/index.tsx index 80f0a0d8..3854512b 100644 --- a/src/game/scenes/screen/interface/builder/preview/index.tsx +++ b/src/game/scenes/screen/interface/builder/preview/index.tsx @@ -1,4 +1,4 @@ -import { useScene, useSceneUpdate } from 'phaser-react-ui'; +import { Texture, useScene, useSceneUpdate } from 'phaser-react-ui'; import React, { useState } from 'react'; import { BUILDINGS } from '~const/world/entities/buildings'; @@ -6,9 +6,7 @@ import { GameScene } from '~type/game'; import { IWorld } from '~type/world'; import { BuildingVariant } from '~type/world/entities/building'; -import { - Container, Number, Preview, Image, -} from './styles'; +import { Container, Number, Preview } from './styles'; type Props = { number: number @@ -76,7 +74,7 @@ export const BuilderPreview: React.FC = ({ number, variant }) => { > {number} - + ); diff --git a/src/game/scenes/screen/interface/builder/preview/styles.ts b/src/game/scenes/screen/interface/builder/preview/styles.ts index 04009bba..bc06f539 100644 --- a/src/game/scenes/screen/interface/builder/preview/styles.ts +++ b/src/game/scenes/screen/interface/builder/preview/styles.ts @@ -77,7 +77,7 @@ export const Preview = styled.div` overflow: hidden; width: 34px; height: 40px; - img { + img, div[data-texture-container] { height: 100%; } `; @@ -92,5 +92,3 @@ export const Number = styled.div` top: 4px; opacity: 0.75; `; - -export const Image = styled.img``; From db231b266bed8a488dfa14a7bb604df1d20af4a5 Mon Sep 17 00:00:00 2001 From: neki-dev Date: Tue, 26 Sep 2023 16:23:22 +0200 Subject: [PATCH 5/7] Fixed menu label --- .../menu/interface/content/{about => about-game}/index.tsx | 2 +- .../menu/interface/content/{about => about-game}/styles.ts | 0 src/game/scenes/menu/interface/content/index.tsx | 4 ++-- src/game/scenes/menu/interface/navigation/index.tsx | 4 ++-- src/types/menu/menu.ts | 2 +- 5 files changed, 6 insertions(+), 6 deletions(-) rename src/game/scenes/menu/interface/content/{about => about-game}/index.tsx (91%) rename src/game/scenes/menu/interface/content/{about => about-game}/styles.ts (100%) diff --git a/src/game/scenes/menu/interface/content/about/index.tsx b/src/game/scenes/menu/interface/content/about-game/index.tsx similarity index 91% rename from src/game/scenes/menu/interface/content/about/index.tsx rename to src/game/scenes/menu/interface/content/about-game/index.tsx index 357f7ef5..d3ae45b2 100644 --- a/src/game/scenes/menu/interface/content/about/index.tsx +++ b/src/game/scenes/menu/interface/content/about-game/index.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { Wrapper } from './styles'; -export const About: React.FC = () => ( +export const AboutGame: React.FC = () => ( Your task is to survive on chosen planet as many waves as possible.
diff --git a/src/game/scenes/menu/interface/content/about/styles.ts b/src/game/scenes/menu/interface/content/about-game/styles.ts similarity index 100% rename from src/game/scenes/menu/interface/content/about/styles.ts rename to src/game/scenes/menu/interface/content/about-game/styles.ts diff --git a/src/game/scenes/menu/interface/content/index.tsx b/src/game/scenes/menu/interface/content/index.tsx index a4a4256c..f508def9 100644 --- a/src/game/scenes/menu/interface/content/index.tsx +++ b/src/game/scenes/menu/interface/content/index.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { MenuPage } from '~type/menu'; -import { About } from './about'; +import { AboutGame } from './about-game'; import { Controls } from './controls'; import { LoadGame } from './load-game'; import { NewGame } from './new-game'; @@ -19,7 +19,7 @@ const PAGES: Record = { [MenuPage.SAVE_GAME]: SaveGame, [MenuPage.LOAD_GAME]: LoadGame, [MenuPage.SETTINGS]: Settings, - [MenuPage.ABOUT]: About, + [MenuPage.ABOUT_GAME]: AboutGame, [MenuPage.CONTROLS]: Controls, }; diff --git a/src/game/scenes/menu/interface/navigation/index.tsx b/src/game/scenes/menu/interface/navigation/index.tsx index 440ac59e..a2bd67cf 100644 --- a/src/game/scenes/menu/interface/navigation/index.tsx +++ b/src/game/scenes/menu/interface/navigation/index.tsx @@ -49,8 +49,8 @@ export const Navigation: React.FC = ({ page, onSelect }) => { label: 'Settings', page: MenuPage.SETTINGS, }, { - label: 'About', - page: MenuPage.ABOUT, + label: 'About game', + page: MenuPage.ABOUT_GAME, }, { label: 'Controls', page: MenuPage.CONTROLS, diff --git a/src/types/menu/menu.ts b/src/types/menu/menu.ts index b759394f..5cbba683 100644 --- a/src/types/menu/menu.ts +++ b/src/types/menu/menu.ts @@ -10,6 +10,6 @@ export enum MenuPage { LOAD_GAME = 'LOAD_GAME', SAVE_GAME = 'SAVE_GAME', SETTINGS = 'SETTINGS', - ABOUT = 'ABOUT', + ABOUT_GAME = 'ABOUT_GAME', CONTROLS = 'CONTROLS', } From 5be0f3e8e1891e70d46e55e44503640dcf292b69 Mon Sep 17 00:00:00 2001 From: neki-dev Date: Tue, 26 Sep 2023 16:38:00 +0200 Subject: [PATCH 6/7] Updated wave UI --- src/game/scenes/screen/interface/wave/index.tsx | 10 +++++----- src/game/scenes/screen/interface/wave/styles.ts | 15 +++++++++++---- 2 files changed, 16 insertions(+), 9 deletions(-) diff --git a/src/game/scenes/screen/interface/wave/index.tsx b/src/game/scenes/screen/interface/wave/index.tsx index 82c4d94e..60c7094c 100644 --- a/src/game/scenes/screen/interface/wave/index.tsx +++ b/src/game/scenes/screen/interface/wave/index.tsx @@ -23,16 +23,16 @@ export const Wave: React.FC = () => { const [isGoing, setGoing] = useState(false); const [isAlarm, setAlarm] = useState(false); const [isDisabled, setDisabled] = useState(true); + const [isPaused, setPaused] = useState(true); useSceneUpdate(world, () => { - const currentIsDisabled = world.wave.isPeaceMode || world.isTimePaused(); + setDisabled(world.wave.isPeaceMode); - setDisabled(currentIsDisabled); - - if (currentIsDisabled) { + if (world.wave.isPeaceMode) { return; } + setPaused(world.isTimePaused()); setCurrentNumber(world.wave.number); setGoing(world.wave.isGoing); @@ -54,7 +54,7 @@ export const Wave: React.FC = () => { ) : ( - {currentNumber} + {isPaused ? '||' : currentNumber} {value} diff --git a/src/game/scenes/screen/interface/wave/styles.ts b/src/game/scenes/screen/interface/wave/styles.ts index 5cbd20d4..15666316 100644 --- a/src/game/scenes/screen/interface/wave/styles.ts +++ b/src/game/scenes/screen/interface/wave/styles.ts @@ -28,16 +28,23 @@ export const Container = styled.div` `; export const CurrentNumber = styled.div<{ + $paused?: boolean $going?: boolean }>` font-size: 24px; line-height: 24px; padding: 6px 17px 10px 17px; border-radius: 3px; - background: ${(props) => (props.$going - ? InterfaceBackgroundColor.ERROR - : InterfaceBackgroundColor.SUCCESS - )}; + background: ${(props) => { + if (props.$paused) { + return InterfaceBackgroundColor.WARN; + } + if (props.$going) { + return InterfaceBackgroundColor.ERROR; + } + + return InterfaceBackgroundColor.SUCCESS; + }}; box-shadow: 0 20px 0 ${InterfaceBackgroundColor.WHITE_TRANSPARENT_15} inset; `; From 47c662e201d902782b1c236c9d0c6b83c4818b50 Mon Sep 17 00:00:00 2001 From: neki-dev Date: Tue, 26 Sep 2023 16:41:49 +0200 Subject: [PATCH 7/7] (Update version) --- package-lock.json | 4 ++-- package.json | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/package-lock.json b/package-lock.json index 81208017..9b8f90b3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "izowave", - "version": "1.8.0", + "version": "1.8.1", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "izowave", - "version": "1.8.0", + "version": "1.8.1", "license": "GNU", "dependencies": { "gen-biome": "2.4.0", diff --git a/package.json b/package.json index c33cafe6..9cc65c11 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "izowave", "description": "Isometric game. Build and defense in open world", - "version": "1.8.0", + "version": "1.8.1", "keywords": [ "game", "isometric",