alois/OpenFrontIO
1
0
Fork 0
mirror of https://github.com/openfrontio/OpenFrontIO.git synced 2026-06-22 18:46:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

Enable the Enable max-len and max-lines eslint rules (#1842)

Browse Source 
## Description:

Enable the Enable `max-len` and `max-lines` eslint rules.

Fixes #1785

## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [x] I have added relevant tests to the test directory
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced
This commit is contained in:
Scott Anderson
2025-08-17 04:31:15 -04:00
committed by GitHub
parent e9f29be93c
commit 0befdcd90a
37 changed files with 191 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/client/FlagInput.ts
+5 -2
View File
@@ -56,12 +56,15 @@ export class FlagInput extends LitElement {
<div class="flex relative">
<button
id="flag-input_"
class="border p-[4px] rounded-lg flex cursor-pointer border-black/30 dark:border-gray-300/60 bg-white/70 dark:bg-[rgba(55,65,81,0.7)]"
class="border p-[4px] rounded-lg flex cursor-pointer border-black/30
dark:border-gray-300/60 bg-white/70 dark:bg-[rgba(55,65,81,0.7)]"
title="Pick a flag!"
>
<span
id="flag-preview"
style="display:inline-block;width:48px;height:64px;vertical-align:middle;background:#333;border-radius:6px;overflow:hidden;"
style="display:inline-block; width:48px; height:64px;
vertical-align:middle; background:#333; border-radius:6px;
overflow:hidden;"
></span>
</button>
</div>
src/client/FlagInputModal.ts
+4 -1
View File
@@ -19,7 +19,10 @@ export class FlagInputModal extends LitElement {
return html`
<o-modal title="Flag Selector Modal" alwaysMaximized>
<input
class="h-[2rem] border-none text-center border border-gray-300 rounded-xl shadow-sm text-2xl text-center focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-black dark:border-gray-300/60 dark:bg-gray-700 dark:text-white"
class="h-[2rem] border-none text-center border border-gray-300
rounded-xl shadow-sm text-2xl text-center focus:outline-none
focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-black
dark:border-gray-300/60 dark:bg-gray-700 dark:text-white"
type="text"
placeholder="Search..."
@change=${this.handleSearch}
src/client/HostLobbyModal.ts
+21 -3
View File
@@ -1,3 +1,4 @@
/* eslint-disable max-lines */
import { LitElement, html } from "lit";
import { customElement, query, state } from "lit/decorators.js";
import randomMap from "../../resources/images/RandomMap.webp";
@@ -100,7 +101,13 @@ export class HostLobbyModal extends LitElement {
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M256 105c-101.8 0-188.4 62.7-224 151 35.6 88.3 122.2 151 224 151s188.4-62.7 224-151c-35.6-88.3-122.2-151-224-151zm0 251.7c-56 0-101.7-45.7-101.7-101.7S200 153.3 256 153.3 357.7 199 357.7 255 312 356.7 256 356.7zm0-161.1c-33 0-59.4 26.4-59.4 59.4s26.4 59.4 59.4 59.4 59.4-26.4 59.4-59.4-26.4-59.4-59.4-59.4z"
d="M256 105c-101.8 0-188.4 62.7-224 151 35.6 88.3 122.2
151 224 151s188.4-62.7
224-151c-35.6-88.3-122.2-151-224-151zm0 251.7c-56
0-101.7-45.7-101.7-101.7S200 153.3 256 153.3 357.7 199
357.7 255 312 356.7 256 356.7zm0-161.1c-33 0-59.4
26.4-59.4 59.4s26.4 59.4 59.4 59.4 59.4-26.4
59.4-59.4-26.4-59.4-59.4-59.4z"
></path>
</svg>`
: html`<svg
@@ -155,7 +162,16 @@ export class HostLobbyModal extends LitElement {
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M296 48H176.5C154.4 48 136 65.4 136 87.5V96h-7.5C106.4 96 88 113.4 88 135.5v288c0 22.1 18.4 40.5 40.5 40.5h208c22.1 0 39.5-18.4 39.5-40.5V416h8.5c22.1 0 39.5-18.4 39.5-40.5V176L296 48zm0 44.6l83.4 83.4H296V92.6zm48 330.9c0 4.7-3.4 8.5-7.5 8.5h-208c-4.4 0-8.5-4.1-8.5-8.5v-288c0-4.1 3.8-7.5 8.5-7.5h7.5v255.5c0 22.1 10.4 32.5 32.5 32.5H344v7.5zm48-48c0 4.7-3.4 8.5-7.5 8.5h-208c-4.4 0-8.5-4.1-8.5-8.5v-288c0-4.1 3.8-7.5 8.5-7.5H264v128h128v167.5z"
d="M296 48H176.5C154.4 48 136 65.4 136
87.5V96h-7.5C106.4 96 88 113.4 88 135.5v288c0 22.1
18.4 40.5 40.5 40.5h208c22.1 0 39.5-18.4
39.5-40.5V416h8.5c22.1 0 39.5-18.4 39.5-40.5V176L296
48zm0 44.6l83.4 83.4H296V92.6zm48 330.9c0 4.7-3.4
8.5-7.5 8.5h-208c-4.4 0-8.5-4.1-8.5-8.5v-288c0-4.1
3.8-7.5 8.5-7.5h7.5v255.5c0 22.1 10.4 32.5 32.5
32.5H344v7.5zm48-48c0 4.7-3.4 8.5-7.5 8.5h-208c-4.4
0-8.5-4.1-8.5-8.5v-288c0-4.1 3.8-7.5
8.5-7.5H264v128h128v167.5z"
></path>
</svg>
`
@@ -678,7 +694,9 @@ export class HostLobbyModal extends LitElement {
await this.putGameConfig();
console.log(
`Starting private game with map: ${GameMapType[this.selectedMap as keyof typeof GameMapType]} ${this.useRandomMap ? " (Randomly selected)" : ""}`,
`Starting private game with map: ${
GameMapType[this.selectedMap as keyof typeof GameMapType]} ${
this.useRandomMap ? " (Randomly selected)" : ""}`,
);
this.close();
const config = await getServerConfigFromClient();
src/client/JoinPrivateLobbyModal.ts
+7 -1
View File
@@ -67,7 +67,13 @@ export class JoinPrivateLobbyModal extends LitElement {
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M 15 3 C 13.742188 3 12.847656 3.890625 12.40625 5 L 5 5 L 5 28 L 13 28 L 13 30 L 27 30 L 27 14 L 25 14 L 25 5 L 17.59375 5 C 17.152344 3.890625 16.257813 3 15 3 Z M 15 5 C 15.554688 5 16 5.445313 16 6 L 16 7 L 19 7 L 19 9 L 11 9 L 11 7 L 14 7 L 14 6 C 14 5.445313 14.445313 5 15 5 Z M 7 7 L 9 7 L 9 11 L 21 11 L 21 7 L 23 7 L 23 14 L 13 14 L 13 26 L 7 26 Z M 15 16 L 25 16 L 25 28 L 15 28 Z"
d="M 15 3 C 13.742188 3 12.847656 3.890625 12.40625 5 L 5 5 L 5
28 L 13 28 L 13 30 L 27 30 L 27 14 L 25 14 L 25 5 L 17.59375 5
C 17.152344 3.890625 16.257813 3 15 3 Z M 15 5 C 15.554688 5 16
5.445313 16 6 L 16 7 L 19 7 L 19 9 L 11 9 L 11 7 L 14 7 L 14 6
C 14 5.445313 14.445313 5 15 5 Z M 7 7 L 9 7 L 9 11 L 21 11 L
21 7 L 23 7 L 23 14 L 13 14 L 13 26 L 7 26 Z M 15 16 L 25 16 L
25 28 L 15 28 Z"
></path>
</svg>
</button>
src/client/LangSelector.ts
+6 -1
View File
@@ -303,7 +303,12 @@ export class LangSelector extends LitElement {
<button
id="lang-selector"
@click=${this.openModal}
class="text-center appearance-none w-full bg-blue-100 dark:bg-gray-700 hover:bg-blue-200 dark:hover:bg-gray-600 text-blue-900 dark:text-gray-100 p-3 sm:p-4 lg:p-5 font-medium text-sm sm:text-base lg:text-lg rounded-md border-none cursor-pointer transition-colors duration-300 flex items-center gap-2 justify-center"
class="text-center appearance-none w-full bg-blue-100
dark:bg-gray-700 hover:bg-blue-200 dark:hover:bg-gray-600
text-blue-900 dark:text-gray-100 p-3 sm:p-4 lg:p-5 font-medium
text-sm sm:text-base lg:text-lg rounded-md border-none cursor-pointer
transition-colors duration-300 flex items-center gap-2
justify-center"
>
<img
id="lang-flag"
src/client/LanguageModal.ts
+5 -2
View File
@@ -95,13 +95,16 @@ export class LanguageModal extends LitElement {
if (isDebug) {
buttonClasses +=
" animate-pulse font-bold text-white border-2 border-dashed border-cyan-400 shadow-lg shadow-cyan-400/25 bg-gradient-to-r from-red-600 via-yellow-600 via-green-600 via-blue-600 to-purple-600";
" animate-pulse font-bold text-white border-2 border-dashed border-cyan-400 shadow-lg" +
" shadow-cyan-400/25 bg-gradient-to-r from-red-600 via-yellow-600 via-green-600 via-blue-600" +
" to-purple-600";
} else if (isActive) {
buttonClasses +=
" bg-gray-400 dark:bg-gray-500 border-gray-300 dark:border-gray-400 text-black dark:text-white";
} else {
buttonClasses +=
" bg-gray-600 dark:bg-gray-700 border-gray-500 dark:border-gray-600 text-white dark:text-gray-100 hover:bg-gray-500 dark:hover:bg-gray-600";
" bg-gray-600 dark:bg-gray-700 border-gray-500 dark:border-gray-600 text-white dark:text-gray-100" +
" hover:bg-gray-500 dark:hover:bg-gray-600";
}
return html`
src/client/LocalServer.ts
+4 -1
View File
@@ -117,7 +117,10 @@ export class LocalServer {
}
if (archivedHash !== clientMsg.hash) {
console.error(
`desync detected on turn ${clientMsg.turnNumber}, client hash: ${clientMsg.hash}, server hash: ${archivedHash}`,
`desync detected on turn ${
clientMsg.turnNumber}, client hash: ${
clientMsg.hash}, server hash: ${
archivedHash}`,
);
this.clientMessage({
type: "desync",
src/client/PublicLobby.ts
+8 -7
View File
@@ -121,13 +121,14 @@ export class PublicLobby extends LitElement {
<button
@click=${() => this.lobbyClicked(lobby)}
?disabled=${this.isButtonDebounced}
class="isolate grid h-40 grid-cols-[100%] grid-rows-[100%] place-content-stretch w-full overflow-hidden ${this
.isLobbyHighlighted
? "bg-gradient-to-r from-green-600 to-green-500"
: "bg-gradient-to-r from-blue-600 to-blue-500"} text-white font-medium rounded-xl transition-opacity duration-200 hover:opacity-90 ${this
.isButtonDebounced
? "opacity-70 cursor-not-allowed"
: ""}"
class="isolate grid h-40 grid-cols-[100%] grid-rows-[100%] place-content-stretch w-full overflow-hidden ${
this.isLobbyHighlighted
? "bg-gradient-to-r from-green-600 to-green-500"
: "bg-gradient-to-r from-blue-600 to-blue-500"
} text-white font-medium rounded-xl transition-opacity duration-200 hover:opacity-90 ${
this.isButtonDebounced
? "opacity-70 cursor-not-allowed"
: ""}"
>
${mapImageSrc
? html`<img
src/client/SinglePlayerModal.ts
+2 -1
View File
@@ -410,7 +410,8 @@ export class SinglePlayerModal extends LitElement {
}
console.log(
`Starting single player game with map: ${GameMapType[this.selectedMap as keyof typeof GameMapType]}${this.useRandomMap ? " (Randomly selected)" : ""}`,
`Starting single player game with map: ${GameMapType[this.selectedMap as keyof typeof GameMapType]
}${this.useRandomMap ? " (Randomly selected)" : ""}`,
);
const clientID = generateID();
const gameID = generateID();
src/client/TerritoryPatternsModal.ts
+2 -1
View File
@@ -165,7 +165,8 @@ export class TerritoryPatternsModal extends LitElement {
${pattern.product !== null
? html`
<button
class="w-full mt-2 px-3 py-1 bg-green-500 hover:bg-green-600 text-white text-xs font-medium rounded transition-colors"
class="w-full mt-2 px-3 py-1 bg-green-500 hover:bg-green-600
text-white text-xs font-medium rounded transition-colors"
@click=${(e: Event) => {
e.stopPropagation();
handlePurchase(pattern.product!.priceId);
src/client/UsernameInput.ts
+7 -2
View File
@@ -43,12 +43,17 @@ export class UsernameInput extends LitElement {
@change=${this.handleChange}
placeholder="${translateText("username.enter_username")}"
maxlength="${MAX_USERNAME_LENGTH}"
class="w-full px-4 py-2 border border-gray-300 rounded-xl shadow-sm text-2xl text-center focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 dark:border-gray-300/60 dark:bg-gray-700 dark:text-white"
class="w-full px-4 py-2 border border-gray-300 rounded-xl shadow-sm
text-2xl text-center focus:outline-none focus:ring-2
focus:ring-blue-500 focus:border-blue-500 dark:border-gray-300/60
dark:bg-gray-700 dark:text-white"
/>
${this.validationError
? html`<div
id="username-validation-error"
class="absolute z-10 w-full mt-2 px-3 py-1 text-lg border rounded bg-white text-red-600 border-red-600 dark:bg-gray-700 dark:text-red-300 dark:border-red-300"
class="absolute z-10 w-full mt-2 px-3 py-1 text-lg border rounded
bg-white text-red-600 border-red-600 dark:bg-gray-700
dark:text-red-300 dark:border-red-300"
>
${this.validationError}
</div>`
src/client/components/Difficulties.ts
+2
View File
@@ -67,6 +67,7 @@ export class DifficultyDisplay extends LitElement {
<circle cx="9" cy="12" r="1"></circle>
</svg>`;
/* eslint-disable max-len */
const burningSkull = html`<svg
stroke="currentColor"
fill="currentColor"
@@ -109,6 +110,7 @@ export class DifficultyDisplay extends LitElement {
d="M11.07 12.85c.77-1.39 2.25-2.21 3.11-3.44.91-1.29.4-3.7-2.18-3.7-1.69 0-2.52 1.28-2.87 2.34L6.54 6.96C7.25 4.83 9.18 3 11.99 3c2.35 0 3.96 1.07 4.78 2.41.7 1.15 1.11 3.3.03 4.9-1.2 1.77-2.35 2.31-2.97 3.45-.25.46-.35.76-.35 2.24h-2.89c-.01-.78-.13-2.05.48-3.15zM14 20c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2z"
></path>
</svg>`;
/* eslint-enable max-len */
switch (difficultyKey) {
case "Easy":
src/client/components/NewsButton.ts
+2 -1
View File
@@ -44,7 +44,8 @@ export class NewsButton extends LitElement {
: ""}"
>
<button
class="border p-[4px] rounded-lg flex cursor-pointer border-black/30 dark:border-gray-300/60 bg-white/70 dark:bg-[rgba(55,65,81,0.7)]"
class="border p-[4px] rounded-lg flex cursor-pointer border-black/30
dark:border-gray-300/60 bg-white/70 dark:bg-[rgba(55,65,81,0.7)]"
@click=${this.handleClick}
>
<img
src/client/graphics/layers/ChatDisplay.ts
+4 -3
View File
@@ -125,9 +125,10 @@ export class ChatDisplay extends LitElement implements Layer {
}
return html`
<div
class="${this._hidden
? "w-fit px-[10px] py-[5px]"
: ""} rounded-md bg-black bg-opacity-60 relative max-h-[30vh] flex flex-col-reverse overflow-y-auto w-full lg:bottom-2.5 lg:right-2.5 z-50 lg:max-w-[30vw] lg:w-full lg:w-auto"
class="${this._hidden ? "w-fit px-[10px] py-[5px]" : ""} rounded-md
bg-black bg-opacity-60 relative max-h-[30vh] flex flex-col-reverse
overflow-y-auto w-full lg:bottom-2.5 lg:right-2.5 z-50 lg:max-w-[30vw]
lg:w-full lg:w-auto"
style="pointer-events: auto"
>
<div>
src/client/graphics/layers/ControlPanel.ts
+2 -1
View File
@@ -162,7 +162,8 @@ export class ControlPanel extends LitElement implements Layer {
</style>
<div
class="${this._isVisible
? "w-full sm:max-w-[320px] text-sm sm:text-base bg-gray-800/70 p-2 pr-3 sm:p-4 shadow-lg sm:rounded-lg backdrop-blur"
? "w-full sm:max-w-[320px] text-sm sm:text-base bg-gray-800/70 p-2 " +
"pr-3 sm:p-4 shadow-lg sm:rounded-lg backdrop-blur"
: "hidden"}"
@contextmenu=${(e: MouseEvent) => e.preventDefault()}
>
src/client/graphics/layers/EmojiTable.ts
+14 -9
View File
@@ -64,16 +64,17 @@ export class EmojiTable extends LitElement {
return html`
<div
class="bg-slate-800 max-w-[95vw] max-h-[95vh] pt-[15px] pb-[15px] fixed flex flex-col -translate-x-1/2 -translate-y-1/2
items-center rounded-[10px] z-[9999] top-[50%] left-[50%] justify-center"
class="bg-slate-800 max-w-[95vw] max-h-[95vh] pt-[15px] pb-[15px] fixed
flex flex-col -translate-x-1/2 -translate-y-1/2 items-center
rounded-[10px] z-[9999] top-[50%] left-[50%] justify-center"
@contextmenu=${(e: MouseEvent) => e.preventDefault()}
@wheel=${(e: WheelEvent) => e.stopPropagation()}
>
<!-- Close button -->
<button
class="absolute -top-2 -right-2 w-6 h-6 flex items-center justify-center
bg-red-500 hover:bg-red-900 text-white rounded-full
text-sm font-bold transition-colors"
class="absolute -top-2 -right-2 w-6 h-6 flex items-center
justify-center bg-red-500 hover:bg-red-900 text-white rounded-full
text-sm font-bold transition-colors"
@click=${this.hideTable}
>
✕
@@ -88,10 +89,14 @@ export class EmojiTable extends LitElement {
${row.map(
(emoji) => html`
<button
class="flex transition-transform duration-300 ease justify-center items-center cursor-pointer
border border-solid border-slate-500 rounded-[12px] bg-slate-700 hover:bg-slate-600 active:bg-slate-500
md:m-[8px] md:text-[60px] md:w-[80px] md:h-[80px] hover:scale-[1.1] active:scale-[0.95]
sm:w-[60px] sm:h-[60px] sm:text-[32px] sm:m-[5px] text-[28px] w-[50px] h-[50px] m-[3px]"
class="flex transition-transform duration-300 ease
justify-center items-center cursor-pointer border
border-solid border-slate-500 rounded-[12px]
bg-slate-700 hover:bg-slate-600 active:bg-slate-500
md:m-[8px] md:text-[60px] md:w-[80px] md:h-[80px]
hover:scale-[1.1] active:scale-[0.95] sm:w-[60px]
sm:h-[60px] sm:text-[32px] sm:m-[5px] text-[28px]
w-[50px] h-[50px] m-[3px]"
@click=${() => this.onEmojiClicked(emoji)}
>
${emoji}
src/client/graphics/layers/EventsDisplay.ts
+10 -3
View File
@@ -1,3 +1,4 @@
/* eslint-disable max-lines */
import { html, LitElement, TemplateResult } from "lit";
import { customElement, state } from "lit/decorators.js";
import { DirectiveResult } from "lit/directive.js";
@@ -918,7 +919,8 @@ export class EventsDisplay extends LitElement implements Layer {
`,
onClick: this.toggleHidden,
className:
"text-white cursor-pointer pointer-events-auto w-fit p-2 lg:p-3 rounded-md bg-gray-800/70 backdrop-blur",
"text-white cursor-pointer pointer-events-auto w-fit p-2 " +
"lg:p-3 rounded-md bg-gray-800/70 backdrop-blur",
})}
</div>
`
@@ -1015,7 +1017,9 @@ export class EventsDisplay extends LitElement implements Layer {
<!-- Content Area -->
<div
class="rounded-b-none md:rounded-b-md bg-gray-800/70 max-h-[30vh] flex flex-col-reverse overflow-y-auto w-full h-full"
class="rounded-b-none md:rounded-b-md bg-gray-800/70
max-h-[30vh] flex flex-col-reverse overflow-y-auto w-full
h-full"
>
<div>
<table
@@ -1059,7 +1063,10 @@ export class EventsDisplay extends LitElement implements Layer {
${event.buttons.map(
(btn) => html`
<button
class="inline-block px-3 py-1 text-white rounded text-md md:text-sm cursor-pointer transition-colors duration-300
class="inline-block px-3 py-1
text-white rounded text-md
md:text-sm cursor-pointer
transition-colors duration-300
${btn.className.includes("btn-info")
? "bg-blue-500 hover:bg-blue-600"
: btn.className.includes(
src/client/graphics/layers/GameLeftSidebar.ts
+5 -3
View File
@@ -87,9 +87,11 @@ export class GameLeftSidebar extends LitElement implements Layer {
render() {
return html`
<aside
class=${`fixed top-[20px] left-0 z-[1000] flex flex-col max-h-[calc(100vh-80px)] overflow-y-auto p-2 bg-slate-800/40 backdrop-blur-sm shadow-xs rounded-tr-lg rounded-br-lg transition-transform duration-300 ease-out transform ${
this.isVisible ? "translate-x-0" : "-translate-x-full"
}`}
class=${`fixed top-[20px] left-0 z-[1000] flex flex-col
max-h-[calc(100vh-80px)] overflow-y-auto p-2 bg-slate-800/40
backdrop-blur-sm shadow-xs rounded-tr-lg rounded-br-lg
transition-transform duration-300 ease-out transform
${this.isVisible ? "translate-x-0" : "-translate-x-full"}`}
>
${this.isPlayerTeamLabelVisible
? html`
src/client/graphics/layers/GameRightSidebar.ts
+7 -4
View File
@@ -109,9 +109,10 @@ export class GameRightSidebar extends LitElement implements Layer {
return html`
<aside
class=${`flex flex-col max-h-[calc(100vh-80px)] overflow-y-auto p-2 bg-gray-800/70 backdrop-blur-sm shadow-xs rounded-tl-lg rounded-bl-lg transition-transform duration-300 ease-out transform ${
this._isVisible ? "translate-x-0" : "translate-x-full"
}`}
class=${`flex flex-col max-h-[calc(100vh-80px)] overflow-y-auto p-2
bg-gray-800/70 backdrop-blur-sm shadow-xs rounded-tl-lg rounded-bl-lg
transition-transform duration-300 ease-out transform
${this._isVisible ? "translate-x-0" : "translate-x-full"}`}
@contextmenu=${(e: Event) => e.preventDefault()}
>
<div
@@ -139,7 +140,9 @@ export class GameRightSidebar extends LitElement implements Layer {
<!-- Timer display below buttons -->
<div class="flex justify-center items-center mt-2">
<div
class="w-[70px] h-8 lg:w-24 lg:h-10 border border-slate-400 p-0.5 text-xs md:text-sm lg:text-base flex items-center justify-center text-white px-1"
class="w-[70px] h-8 lg:w-24 lg:h-10 border border-slate-400 p-0.5
text-xs md:text-sm lg:text-base flex items-center justify-center
text-white px-1"
>
${this.secondsToHms(this.timer)}
</div>
src/client/graphics/layers/GutterAdModal.ts
+6 -2
View File
@@ -136,7 +136,9 @@ export class GutterAdModal extends LitElement implements Layer {
return html`
<!-- Left Gutter Ad -->
<div
class="hidden xl:flex fixed left-0 top-1/2 transform -translate-y-1/2 w-[160px] min-h-[600px] z-[10] pointer-events-auto items-center justify-center"
class="hidden xl:flex fixed left-0 top-1/2 transform -translate-y-1/2
w-[160px] min-h-[600px] z-[10] pointer-events-auto items-center
justify-center"
style="margin-left: ${this.margin};"
>
<div
@@ -147,7 +149,9 @@ export class GutterAdModal extends LitElement implements Layer {
<!-- Right Gutter Ad -->
<div
class="hidden xl:flex fixed right-0 top-1/2 transform -translate-y-1/2 w-[160px] min-h-[600px] z-[10] pointer-events-auto items-center justify-center"
class="hidden xl:flex fixed right-0 top-1/2 transform -translate-y-1/2
w-[160px] min-h-[600px] z-[10] pointer-events-auto items-center
justify-center"
style="margin-right: ${this.margin};"
>
<div
src/client/graphics/layers/Leaderboard.ts
+3 -1
View File
@@ -255,7 +255,9 @@ export class Leaderboard extends LitElement implements Layer {
</div>
<button
class="mt-1 px-1.5 py-0.5 md:px-2 md:py-0.5 text-xs md:text-xs lg:text-sm border border-white/20 hover:bg-white/10 text-white mx-auto block"
class="mt-1 px-1.5 py-0.5 md:px-2 md:py-0.5 text-xs md:text-xs
lg:text-sm border border-white/20 hover:bg-white/10 text-white mx-auto
block"
@click=${() => {
this.showTopFive = !this.showTopFive;
this.updateLeaderboard();
src/client/graphics/layers/MultiTabModal.ts
+2 -1
View File
@@ -121,7 +121,8 @@ export class MultiTabModal extends LitElement implements Layer {
class="fixed inset-0 z-50 overflow-auto bg-red-500/20 flex items-center justify-center"
>
<div
class="relative p-6 bg-white dark:bg-gray-800 rounded-xl shadow-xl max-w-md w-full m-4 transition-all transform"
class="relative p-6 bg-white dark:bg-gray-800 rounded-xl shadow-xl
max-w-md w-full m-4 transition-all transform"
>
<div class="flex items-center justify-between mb-4">
<h2 class="text-2xl font-bold text-red-600 dark:text-red-400">
src/client/graphics/layers/NameLayer.ts
+5 -2
View File
@@ -185,7 +185,9 @@ export class NameLayer implements Layer {
screenPosOld.x - window.innerWidth / 2,
screenPosOld.y - window.innerHeight / 2,
);
this.container.style.transform = `translate(${screenPos.x}px, ${screenPos.y}px) scale(${this.transformHandler.scale})`;
this.container.style.transform =
`translate(${screenPos.x}px, ${screenPos.y}px) ` +
`scale(${this.transformHandler.scale})`;
const now = Date.now();
if (now > this.lastChecked + this.renderCheckRate) {
@@ -609,7 +611,8 @@ export class NameLayer implements Layer {
// Position element with scale
if (render.location && render.location !== oldLocation) {
const scale = Math.min(baseSize * 0.25, 3);
render.element.style.transform = `translate(${render.location.x}px, ${render.location.y}px) translate(-50%, -50%) scale(${scale})`;
render.element.style.transform =
`translate(${render.location.x}px, ${render.location.y}px) translate(-50%, -50%) scale(${scale})`;
}
}
src/client/graphics/layers/OptionsMenu.ts
+3 -1
View File
@@ -205,7 +205,9 @@ export class OptionsMenu extends LitElement implements Layer {
</div>
<div
class="options-menu flex flex-col justify-around gap-y-3 mt-2 bg-opacity-60 bg-gray-900 p-1 lg:p-2 rounded-lg backdrop-blur-md ${!this
class="options-menu flex flex-col justify-around gap-y-3 mt-2
bg-opacity-60 bg-gray-900 p-1 lg:p-2 rounded-lg backdrop-blur-md
${!this
.showSettings
? "hidden"
: ""}"
src/client/graphics/layers/PlayerInfoOverlay.ts
+3 -1
View File
@@ -356,7 +356,9 @@ export class PlayerInfoOverlay extends LitElement implements Layer {
@contextmenu=${(e: MouseEvent) => e.preventDefault()}
>
<div
class="bg-gray-800/70 backdrop-blur-sm shadow-xs rounded-lg shadow-lg transition-all duration-300 text-white text-lg md:text-base ${containerClasses}"
class="bg-gray-800/70 backdrop-blur-sm shadow-xs rounded-lg shadow-lg
transition-all duration-300 text-white text-lg md:text-base
${containerClasses}"
>
${this.player !== null ? this.renderPlayerInfo(this.player) : ""}
${this.unit !== null ? this.renderUnitInfo(this.unit) : ""}
src/client/graphics/layers/RadialMenu.ts
+4 -1
View File
@@ -1,3 +1,4 @@
/* eslint-disable max-lines */
import * as d3 from "d3";
import backIcon from "../../../../resources/images/BackIconWhite.svg";
import { EventBus, GameEvent } from "../../../core/EventBus";
@@ -149,7 +150,9 @@ export class RadialMenu implements Layer {
.style("position", "absolute")
.style("top", "50%")
.style("left", "50%")
.style("transition", `top ${this.config.menuTransitionDuration}ms ease, left ${this.config.menuTransitionDuration}ms ease`)
.style("transition", `top ${
this.config.menuTransitionDuration}ms ease, left ${
this.config.menuTransitionDuration}ms ease`)
.style("transform", "translate(-50%, -50%)")
.style("pointer-events", "all")
.on("click", (event) => this.hideRadialMenu());
src/client/graphics/layers/SettingsModal.ts
+18 -9
View File
@@ -188,7 +188,8 @@ export class SettingsModal extends LitElement implements Layer {
<div class="p-4 space-y-3">
<button
class="flex gap-3 items-center w-full text-left p-3 hover:bg-slate-700 rounded text-white transition-colors"
class="flex gap-3 items-center w-full text-left p-3
hover:bg-slate-700 rounded text-white transition-colors"
@click="${this.onTerrainButtonClick}"
>
<img src=${treeIcon} alt="treeIcon" width="20" height="20" />
@@ -210,7 +211,8 @@ export class SettingsModal extends LitElement implements Layer {
</button>
<button
class="flex gap-3 items-center w-full text-left p-3 hover:bg-slate-700 rounded text-white transition-colors"
class="flex gap-3 items-center w-full text-left p-3
hover:bg-slate-700 rounded text-white transition-colors"
@click="${this.onToggleEmojisButtonClick}"
>
<img src=${emojiIcon} alt="emojiIcon" width="20" height="20" />
@@ -232,7 +234,8 @@ export class SettingsModal extends LitElement implements Layer {
</button>
<button
class="flex gap-3 items-center w-full text-left p-3 hover:bg-slate-700 rounded text-white transition-colors"
class="flex gap-3 items-center w-full text-left p-3
hover:bg-slate-700 rounded text-white transition-colors"
@click="${this.onToggleDarkModeButtonClick}"
>
<img
@@ -259,7 +262,8 @@ export class SettingsModal extends LitElement implements Layer {
</button>
<button
class="flex gap-3 items-center w-full text-left p-3 hover:bg-slate-700 rounded text-white transition-colors"
class="flex gap-3 items-center w-full text-left p-3
hover:bg-slate-700 rounded text-white transition-colors"
@click="${this.onToggleSpecialEffectsButtonClick}"
>
<img
@@ -286,7 +290,8 @@ export class SettingsModal extends LitElement implements Layer {
</button>
<button
class="flex gap-3 items-center w-full text-left p-3 hover:bg-slate-700 rounded text-white transition-colors"
class="flex gap-3 items-center w-full text-left p-3
hover:bg-slate-700 rounded text-white transition-colors"
@click="${this.onToggleStructureSpritesButtonClick}"
>
<img
@@ -313,7 +318,8 @@ export class SettingsModal extends LitElement implements Layer {
</button>
<button
class="flex gap-3 items-center w-full text-left p-3 hover:bg-slate-700 rounded text-white transition-colors"
class="flex gap-3 items-center w-full text-left p-3
hover:bg-slate-700 rounded text-white transition-colors"
@click="${this.onToggleRandomNameModeButtonClick}"
>
<img src=${ninjaIcon} alt="ninjaIcon" width="20" height="20" />
@@ -335,7 +341,8 @@ export class SettingsModal extends LitElement implements Layer {
</button>
<button
class="flex gap-3 items-center w-full text-left p-3 hover:bg-slate-700 rounded text-white transition-colors"
class="flex gap-3 items-center w-full text-left p-3
hover:bg-slate-700 rounded text-white transition-colors"
@click="${this.onToggleLeftClickOpensMenu}"
>
<img src=${mouseIcon} alt="mouseIcon" width="20" height="20" />
@@ -357,7 +364,8 @@ export class SettingsModal extends LitElement implements Layer {
</button>
<button
class="flex gap-3 items-center w-full text-left p-3 hover:bg-slate-700 rounded text-white transition-colors"
class="flex gap-3 items-center w-full text-left p-3
hover:bg-slate-700 rounded text-white transition-colors"
@click="${this.onTogglePerformanceOverlayButtonClick}"
>
<img
@@ -387,7 +395,8 @@ export class SettingsModal extends LitElement implements Layer {
<div class="border-t border-slate-600 pt-3 mt-4">
<button
class="flex gap-3 items-center w-full text-left p-3 hover:bg-red-600/20 rounded text-red-400 transition-colors"
class="flex gap-3 items-center w-full text-left p-3
hover:bg-red-600/20 rounded text-red-400 transition-colors"
@click="${this.onExitButtonClick}"
>
<img src=${exitIcon} alt="exitIcon" width="20" height="20" />
src/client/graphics/layers/SpawnAd.ts
+2 -1
View File
@@ -117,7 +117,8 @@ export class SpawnAd extends LitElement implements Layer {
return html`
<div
class="fixed bottom-0 left-0 w-full min-h-[100px] bg-gray-900 border border-gray-600 flex items-center justify-center z-50"
class="fixed bottom-0 left-0 w-full min-h-[100px] bg-gray-900 border
border-gray-600 flex items-center justify-center z-50"
>
<div
id="${AD_CONTAINER_ID}"
src/client/graphics/layers/UnitDisplay.ts
+3 -1
View File
@@ -104,7 +104,9 @@ export class UnitDisplay extends LitElement implements Layer {
return html`
<div
class="fixed bottom-4 left-1/2 transform -translate-x-1/2 z-[1100] bg-gray-800/70 backdrop-blur-sm border border-slate-400 rounded-lg p-2 hidden lg:block"
class="fixed bottom-4 left-1/2 transform -translate-x-1/2 z-[1100]
bg-gray-800/70 backdrop-blur-sm border border-slate-400 rounded-lg p-2
hidden lg:block"
>
<div class="grid grid-rows-1 auto-cols-max grid-flow-col gap-1">
${this.renderUnitItem(cityIcon, this._cities, UnitType.City, "city")}
src/core/Schemas.ts
+1
View File
@@ -154,6 +154,7 @@ export const TeamSchema = z.string();
const SafeString = z
.string()
.regex(
// eslint-disable-next-line max-len
/^([a-zA-Z0-9\s.,!?@#$%&*()\-_+=[\]{}|;:"'/\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff]|[üÜ])*$/u,
)
.max(1000);
src/core/configuration/DefaultConfig.ts
+1
View File
@@ -1,3 +1,4 @@
/* eslint-disable max-lines */
import { JWK } from "jose";
import { z } from "zod";
import {
src/core/game/GameImpl.ts
+1
View File
@@ -1,3 +1,4 @@
/* eslint-disable max-lines */
import { renderNumber } from "../../client/Utils";
import { Config } from "../configuration/Config";
import { AllPlayersStats, ClientID, Winner } from "../Schemas";
src/core/game/PlayerImpl.ts
+1
View File
@@ -1,3 +1,4 @@
/* eslint-disable max-lines */
import { renderNumber, renderTroops } from "../../client/Utils";
import { PseudoRandom } from "../PseudoRandom";
import { ClientID } from "../Schemas";
src/core/game/TerrainMapLoader.ts
+2 -1
View File
@@ -66,7 +66,8 @@ export async function genTerrainFromBin(
): Promise<GameMap> {
if (data.length !== mapData.width * mapData.height) {
throw new Error(
`Invalid data: buffer size ${data.length} incorrect for ${mapData.width}x${mapData.height} terrain plus 4 bytes for dimensions.`,
`Invalid data: buffer size ${data.length} incorrect for ${mapData.width}x${mapData.height
} terrain plus 4 bytes for dimensions.`,
);
}
src/server/Worker.ts
+13 -1
View File
@@ -133,7 +133,19 @@ export async function startWorker() {
const game = gm.createGame(id, gc, creatorClientID);
log.info(
`Worker ${workerId}: IP ${ipAnonymize(clientIP)} creating ${game.isPublic() ? "Public" : "Private"}${gc?.gameMode ? ` ${gc.gameMode}` : ""} game with id ${id}${creatorClientID ? `, creator: ${creatorClientID}` : ""}`,
`Worker ${
workerId
}: IP ${
ipAnonymize(clientIP)
} creating ${
game.isPublic() ? "Public" : "Private"
}${
gc?.gameMode ? ` ${gc.gameMode}` : ""
} game with id ${
id
}${
creatorClientID ? `, creator: ${creatorClientID}` : ""
}`,
);
res.json(game.gameInfo());
}),
src/server/worker/websocket/handler/message/PreJoinHandler.ts
+3 -1
View File
@@ -121,7 +121,9 @@ async function handleJoinMessage(
const expectedWorkerId = config.workerIndex(clientMsg.gameID);
if (expectedWorkerId !== workerId) {
log.warn(
`Worker mismatch: Game ${clientMsg.gameID} should be on worker ${expectedWorkerId}, but this is worker ${workerId}`,
`Worker mismatch: Game ${clientMsg.gameID
} should be on worker ${expectedWorkerId
}, but this is worker ${workerId}`,
);
return;
}