Basic room listing

LittleBigRefresh · May 23, 2024 · 3fc97c1 · 3fc97c1
1 parent 410ab06
commit 3fc97c1
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 16 deletions.
diff --git a/src/app/api/types/rooms/room.ts b/src/app/api/types/rooms/room.ts
@@ -1,4 +1,6 @@
 import {RoomPlayer} from "./room-player";
+import {GameVersion} from "../game-version";
+import {Platform} from "../platform";
 
 export interface Room {
     roomId: string;
@@ -10,6 +12,6 @@ export interface Room {
     levelType: number;
     levelId: number;
 
-    platform: number;
-    game: number
+    platform: Platform;
+    game: GameVersion
 }
diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
@@ -48,6 +48,11 @@ export const routes: Routes = [
         loadComponent: () => import('./pages/activity-listing/activity-listing.component').then(x => x.ActivityListingComponent),
         data: {title: "Recent Activity"},
     },
+    {
+        path: 'rooms',
+        loadComponent: () => import('./pages/room-listing/room-listing.component').then(x => x.RoomListingComponent),
+        data: {title: "Room Listing"},
+    },
     // KEEP THIS ROUTE LAST! It handles pages that do not exist.
     {
         path: '**',

diff --git a/src/app/components/items/room.component.ts b/src/app/components/items/room.component.ts
@@ -19,21 +19,25 @@ import {UserLinkComponent} from "../ui/text/links/user-link.component";
     AsyncPipe
   ],
   template: `
-    <app-container>
-      <b>{{'player' | plural: room.playerIds.length}} on {{room.game | game}}</b>
-      <ul class="list-disc list-inside">
-        <div *ngFor="let player of room.playerIds">
-          <li *ngIf="!player.userId">
-            {{player.username}}
-          </li>
-          <li *ngIf="player.userId">
-            <app-user-link [user]="null" [userId]="player.userId"></app-user-link>
-          </li>
-        </div>
-      </ul>
-    </app-container>
+    <b>
+      {{'player' | plural: room.playerIds.length}}
+      <span *ngIf="showGame">
+        on {{room.game | game}}
+      </span>
+    </b>
+    <ul class="list-disc list-inside">
+      <div *ngFor="let player of room.playerIds">
+        <li *ngIf="!player.userId">
+          {{player.username}}
+        </li>
+        <li *ngIf="player.userId">
+          <app-user-link [user]="null" [userId]="player.userId"></app-user-link>
+        </li>
+      </div>
+    </ul>
   `
 })
 export class RoomComponent {
   @Input({required: true}) room: Room = undefined!;
+  @Input() showGame: boolean = true;
 }
diff --git a/src/app/pages/landing/landing.component.html b/src/app/pages/landing/landing.component.html
@@ -29,7 +29,9 @@ <h1>{{this.instance?.instanceName ?? 'Refresh'}}</h1>
                 Nobody's playing right now.
             </p>
             <div class="flex flex-col gap-y-2.5">
-                <app-room *ngFor="let room of this.rooms | slice:0:7; let i=index" [room]="room"></app-room>
+                <app-container *ngFor="let room of this.rooms | slice:0:7">
+                    <app-room [room]="room"></app-room>
+                </app-container>
             </div>
             <div class="mt-1.5">
                 <app-router-link *ngIf="this.rooms.length > 3" routerLink="/rooms">See all {{rooms?.length}} rooms and {{playerCount()}} players</app-router-link>