From c057f70c45654903be3a4892880caf443f97dd6a Mon Sep 17 00:00:00 2001 From: NewHappyRabbit <31893343+NewHappyRabbit@users.noreply.github.com> Date: Wed, 26 Feb 2025 21:26:42 +0200 Subject: [PATCH] UI fixes --- .prettierignore | 1 + resources/icons/discord.svg | 1 + src/client/graphics/layers/ControlPanel.ts | 2 +- src/client/graphics/layers/EventsDisplay.ts | 2 +- src/client/graphics/layers/Leaderboard.ts | 3 ++- src/client/graphics/layers/OptionsMenu.ts | 2 +- src/client/graphics/layers/TopBar.ts | 21 +++++++++++++++++++-- src/client/graphics/layers/WinModal.ts | 4 +++- src/client/index.html | 7 ++++++- src/core/Util.ts | 3 +-- 10 files changed, 36 insertions(+), 10 deletions(-) create mode 100644 resources/icons/discord.svg diff --git a/.prettierignore b/.prettierignore index 584bf56da..bd18bc5b8 100644 --- a/.prettierignore +++ b/.prettierignore @@ -4,6 +4,7 @@ *.jpg *.jpeg *.gif +*.svg *.webp *.txt .prettierignore diff --git a/resources/icons/discord.svg b/resources/icons/discord.svg new file mode 100644 index 000000000..92411200f --- /dev/null +++ b/resources/icons/discord.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/client/graphics/layers/ControlPanel.ts b/src/client/graphics/layers/ControlPanel.ts index aeb98896b..1286c97d2 100644 --- a/src/client/graphics/layers/ControlPanel.ts +++ b/src/client/graphics/layers/ControlPanel.ts @@ -190,7 +190,7 @@ export class ControlPanel extends LitElement implements Layer {
e.preventDefault()} > diff --git a/src/client/graphics/layers/EventsDisplay.ts b/src/client/graphics/layers/EventsDisplay.ts index 59fb911d8..4c10dcd23 100644 --- a/src/client/graphics/layers/EventsDisplay.ts +++ b/src/client/graphics/layers/EventsDisplay.ts @@ -405,7 +405,7 @@ export class EventsDisplay extends LitElement implements Layer {
diff --git a/src/client/graphics/layers/Leaderboard.ts b/src/client/graphics/layers/Leaderboard.ts index 95c6b9789..b1cdc8317 100644 --- a/src/client/graphics/layers/Leaderboard.ts +++ b/src/client/graphics/layers/Leaderboard.ts @@ -219,7 +219,8 @@ export class Leaderboard extends LitElement implements Layer { @media (max-width: 1000px) { .leaderboard { - top: 60px; + top: 70px; + left: 0px; } .leaderboard-button { diff --git a/src/client/graphics/layers/OptionsMenu.ts b/src/client/graphics/layers/OptionsMenu.ts index 80b375f28..e52772870 100644 --- a/src/client/graphics/layers/OptionsMenu.ts +++ b/src/client/graphics/layers/OptionsMenu.ts @@ -127,7 +127,7 @@ export class OptionsMenu extends LitElement implements Layer { @contextmenu=${(e) => e.preventDefault()} >
${button({ diff --git a/src/client/graphics/layers/TopBar.ts b/src/client/graphics/layers/TopBar.ts index fdf8f32b5..682dc4934 100644 --- a/src/client/graphics/layers/TopBar.ts +++ b/src/client/graphics/layers/TopBar.ts @@ -8,6 +8,9 @@ import { renderNumber, renderTroops } from "../../Utils"; export class TopBar extends LitElement implements Layer { public game: GameView; private isVisible = false; + private _population = 0; + private _lastPopulationIncreaseRate = 0; + private _popRateIsIncreasing = false; createRenderRoot() { return this; @@ -19,6 +22,15 @@ export class TopBar extends LitElement implements Layer { } tick() { + if (this.game?.myPlayer() !== null) { + const popIncreaseRate = + this.game.myPlayer().population() - this._population; + if (this.game.ticks() % 5 == 0) { + this._popRateIsIncreasing = + popIncreaseRate >= this._lastPopulationIncreaseRate; + this._lastPopulationIncreaseRate = popIncreaseRate; + } + } this.requestUpdate(); } @@ -38,7 +50,7 @@ export class TopBar extends LitElement implements Layer { return html`
${renderTroops(myPlayer.population())} / ${renderTroops(maxPop)} - (+${renderTroops(popRate)}) + (+${renderTroops(popRate)})
Like the game? Help make this my full-time project! Support the game! diff --git a/src/client/index.html b/src/client/index.html index e9163a782..1b65764b1 100644 --- a/src/client/index.html +++ b/src/client/index.html @@ -174,8 +174,13 @@
+ Discord Join the Discord!
diff --git a/src/core/Util.ts b/src/core/Util.ts index 5fbd32554..82be316dc 100644 --- a/src/core/Util.ts +++ b/src/core/Util.ts @@ -208,13 +208,12 @@ export function getMode(list: Set): number { export function sanitize(name: string): string { return Array.from(name) .join("") - .replace(/[^\p{L}\p{N}\s\p{Emoji}\p{Emoji_Component}\[\]]/gu, ""); + .replace(/[^\p{L}\p{N}\s\p{Emoji}\p{Emoji_Component}\[\]_]/gu, ""); } export function processName(name: string): string { // First sanitize the raw input - strip everything except text and emojis const sanitizedName = sanitize(name); - // Process emojis with twemoji const withEmojis = twemoji.parse(sanitizedName, { base: "https://cdn.jsdelivr.net/gh/twitter/twemoji@14.0.2/assets/",