mirror of
https://github.com/openfrontio/OpenFrontIO.git
synced 2026-07-10 14:44:37 +00:00
Evan Pelle
a7f992e9b0
Restructure the single src/ tree into an npm-workspaces monorepo under
packages/, rename core -> engine, extract a types-only core-public layer,
and break the pre-existing engine -> client dependency cycle.
Structure (packages/):
core-public public API/wire schemas + shared enums (clean leaf)
shared framework-agnostic helpers (clean leaf)
engine deterministic simulation (was src/core)
client rendering/UI (was src/client)
server coordination (was src/server)
Dependency DAG: engine -> {core-public, shared}; client -> {core-public,
shared, engine}; server -> {core-public, engine}.
- npm workspaces: root package.json workspaces + per-package package.json;
tsconfig.base.json holds shared options + path aliases
(core-public/* shared/* engine/* client/* server/*) resolved uniformly by
tsc, Vite (resolve.tsconfigPaths), Vitest, and tsx. Lockfile regenerated.
- core-public: moved Schemas/ApiSchemas/CosmeticSchemas/StatsSchemas/
ClanApiSchemas/WorkerSchemas/Base64/PatternDecoder; extracted the enums
(GameTypes), GameEvent type, emoji table, and GraphicsOverrides schema.
Engine re-exports the moved enums/types so existing imports keep working.
- Broke engine -> client cycle:
- renderNumber/renderTroops -> shared/format
- NameBoxCalculator moved into engine
- username validation returns translation key + params; client translates
- applyStateUpdate moved to client (operates on the render-only PlayerState)
- Config/UnitGrid/execution-Util/GameImpl now use structural read
interfaces (engine/game/ReadViews: PlayerLike/UnitLike/GameLike) instead
of importing client view classes; client imports view classes from a new
client/view barrel; deleted the engine/game/GameView re-export shim.
- Build/deploy updated: vite.config, index.html, eslint, Dockerfile
(copies packages/ + tsconfig.base.json before npm ci), .vscode, tests.
Verified: tsc --noEmit clean; 1364 + 65 tests pass; production vite build
succeeds; engine has zero client/server imports; core-public and shared are
dependency leaves.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
63 lines
2.0 KiB
TypeScript
63 lines
2.0 KiB
TypeScript
import { LitElement, html } from "lit";
|
|
import { customElement, property } from "lit/decorators.js";
|
|
|
|
@customElement("setting-number")
|
|
export class SettingNumber extends LitElement {
|
|
@property() label = "Setting";
|
|
@property() description = "";
|
|
@property({ type: Number }) value = 0;
|
|
@property({ type: Number }) min = 0;
|
|
@property({ type: Number }) max = 100;
|
|
@property({ type: Boolean }) easter = false;
|
|
|
|
createRenderRoot() {
|
|
return this;
|
|
}
|
|
|
|
private handleInput(e: Event) {
|
|
const input = e.target as HTMLInputElement;
|
|
const newValue = Number(input.value);
|
|
this.value = newValue;
|
|
|
|
this.dispatchEvent(
|
|
new CustomEvent("change", {
|
|
detail: { value: newValue },
|
|
bubbles: true,
|
|
composed: true,
|
|
}),
|
|
);
|
|
}
|
|
|
|
render() {
|
|
const rainbowClass = this.easter
|
|
? "bg-[linear-gradient(270deg,#990033,#996600,#336600,#008080,#1c3f99,#5e0099,#990033)] bg-[length:1400%_1400%] animate-rainbow-bg text-white hover:bg-[linear-gradient(270deg,#990033,#996600,#336600,#008080,#1c3f99,#5e0099,#990033)]"
|
|
: "";
|
|
|
|
return html`
|
|
<div
|
|
class="flex flex-row items-center justify-between w-full p-4 bg-white/5 border border-white/10 rounded-xl hover:bg-white/10 transition-all gap-4 ${rainbowClass}"
|
|
>
|
|
<div class="flex flex-col flex-1 min-w-0 mr-4">
|
|
<label
|
|
class="text-white font-bold text-base block mb-1"
|
|
for="setting-number-input"
|
|
>${this.label}</label
|
|
>
|
|
<div class="text-white/50 text-sm leading-snug">
|
|
${this.description}
|
|
</div>
|
|
</div>
|
|
<input
|
|
type="number"
|
|
id="setting-number-input"
|
|
class="shrink-0 w-[100px] py-2 px-3 border border-white/20 rounded-lg bg-black/60 text-white font-mono text-center focus:outline-none focus:border-blue-500 focus:ring-1 focus:ring-blue-500 transition-all"
|
|
.value=${String(this.value ?? 0)}
|
|
min=${this.min}
|
|
max=${this.max}
|
|
@input=${this.handleInput}
|
|
/>
|
|
</div>
|
|
`;
|
|
}
|
|
}
|