rm initialmode, fetch highscores from mru, fix sending ticks (#12)

* rm: initialmode, fetch highscores from server and more

* fix some race conditions

* cleanup

* fix: prevent actions from from popping up post sign cancel

* add workflow for deploying

Author: aashutoshrathi

.github/workflows/pages.yml

@@ -0,0 +1,36 @@
+name: Update Deployment
+
+on:
+  push:
+    branches:
+      - "main"
+
+jobs:
+  publish:
+    permissions:
+      contents: write
+    runs-on: ubuntu-latest
+    steps:
+      - name: Check out
+        uses: actions/checkout@v4
+    
+      - name: Setup Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: '20'
+
+      - name: Install dependencies
+        run: cd client && npm install
+    
+      - name: Remove .gitignore
+        run: rm -rf client/.gitignore
+
+      - name: Generate your content
+        run: npm run build:client
+
+      - name: Publish current workdir (which contains generated content) to GitHub Pages
+        uses: rayluo/github-pages-overwriter@v1.3
+
+        with:
+          source-directory: client
+          target-branch: gh-pages

.gitignore

@@ -1,2 +1,3 @@
 **/*.sqlite
 **/*.env
+node_modules/

client/game/attractMode.ts

@@ -1,10 +1,9 @@
 import { IGameState } from "../comets";
-import { startGame } from "../rpc/api";
+import { fetchMruInfo, startGame } from "../rpc/api";
 import { addToStore, getFromStore, StorageKey } from "../rpc/storage";
 import { DemoMode } from "./demoMode";
 import { EventSource } from "./events";
 import { HighScoreMode } from "./highScoreMode";
-import { Highscores } from "./highscores";
 import { Key } from "./keys";
 import { Screen } from "./screen";
 import { Sound } from "./sounds";
@@ -14,18 +13,16 @@ const ATTRACT_TIME = 15;
 
 // combines DemoMode and HighscoreMode to attract people to part with their quarters
 export class AttractMode extends EventSource implements IGameState {
-  private demoTimer = 0;
   private currentMode: IGameState;
   private modes: IGameState[];
-  private index: number = 0;
   private isStarting = false;
 
   constructor(world: World, lastScore: number) {
     super();
 
     this.modes = [
       new HighScoreMode(lastScore),
-      new DemoMode(world || new World(Highscores.top.score)),
+      new DemoMode(world || new World()),
     ];
 
     this.currentMode = this.modes[0];
@@ -36,43 +33,30 @@ export class AttractMode extends EventSource implements IGameState {
 
   update(step: number) {
     this.currentMode.update(step);
-    // since page is reloaded on update for now, we need to check if game is already started
-    if (getFromStore(StorageKey.GAME_ID)) {
-      this.trigger("done");
-    }
 
     if (Key.isAnyPressed()) {
-      if (getFromStore(StorageKey.GAME_ID)) {
-        this.trigger("done");
-      } else if (!this.isStarting) {
+      if (!this.isStarting) {
         this.isStarting = true;
-        startGame().then((res) => {
-          if (res?.error || !res.isOk) {
-            console.error(res.error);
+        startGame()
+          .then((res) => {
+            console.log("Game started", res.logs[0].value);
+            addToStore(StorageKey.GAME_ID, res.logs[0].value);
+            this.isStarting = false;
+            this.trigger("done");
+          })
+          .catch((e) => {
+            console.error("Error starting game", e.message);
+          })
+          .finally(() => {
             this.isStarting = false;
-            return;
-          }
-          console.log("Game started", res.logs[0].value);
-          addToStore(StorageKey.GAME_ID, res.logs[0].value);
-          this.isStarting = false;
-        });
+            // clears the keys to prevent the game from starting again
+            Key.clear();
+          });
       }
-    } else {
-      this.updateAttractTimer(step);
     }
   }
 
   render(screen: Screen, dt?: number) {
     this.currentMode.render(screen, dt);
   }
-
-  updateAttractTimer(step: number) {
-    this.demoTimer += step;
-
-    if (this.demoTimer >= ATTRACT_TIME) {
-      this.demoTimer = 0;
-      this.index = 1 - this.index;
-      this.currentMode = this.modes[this.index];
-    }
-  }
 }

client/game/comets.ts

@@ -1,12 +1,10 @@
 import { IGameState } from "../comets";
-import { fetchMruInfo } from "../rpc/api";
+import { fetchLeaderboard, fetchMruInfo } from "../rpc/api";
 import { removeFromStore, StorageKey } from "../rpc/storage";
 import { getWalletClient } from "../rpc/wallet";
 import { AttractMode } from "./attractMode";
 import { GameMode } from "./gameMode";
 import Global from "./global";
-import { Highscores } from "./highscores";
-import { InitialsMode } from "./initialsMode";
 import { Key, Keys } from "./keys";
 import { loop } from "./loop";
 import { Screen } from "./screen";
@@ -18,46 +16,49 @@ export class Comets {
   private lastScore = 0;
   private attractMode: AttractMode;
   private gameMode: GameMode;
-  private initialsMode: InitialsMode;
   private currentMode: IGameState;
   private tickRecorder: TickRecorder;
   private screen: Screen;
+  private isSendingTicks = false;
 
   constructor() {
     this.init();
   }
 
   init() {
-    this.attractMode = new AttractMode(
-      new World(Highscores.top.score),
-      this.lastScore
-    );
+    this.attractMode = new AttractMode(new World(), this.lastScore);
     this.screen = new Screen();
     this.currentMode = this.attractMode;
     this.tickRecorder = new TickRecorder();
 
     const setGameMode = () => {
-      this.gameMode = new GameMode(new World(Highscores.top.score));
+      this.gameMode = new GameMode(new World());
       this.currentMode = this.gameMode;
       this.tickRecorder.reset();
 
       this.gameMode.on("done", async (source, world) => {
         // Send ticks in the form of an action to MRU
         // And wait for C1 to confirm score
         this.lastScore = world.score;
-        await this.tickRecorder.sendTicks(this.lastScore);
-
-        if (Highscores.qualifies(world.score)) {
-          this.initialsMode = new InitialsMode(world.score);
-          this.currentMode = this.initialsMode;
-
-          this.initialsMode.on("done", () => {
-            this.init();
-          });
-        } else {
-          // restart in attract mode
-          this.init();
+        if (!this.isSendingTicks) {
+          this.isSendingTicks = true;
+          await this.tickRecorder
+            .sendTicks(this.lastScore)
+            .then(() => {
+              console.log("Sent ticks");
+            })
+            .catch((e) => {
+              console.error("Error sending ticks", e.message);
+            })
+            .finally(() => {
+              removeFromStore(StorageKey.GAME_ID);
+              this.isSendingTicks = false;
+              this.init();
+              // Reload page
+              window.location.reload();
+            });
         }
+        // restart in attract mode
         console.log("Game over");
       });
     };
@@ -115,7 +116,7 @@ const game = new Comets();
 
 // setup things
 (async () => {
-  await fetchMruInfo();
+  await Promise.all([fetchMruInfo(), fetchLeaderboard()]);
   await getWalletClient();
   setTimeout(() => {
     loop(game);

client/game/demoMode.ts

@@ -76,7 +76,8 @@ export class DemoMode implements IGameState {
     screen.draw.background();
     screen.draw.scorePlayer1(this.world.score);
     screen.draw.oneCoinOnePlay();
-    screen.draw.highscore(this.world.highscore);
+    // screen.draw.highscore(this.world.highscore);
+    screen.draw.stackr();
     screen.draw.copyright();
   }
 

client/game/draw.ts

@@ -328,6 +328,15 @@ export class Draw {
     });
   }
 
+  stackr() {
+    this.text2("Stackr", this.screen.font.small, (width) => {
+      return {
+        x: this.screen.width2 - width / 2,
+        y: Y_START,
+      };
+    });
+  }
+
   oneCoinOnePlay() {
     this.text2("1  coin  1  play", this.screen.font.medium, (width) => {
       return {

client/game/gameMode.ts

@@ -107,8 +107,8 @@ export class GameMode extends EventSource implements IGameState {
   private renderStatic(screen: Screen) {
     screen.draw.background();
     screen.draw.copyright();
+    screen.draw.stackr();
     screen.draw.scorePlayer1(this.world.score);
-    screen.draw.highscore(this.world.highscore);
     screen.draw.drawExtraLives(this.world.lives);
 
     // remaining shields