diff --git a/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.css b/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.css index 4e5f67f..1272a49 100644 --- a/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.css +++ b/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.css @@ -312,11 +312,9 @@ body { opacity 0.5s ease-out, transform 0.5s ease-out; transition-delay: 0.5s; - pointer-events: none; /* Prevent clicks when invisible */ } .animation-fade.visible { opacity: 1; transform: translateY(0); - pointer-events: auto; /* Enable clicks when visible */ } diff --git a/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.html b/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.html index cc234ac..0da3ed8 100644 --- a/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.html +++ b/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.html @@ -31,15 +31,9 @@
@@ -91,24 +85,12 @@ class="flex justify-center gap-4 mt-8 animation-fade" [class.visible]="animationCompleted" > - diff --git a/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.ts b/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.ts index c1255ef..cd3ed1f 100644 --- a/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.ts +++ b/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.ts @@ -4,8 +4,6 @@ import { ActivatedRoute, Router } from '@angular/router'; import { LootboxService } from '../services/lootbox.service'; import { LootBox, Reward } from 'app/model/LootBox'; import { NavbarComponent } from '@shared/components/navbar/navbar.component'; -import { UserService } from '@service/user.service'; -import { User } from 'app/model/User'; @Component({ selector: 'app-lootbox-opening', @@ -23,20 +21,14 @@ export default class LootboxOpeningComponent { wonReward: Reward | null = null; prizeList: Reward[] = []; animationCompleted = false; - currentUser: User | null = null; constructor( private route: ActivatedRoute, private router: Router, private lootboxService: LootboxService, - private userService: UserService, private cdr: ChangeDetectorRef ) { this.loadLootbox(); - this.userService.currentUser$.subscribe((user) => { - this.currentUser = user; - this.cdr.detectChanges(); - }); } private loadLootbox(): void { @@ -65,24 +57,8 @@ export default class LootboxOpeningComponent { openLootbox(): void { if (!this.lootbox || this.isOpening) return; - // Check if user has enough balance - if (!this.hasEnoughBalance()) { - this.error = 'Nicht genug Guthaben, um diese Lootbox zu öffnen.'; - window.scrollTo(0, 0); - this.cdr.detectChanges(); - setTimeout(() => { - this.error = ''; - this.cdr.detectChanges(); - }, 5000); - return; - } - this.resetState(true); - if (this.lootbox.price) { - this.userService.updateLocalBalance(-this.lootbox.price); - } - setTimeout(() => { this.lootboxService.purchaseLootBox(this.lootbox!.id).subscribe({ next: this.handleRewardSuccess.bind(this), @@ -96,7 +72,6 @@ export default class LootboxOpeningComponent { this.generateCasePrizes(reward); this.isOpening = false; this.isOpen = true; - this.cdr.detectChanges(); } @@ -105,12 +80,7 @@ export default class LootboxOpeningComponent { const rewards = this.lootbox.rewards; const fallback = rewards[Math.floor(Math.random() * rewards.length)]; - - this.wonReward = fallback; - this.generateCasePrizes(fallback); - this.isOpening = false; - this.isOpen = true; - this.cdr.detectChanges(); + this.handleRewardSuccess(fallback); } private resetState(isOpening = false): void { @@ -142,12 +112,6 @@ export default class LootboxOpeningComponent { setTimeout(() => { this.animationCompleted = true; - - if (this.wonReward) { - this.userService.updateLocalBalance(this.wonReward.value); - } - - this.userService.refreshCurrentUser(); this.cdr.detectChanges(); }, 10000); } @@ -204,9 +168,4 @@ export default class LootboxOpeningComponent { if (!this.wonReward || !this.lootbox) return ''; return this.wonReward.value > (this.lootbox.price || 0) ? 'text-emerald' : 'text-accent-red'; } - - hasEnoughBalance(): boolean { - if (!this.currentUser || !this.lootbox) return false; - return this.currentUser.balance >= this.lootbox.price; - } } diff --git a/frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.html b/frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.html index 25d8df0..2699f1a 100644 --- a/frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.html +++ b/frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.html @@ -44,15 +44,9 @@
diff --git a/frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.ts b/frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.ts index bc3023c..217af16 100644 --- a/frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.ts +++ b/frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.ts @@ -5,8 +5,6 @@ import { LootboxService } from '../services/lootbox.service'; import { LootBox } from 'app/model/LootBox'; import { Router } from '@angular/router'; import { timeout } from 'rxjs'; -import { UserService } from '@service/user.service'; -import { User } from 'app/model/User'; @Component({ selector: 'app-lootbox-selection', @@ -19,7 +17,6 @@ export default class LootboxSelectionComponent implements OnInit { lootboxes: LootBox[] = []; isLoading = true; error = ''; - currentUser: User | null = null; // Fallback data in case the API call fails fallbackLootboxes: LootBox[] = [ @@ -89,16 +86,11 @@ export default class LootboxSelectionComponent implements OnInit { constructor( private lootboxService: LootboxService, private router: Router, - private cdr: ChangeDetectorRef, - private userService: UserService + private cdr: ChangeDetectorRef ) {} ngOnInit(): void { this.loadLootboxes(); - this.userService.currentUser$.subscribe((user) => { - this.currentUser = user; - this.cdr.detectChanges(); - }); } loadLootboxes(): void { @@ -128,24 +120,6 @@ export default class LootboxSelectionComponent implements OnInit { } openLootbox(lootboxId: number): void { - const lootbox = this.lootboxes.find((box) => box.id === lootboxId); - - if (!lootbox) { - return; - } - - if (!this.currentUser || this.currentUser.balance < lootbox.price) { - this.error = 'Nicht genug Guthaben, um diese Lootbox zu öffnen.'; - // Scroll to top to see the error message - window.scrollTo(0, 0); - this.cdr.detectChanges(); - setTimeout(() => { - this.error = ''; - this.cdr.detectChanges(); - }, 5000); - return; - } - this.router.navigate(['/game/lootboxes/open', lootboxId]); } @@ -162,8 +136,4 @@ export default class LootboxSelectionComponent implements OnInit { formatProbability(probability: number): string { return (probability * 100).toFixed(0) + '%'; } - - hasEnoughBalance(price: number): boolean { - return !!this.currentUser && this.currentUser.balance >= price; - } } diff --git a/frontend/src/app/service/user.service.ts b/frontend/src/app/service/user.service.ts index a76e7b4..5f668c2 100644 --- a/frontend/src/app/service/user.service.ts +++ b/frontend/src/app/service/user.service.ts @@ -33,17 +33,6 @@ export class UserService { this.getCurrentUser().subscribe(); } - public updateLocalBalance(amount: number): void { - const currentUser = this.currentUserSubject.getValue(); - if (currentUser) { - const updatedUser = { - ...currentUser, - balance: currentUser.balance + amount, - }; - this.currentUserSubject.next(updatedUser); - } - } - public createUser(id: string, username: string): Observable { return this.http .post('/backend/user', { diff --git a/frontend/src/app/shared/components/navbar/navbar.component.ts b/frontend/src/app/shared/components/navbar/navbar.component.ts index c8dfe40..5405b07 100644 --- a/frontend/src/app/shared/components/navbar/navbar.component.ts +++ b/frontend/src/app/shared/components/navbar/navbar.component.ts @@ -31,10 +31,7 @@ export class NavbarComponent implements OnInit, OnDestroy { ngOnInit() { this.userSubscription = this.userService.currentUser$.subscribe((user) => { this.balance.set(user?.balance ?? 0); - console.log('Updated navbar balance:', user?.balance); }); - - this.userService.refreshCurrentUser(); } ngOnDestroy() {