From 41f3b506a0300339b0ec0ce20d7fa317d005c87c Mon Sep 17 00:00:00 2001
From: Jan K9f <jan@kjan.email>
Date: Wed, 21 May 2025 09:16:53 +0200
Subject: [PATCH] feat: Create basic layout for coinflip

---
 frontend/src/app/app.routes.ts                |  5 +++
 .../game/coinflip/coinflip.component.html     | 16 +++++++++
 .../game/coinflip/coinflip.component.ts       | 34 +++++++++++++++++++
 3 files changed, 55 insertions(+)
 create mode 100644 frontend/src/app/feature/game/coinflip/coinflip.component.html
 create mode 100644 frontend/src/app/feature/game/coinflip/coinflip.component.ts

diff --git a/frontend/src/app/app.routes.ts b/frontend/src/app/app.routes.ts
index b4bf818..1057aeb 100644
--- a/frontend/src/app/app.routes.ts
+++ b/frontend/src/app/app.routes.ts
@@ -38,6 +38,11 @@ export const routes: Routes = [
     loadComponent: () => import('./feature/game/blackjack/blackjack.component'),
     canActivate: [authGuard],
   },
+  {
+    path: 'game/coinflip',
+    loadComponent: () => import('./feature/game/coinflip/coinflip.component'),
+    canActivate: [authGuard],
+  },
   {
     path: 'game/slots',
     loadComponent: () => import('./feature/game/slots/slots.component'),
diff --git a/frontend/src/app/feature/game/coinflip/coinflip.component.html b/frontend/src/app/feature/game/coinflip/coinflip.component.html
new file mode 100644
index 0000000..872800b
--- /dev/null
+++ b/frontend/src/app/feature/game/coinflip/coinflip.component.html
@@ -0,0 +1,16 @@
+<p>Coinflip works!</p>
+
+<div class="container mx-auto">
+  <div class="grid grid-cols-4">
+    <div class="col-span-3"></div>
+    <div class="col-span-1">
+      <app-game-info
+        [balance]="balance()"
+        [currentBet]="currentBet()"
+        [gameInProgress]="gameInProgress()"
+        [isActionInProgress]="isActionInProgress()"
+        (newGame)="onNewGame($event)"
+      ></app-game-info>
+    </div>
+  </div>
+</div>
diff --git a/frontend/src/app/feature/game/coinflip/coinflip.component.ts b/frontend/src/app/feature/game/coinflip/coinflip.component.ts
new file mode 100644
index 0000000..f79f320
--- /dev/null
+++ b/frontend/src/app/feature/game/coinflip/coinflip.component.ts
@@ -0,0 +1,34 @@
+import { ChangeDetectionStrategy, Component, inject, OnInit, signal } from '@angular/core';
+import { GameInfoComponent } from '@blackjack/components/game-info/game-info.component';
+import { AuthService } from '@service/auth.service';
+import { AudioService } from '@shared/services/audio.service';
+
+@Component({
+  selector: 'app-coinflip',
+  standalone: true,
+  imports: [GameInfoComponent],
+  templateUrl: './coinflip.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export default class CoinflipComponent implements OnInit {
+  currentBet = signal(0);
+  balance = signal(0);
+  gameInProgress = signal(false);
+  isActionInProgress = signal(false);
+  audioService = inject(AudioService);
+  authService = inject(AuthService);
+
+  onNewGame(bet: number): void {
+    this.isActionInProgress.set(true);
+    this.audioService.playBetSound();
+  }
+
+  ngOnInit(): void {
+    // Subscribe to user updates for real-time balance changes
+    this.authService.userSubject.subscribe((user) => {
+      if (user) {
+        this.balance.set(user.balance);
+      }
+    });
+  }
+}