feat(api): integrating the sdk with the new api def

packages/domain/src/models/leaderboard.ts

@@ -1,7 +1,10 @@
+import { Leader } from './leader';
+
 export class Leaderboard {
   id: string;
   name: string;
   cost: number;
+  leaders?: Leader[];
 
   constructor(id: string) {
     this.id = id;

packages/domain/src/models/play.ts

@@ -1,3 +1,5 @@
+import { Leaderboard } from './leaderboard';
+
 export class Play {
   id: string;
   gameId: string;
@@ -6,6 +8,7 @@ export class Play {
   updatedAt: Date;
   deletedAt?: Date;
   deleted?: boolean;
+  leaderboard: Leaderboard;
 }
 
 export class CreatePlay {

packages/haste-game-client/src/config/config.ts

@@ -1,6 +1,7 @@
 import { BootScene } from '../scenes/bootScene';
 import { GameScene } from '../scenes/gameScene';
 import { LevelSelectionScene } from '../scenes/levelSelection';
+import { ResultsScene } from '../scenes/resultsScene';
 
 export const GameConfig: Phaser.Types.Core.GameConfig = {
   type: Phaser.AUTO,
@@ -10,6 +11,6 @@ export const GameConfig: Phaser.Types.Core.GameConfig = {
   height: 600,
   url: 'https://github.com/playhaste/haste-sdk/tree/main/packages/haste-game-client',
   version: '0.0.0',
-  scene: [BootScene, GameScene, LevelSelectionScene],
+  scene: [BootScene, GameScene, LevelSelectionScene, ResultsScene],
   render: { pixelArt: false, antialias: true },
 };

packages/haste-game-client/src/game/hasteGame.ts

@@ -7,6 +7,7 @@ export class HasteGame extends Phaser.Game {
   state: HasteGameState;
   leaderboards: Leaderboard[];
   socketManager: SocketManager;
+  selectedLeaderboardId: string;
 
   constructor(gameConfig?: Phaser.Types.Core.GameConfig) {
     super(gameConfig);

packages/haste-game-client/src/scenes/gameScene.ts

@@ -41,14 +41,13 @@ export class GameScene extends Phaser.Scene {
 
     // disable player when the game over
     // event is emitted
-    hasteGame.socketManager.gameOverEvent.on((leaders) => {
+    hasteGame.socketManager.gameOverEvent.on(() => {
       this.playerSprite.anims.play('turn');
       this.input.keyboard.enabled = false;
       this.playerSprite.setTint(0xff0000);
       this.playerSprite.anims.play('turn');
       this.gameOver = true;
-      this.leaderboard = new Leaderboard(this, 300, 100, leaders);
-      this.add.existing(this.leaderboard);
+      this.scene.start('ResultsScene', { auth: this.auth0 } as GameSceneData);
     });
 
     hasteGame.socketManager.gameStartEvent.emit();

packages/haste-game-client/src/scenes/levelSelection.ts

@@ -39,6 +39,7 @@ export class LevelSelectionScene extends Phaser.Scene {
             this.scene.start('GameScene', { auth: this.auth0 } as GameSceneData);
           });
 
+          hasteGame.selectedLeaderboardId = leaderboardId;
           hasteGame.socketManager.gameInitEvent.emit(leaderboardId);
           resolve();
         });
@@ -58,13 +59,6 @@ export class LevelSelectionScene extends Phaser.Scene {
     this.cameras.main.setBackgroundColor(0x98d687);
   }
 
-  // As part of the Phaser lifecycle, update is called at every
-  // tick. Its important not to instantite things multiple times which
-  // is why the if guard is there.
-  update() {
-    const hasteGame = this.game as HasteGame;
-  }
-
   async logout() {
     await new Promise((resolve) => {
       const hasteGame = this.game as HasteGame;

packages/haste-game-client/src/scenes/resultsScene.ts

@@ -0,0 +1,55 @@
+import { HasteGame } from '../game/hasteGame';
+import { GameSceneData } from '../models/gameState';
+import { Button } from '../game-objects/button';
+import { Auth0Client } from '@auth0/auth0-spa-js';
+import { Leaderboard } from '../game-objects/leaderboard';
+import { Leader } from '@haste-sdk/domain';
+
+// The ResultsScene loads the leaderboard with the
+// top results
+export class ResultsScene extends Phaser.Scene {
+  private auth0: Auth0Client;
+  logoutButton: Button;
+  leaderboard: Leaderboard;
+
+  constructor() {
+    super({
+      key: 'ResultsScene',
+    });
+  }
+
+  init(data: GameSceneData) {
+    const hasteGame = this.game as HasteGame;
+    this.auth0 = data.auth;
+    this.addLogoutButton();
+
+    hasteGame.socketManager.gameGetLeadersCompletedEvent.on((data: Leader[]) => {
+      this.leaderboard = new Leaderboard(this, 300, 100, data);
+      this.add.existing(this.leaderboard);
+    });
+
+    hasteGame.socketManager.gameGetLeadersEvent.emit(hasteGame.selectedLeaderboardId);
+  }
+
+  private addLogoutButton() {
+    this.logoutButton = new Button(this, 700, 20, 'Logout', { fill: '#f00' }, async () => {
+      return await this.logout();
+    });
+    this.add.existing(this.logoutButton);
+  }
+
+  preload() {
+    this.cameras.main.setBackgroundColor(0x98d687);
+  }
+
+  async logout() {
+    await new Promise((resolve) => {
+      const hasteGame = this.game as HasteGame;
+      hasteGame.socketManager.logoutEvent.emit();
+      this.auth0.logout({
+        returnTo: window.location.origin,
+      });
+      resolve(undefined);
+    });
+  }
+}

packages/haste-game-client/src/socket/socketManager.ts

@@ -11,12 +11,14 @@ export class SocketManager {
   gameInitEvent: WrappedClientSocket<string>;
   gameInitCompletedEvent: WrappedClientSocket<HasteGameState>;
   gameUpdateEvent: WrappedClientSocket<HasteGameState>;
-  gameOverEvent: WrappedClientSocket<Leader[]>;
+  gameOverEvent: WrappedClientSocket<void>;
   gameStartEvent: WrappedClientSocket<void>;
   playerUpdateEvent: WrappedClientSocket<PlayerMovement>;
   logoutEvent: WrappedClientSocket<void>;
   gameGetLevelsEvent: WrappedClientSocket<void>;
   gameGetLevelsCompletedEvent: WrappedClientSocket<Leaderboard[]>;
+  gameGetLeadersEvent: WrappedClientSocket<string>;
+  gameGetLeadersCompletedEvent: WrappedClientSocket<Leader[]>;
 
   constructor(serverUrl: string, token: string) {
     this.socket = io(serverUrl, {
@@ -33,8 +35,10 @@ export class SocketManager {
     this.gameGetLevelsCompletedEvent = this.createSocket('gameGetLevelsCompleted');
     this.gameUpdateEvent = this.createSocket('gameUpdate');
     this.gameStartEvent = this.createSocket('gameStart');
-    this.gameOverEvent = this.createSocket<Leader[]>('gameOver');
+    this.gameOverEvent = this.createSocket('gameOver');
     this.playerUpdateEvent = this.createSocket('playerUpdate');
+    this.gameGetLeadersEvent = this.createSocket('gameGetLeaders');
+    this.gameGetLeadersCompletedEvent = this.createSocket('gameGetLeadersCompleted');
     this.logoutEvent = this.createSocket('logout');
   }
 

packages/haste-game-client/src/socket/socketManagerTypes.ts

@@ -14,7 +14,9 @@ export type SocketMessage =
   | 'playerUpdate'
   | 'logout'
   | 'gameGetLevels'
-  | 'gameGetLevelsCompleted';
+  | 'gameGetLevelsCompleted'
+  | 'gameGetLeaders'
+  | 'gameGetLeadersCompleted';
 
 export interface EmitterCallback<T> {
   (data: T): void;

packages/haste-game-server/src/game/gameEngine.ts

@@ -102,7 +102,7 @@ export class GameEngine {
   addBombs(timestamp: number): void {
     timestamp = Math.round(timestamp);
 
-    if (timestamp !== 0 && (Math.round(timestamp/10)*10) % (10 * 1000) === 0) {
+    if (timestamp !== 0 && (Math.round(timestamp / 10) * 10) % (10 * 1000) === 0) {
       const bomb = new Bomb();
       bomb.height = 14;
       bomb.width = 14;

packages/haste-game-server/src/game/listeners/collisionStartListener.ts

@@ -1,12 +1,7 @@
-import { Leaderboard } from '@haste-sdk/domain';
 import { Haste } from '@haste-sdk/sdk';
 import Matter, { Body, Engine, Runner, World } from 'matter-js';
 import { GameEngine } from '../gameEngine';
 
-function delay(ms: number) {
-  return new Promise((resolve) => setTimeout(resolve, ms));
-}
-
 // directly the matter-js simulation on what
 // to do when collisions between the various
 // game objects occur.
@@ -46,11 +41,8 @@ export function collisionStartListener(
 
       // submit the score to the haste api
       // eslint-disable-next-line @typescript-eslint/no-floating-promises
-      haste.game.score(engine.currentPlay, new Leaderboard(''), engine.score);
-      // await delay(500);
-      const leaders = []; // await haste.game.leaders();
-      engine.socket.emit('gameOver', leaders);
-      engine.socket.disconnect();
+      haste.game.score(engine.currentPlay, engine.currentPlay.leaderboard, engine.score);
+      engine.socket.emit('gameOver');
     }
 
     if (

packages/haste-game-server/src/server/listeners/gameGetLeadersListener.ts

@@ -0,0 +1,21 @@
+import { JwtPayload } from 'jsonwebtoken';
+import { GameEngine } from '../../game/gameEngine';
+import { Haste } from '@haste-sdk/sdk';
+import { Socket } from 'socket.io';
+import { Leaderboard } from '@haste-sdk/domain';
+
+// This is called when the user logs in
+// the haste client game. The gameGetLevels event is emitted
+// from the client and received by the server. The server is listening
+// and then leverages the Haste SDK to retrieve all the levels for
+// the current game.
+export async function gameGetLeadersListener(
+  jwt: JwtPayload,
+  haste: Haste,
+  engine: GameEngine,
+  socket: Socket,
+  leaderboardId: string,
+) {
+  const leaders = await haste.game.leaders(new Leaderboard(leaderboardId));
+  socket.emit('gameGetLeadersCompleted', leaders);
+}

packages/haste-game-server/src/server/listeners/index.ts

@@ -3,3 +3,4 @@ export * from './gameStartListener';
 export * from './playerUpdateListener';
 export * from './logoutListener';
 export * from './gameGetLevelsListener';
+export * from './gameGetLeadersListener';

packages/haste-game-server/src/server/socketServer.ts

@@ -66,8 +66,9 @@ export class SocketServer {
     const playerUpdateEvent = this.createSocket<PlayerMovement>('playerUpdate', listeners.playerUpdateListener);
     const logoutEvent = this.createSocket<void>('logout', listeners.logoutListener);
     const getLevelsEvent = this.createSocket<void>('gameGetLevels', listeners.gameGetLevelsListener);
+    const getLeadersEvent = this.createSocket<string>('gameGetLeaders', listeners.gameGetLeadersListener);
 
-    return [gameInitEvent, gameStartEvent, playerUpdateEvent, logoutEvent, getLevelsEvent];
+    return [gameInitEvent, gameStartEvent, playerUpdateEvent, logoutEvent, getLevelsEvent, getLeadersEvent];
   }
 
   private broadcast<T>(event: SocketMessage) {

packages/haste-game-server/src/server/socketServerTypes.ts

@@ -5,7 +5,7 @@ import { Socket } from 'socket.io';
 
 // create strong types for socket.io
 // and the game corresponding events
-export type SocketMessage = 'gameInit' | 'gameStart' | 'playerUpdate' | 'logout' | 'gameGetLevels';
+export type SocketMessage = 'gameInit' | 'gameStart' | 'playerUpdate' | 'logout' | 'gameGetLevels' | 'gameGetLeaders';
 
 export type SocketActionFn<T> = (jwt: JwtPayload, haste: Haste, engine: GameEngine, socket: Socket, message: T) => void;
 

packages/sdk/src/api/resources/game/gameResource.ts

@@ -1,4 +1,4 @@
-import { Player, CreatePlay, Play, CreateScore, Score, Leaderboard, Game } from '@haste-sdk/domain';
+import { Player, CreatePlay, Play, CreateScore, Score, Leaderboard, Game, Leader } from '@haste-sdk/domain';
 import { HasteConfiguration } from '../../../config/hasteConfiguration';
 import { BaseResource } from '../baseResource';
 
@@ -13,7 +13,9 @@ export class GameResource extends BaseResource {
   async play(player: Player, leaderboard: Leaderboard) {
     const payload = new CreatePlay(player.id, leaderboard.id);
     const path = `/arcades/${this.configuration.arcadeId}/games/${this.configuration.gameId}/play`;
-    return await this.post<CreatePlay, Play>(payload, path);
+    const play = await this.post<CreatePlay, Play>(payload, path);
+    play.leaderboard = leaderboard;
+    return play;
   }
 
   async score(play: Play, leaderboard: Leaderboard, score: number) {
@@ -25,4 +27,10 @@ export class GameResource extends BaseResource {
   leaderboards() {
     return this.details.leaderboards;
   }
+
+  async leaders(leaderboard: Leaderboard) {
+    const path = `/arcades/${this.configuration.arcadeId}/games/${this.configuration.gameId}/leaders/${leaderboard.id}`;
+    const result = await this.get<Leaderboard>(path);
+    return result.leaders;
+  }
 }