Refactor dollar values to start from zero and enhance mobile layout with improved overflow handling

Author: sebastianhaeni

index.html

@@ -9,6 +9,7 @@
       content="A browser idle game about writing code, hiring developers, shipping faster, and surviving bugs and tech debt."
     />
     <meta name="theme-color" content="#0a1224" />
+    <meta name="mobile-web-app-capable" content="yes" />
     <meta name="apple-mobile-web-app-capable" content="yes" />
     <meta
       name="apple-mobile-web-app-status-bar-style"

src/game/engine.ts

@@ -52,7 +52,7 @@ export function createInitialState(nowMs = Date.now()): GameState {
   return {
     loc: 0,
     lifetimeLoc: 0,
-    dollars: 35,
+    dollars: 0,
     lifetimeDollars: 0,
     aiAgents: 0,
     aiTokens: 0,

src/lib/css/styles.css

@@ -1436,7 +1436,7 @@ input {
     grid-column: 1;
     grid-row: 1;
     min-height: 0;
-    overflow: auto;
+    overflow: visible;
     display: none;
   }
 
@@ -1479,7 +1479,7 @@ input {
   .tile-shop,
   .tile-utility,
   .tile-owned {
-    max-height: 100%;
+    max-height: none;
   }
 
   .game-shell[data-mobile-screen="team"] .tile-devs,
@@ -1561,12 +1561,19 @@ input {
     flex: 1 1 auto;
     min-height: 0;
     overflow: auto;
+    scrollbar-width: none;
+  }
+
+  .game-shell[data-mobile-screen="play"]
+    .tile-hero
+    .team-visual::-webkit-scrollbar {
+    display: none;
   }
 
   .game-shell[data-mobile-screen="play"] .tile-actions {
     flex: 0 0 auto;
     order: 3;
-    overflow: auto;
+    overflow: visible;
   }
 
   .game-shell[data-mobile-screen="play"] .tile-stats {

src/main.ts

@@ -25,13 +25,15 @@ let state = store.getState();
 const STRATEGIC_DEBT_AUTO_POSTPONE_MS = 15_000;
 const KEYBOARD_WRITE_DEBOUNCE_MS = 180;
 const KEYBOARD_HINT_VISIBLE_MS = 6000;
+const TOUCH_WRITE_SUPPRESS_CLICK_MS = 500;
 
 const app = document.querySelector("#app");
 if (!(app instanceof HTMLElement)) {
   throw new Error("Missing #app root");
 }
 const { elements, buttons, statCards } = mountGameShell(app);
 let lastKeyboardWriteAt = 0;
+let lastTouchWriteAt = 0;
 const audio = createAudioController({ isGameOver });
 const codeBackground = createCodeBackgroundController({
   container: elements.codeBackground,
@@ -62,6 +64,7 @@ const managementPanels = createManagementPanelsController({
     prestigeUpgradeList: elements.prestigeUpgradeList,
     goalTarget: elements.goalTarget,
     goalProgress: elements.goalProgress,
+    goalProgressFill: elements.goalProgressFill,
     goalReward: elements.goalReward,
     prestigeReset: elements.prestigeReset,
   },
@@ -98,8 +101,26 @@ function applyAction(action: GameAction): void {
   render();
 }
 
-buttons.click.addEventListener("click", () => {
+const performManualWriteFromUi = (): void => {
   manualWrite.performManualWrite(COMBO_CALLOUTS);
+};
+
+buttons.click.addEventListener("pointerdown", (event) => {
+  if (event.pointerType === "mouse") {
+    return;
+  }
+  if (event.cancelable) {
+    event.preventDefault();
+  }
+  lastTouchWriteAt = Date.now();
+  performManualWriteFromUi();
+});
+
+buttons.click.addEventListener("click", () => {
+  if (Date.now() - lastTouchWriteAt < TOUCH_WRITE_SUPPRESS_CLICK_MS) {
+    return;
+  }
+  performManualWriteFromUi();
 });
 
 window.addEventListener("keydown", (event) => {

test/engine.test.ts

@@ -265,7 +265,7 @@ test("click action applies gain, aura creation, and refactoring bug reduction",
 
   expect(next.totalClicks).toBe(1);
   expect(next.loc).toBeGreaterThan(0);
-  expect(next.dollars).toBeGreaterThan(35);
+  expect(next.dollars).toBeGreaterThan(0);
   expect(next.clickAuras).toHaveLength(1);
   expect(next.bugs).toHaveLength(1);
   expect(next.bugs[0].id).toBe(2);
@@ -361,7 +361,7 @@ test("prestige reset carries prestige state and bootstrap bonuses forward", () =
   expect(next.prestigeUpgrades.momentum_bootstrap).toBe(4);
   expect(next.tradeoffMode).toBe("balanced");
   expect(next.developers.junior).toBe(2);
-  expect(next.dollars).toBeGreaterThan(35);
+  expect(next.dollars).toBeGreaterThan(0);
 });
 
 test("risk summary reflects AI-heavy teams", () => {
@@ -518,7 +518,7 @@ test("tick accrues passive output, cleans expired effects, and respects game ove
 
   const progressed = tick(state, { nowMs: 11_000, random: () => 0.99 });
   expect(progressed.loc).toBeGreaterThan(0);
-  expect(progressed.dollars).toBeGreaterThan(35);
+  expect(progressed.dollars).toBeGreaterThan(0);
   expect(progressed.activeBoosts).toHaveLength(0);
   expect(progressed.clickAuras).toHaveLength(0);
   expect(progressed.activeEvents).toHaveLength(0);

test/persistence.test.ts

@@ -87,7 +87,7 @@ test("loadState creates a fresh state when storage is empty", () => {
   const loaded = loadState(createStorage(null), 7_000);
 
   expect(loaded.lastTickAt).toBe(7_000);
-  expect(loaded.dollars).toBe(35);
+  expect(loaded.dollars).toBe(0);
 });
 
 test("encode and decode use browser base64 helpers when available", () => {

test/uiModules.test.ts

@@ -230,6 +230,7 @@ test("management panels controller initializes panels, renders data, and dispatc
       prestigeUpgradeList: elements.prestigeUpgradeList,
       goalTarget: elements.goalTarget,
       goalProgress: elements.goalProgress,
+      goalProgressFill: elements.goalProgressFill,
       goalReward: elements.goalReward,
       prestigeReset: elements.prestigeReset,
     },