Compare commits
1 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Janis Eccarius
|
9b72ac9b63 |
@@ -56,23 +56,3 @@
|
||||
### Bug Fixes
|
||||
|
||||
* route play-vs-bot to /vs-bot endpoint ([a620735](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/commit/a62073511f2ac912ceb0f6b4730bef37545dd8ea))
|
||||
## [0.0.0](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/compare/0.2.8...0.0.0) (2026-06-10)
|
||||
|
||||
### Features
|
||||
|
||||
* bots ([#9](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/issues/9)) ([48959da](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/commit/48959daae36e709ea7782ca04fdde699854f8e66))
|
||||
## [0.0.0](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/compare/0.3.0...0.0.0) (2026-06-17)
|
||||
|
||||
### Features
|
||||
|
||||
* NCWF-5/6/7/8/9 chess analysis page and engine integration ([#11](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/issues/11)) ([f9420e5](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/commit/f9420e5848d8724bcb0e9cf08f08b871c91cf4ba))
|
||||
## [0.0.0](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/compare/0.4.0...0.0.0) (2026-06-17)
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **auth:** attach Bearer token to /api/bots requests ([#12](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/issues/12)) ([a54957a](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/commit/a54957aa74ef15bf2dd439d386e221ac134c5c5c))
|
||||
## [0.0.0](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/compare/0.4.1...0.0.0) (2026-06-17)
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* NCS-122 send WS token via first-message auth instead of query param ([#13](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/issues/13)) ([1d2c217](https://git.janis-eccarius.de/NowChess/NowChess-Frontend/commit/1d2c217da8982d361e2eb7de26f6447171a1dd43))
|
||||
|
||||
@@ -64,18 +64,6 @@
|
||||
}
|
||||
.page-title { font-size: 22px; font-weight: 700; margin: 0; letter-spacing: -0.02em; }
|
||||
|
||||
.page-actions { display: flex; align-items: center; gap: 8px; }
|
||||
|
||||
.btn-servers {
|
||||
display: inline-flex; align-items: center; gap: 6px;
|
||||
padding: 7px 14px; border-radius: 8px;
|
||||
border: 1px solid var(--nc-border-strong);
|
||||
background: transparent; color: var(--nc-text-muted);
|
||||
font-size: 13px; font-weight: 600; cursor: pointer;
|
||||
transition: color 0.15s, border-color 0.15s;
|
||||
}
|
||||
.btn-servers:hover { color: var(--nc-text); border-color: var(--nc-text-muted); }
|
||||
|
||||
.btn-new {
|
||||
display: inline-flex; align-items: center; gap: 6px;
|
||||
padding: 7px 14px; border-radius: 8px; border: none;
|
||||
@@ -339,74 +327,3 @@
|
||||
color: var(--nc-success); letter-spacing: 0.06em; text-transform: uppercase;
|
||||
}
|
||||
.pairing-ongoing svg { animation: pulse 1.4s ease-in-out infinite; }
|
||||
|
||||
/* Official bot join section */
|
||||
.join-divider {
|
||||
display: flex; align-items: center; gap: 10px;
|
||||
margin: 20px 0 14px;
|
||||
}
|
||||
.join-divider::before, .join-divider::after {
|
||||
content: ''; flex: 1; height: 1px; background: var(--nc-border);
|
||||
}
|
||||
.join-divider-label {
|
||||
font-size: 10px; font-weight: 600; text-transform: uppercase;
|
||||
letter-spacing: 0.08em; color: var(--nc-text-dim); white-space: nowrap;
|
||||
}
|
||||
|
||||
.official-bot-grid {
|
||||
display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.official-bot-btn {
|
||||
display: flex; align-items: center; justify-content: center; gap: 6px;
|
||||
padding: 9px 4px; border-radius: 8px; border: 1px solid var(--nc-border);
|
||||
background: var(--nc-surface); font-size: 12px; font-weight: 700;
|
||||
cursor: pointer; transition: border-color 0.15s, background 0.15s, color 0.15s;
|
||||
color: var(--nc-text-muted); text-transform: capitalize;
|
||||
}
|
||||
.official-bot-btn:disabled { opacity: 0.45; cursor: not-allowed; }
|
||||
.official-btn-easy:hover:not(:disabled) { border-color: var(--nc-success); color: var(--nc-success); background: rgba(94,229,161,0.07); }
|
||||
.official-btn-medium:hover:not(:disabled) { border-color: var(--nc-warn); color: var(--nc-warn); background: rgba(255,209,102,0.07); }
|
||||
.official-btn-hard:hover:not(:disabled) { border-color: var(--nc-neon); color: var(--nc-neon); background: rgba(255,69,200,0.07); }
|
||||
.official-btn-expert:hover:not(:disabled) { border-color: var(--nc-danger); color: var(--nc-danger); background: rgba(255,122,122,0.07); }
|
||||
|
||||
/* Servers dialog */
|
||||
.servers-dialog { max-width: 480px; }
|
||||
|
||||
.servers-list {
|
||||
display: flex; flex-direction: column; gap: 6px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.server-row {
|
||||
display: flex; align-items: center; gap: 10px;
|
||||
padding: 10px 12px; border-radius: 8px;
|
||||
border: 1px solid var(--nc-border); background: var(--nc-surface);
|
||||
}
|
||||
.server-info { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
|
||||
.server-label { font-size: 13px; font-weight: 600; color: var(--nc-text); }
|
||||
.server-url {
|
||||
font-size: 11px; color: var(--nc-text-dim);
|
||||
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
|
||||
font-family: monospace;
|
||||
}
|
||||
.server-remove-btn {
|
||||
background: none; border: none; cursor: pointer;
|
||||
color: var(--nc-text-dim); padding: 4px; border-radius: 6px;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
flex-shrink: 0; transition: color 0.15s, background 0.15s;
|
||||
font-size: 13px;
|
||||
}
|
||||
.server-remove-btn:hover:not(:disabled) { color: var(--nc-danger); background: rgba(255,122,122,0.1); }
|
||||
.server-remove-btn:disabled { opacity: 0.4; cursor: not-allowed; }
|
||||
|
||||
.server-add-form {
|
||||
border-top: 1px solid var(--nc-border);
|
||||
padding-top: 16px;
|
||||
display: flex; flex-direction: column; gap: 0;
|
||||
}
|
||||
.server-add-heading {
|
||||
font-size: 11px; font-weight: 700; text-transform: uppercase;
|
||||
letter-spacing: 0.08em; color: var(--nc-text-muted);
|
||||
margin: 0 0 14px;
|
||||
}
|
||||
|
||||
@@ -16,25 +16,15 @@
|
||||
<header class="page-header">
|
||||
<div class="page-title-row">
|
||||
<h1 class="page-title">Tournaments</h1>
|
||||
<div class="page-actions">
|
||||
@if (currentUser) {
|
||||
<button type="button" class="btn-servers" (click)="openServersDialog()">
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<rect x="2" y="2" width="20" height="8" rx="2"/><rect x="2" y="14" width="20" height="8" rx="2"/>
|
||||
<line x1="6" y1="6" x2="6.01" y2="6"/><line x1="6" y1="18" x2="6.01" y2="18"/>
|
||||
</svg>
|
||||
Servers
|
||||
</button>
|
||||
<button type="button" class="btn-new" (click)="openCreateDialog()">
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round">
|
||||
<line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/>
|
||||
</svg>
|
||||
New tournament
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
@if (currentUser) {
|
||||
<button type="button" class="btn-new" (click)="openCreateDialog()">
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round">
|
||||
<line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/>
|
||||
</svg>
|
||||
New tournament
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
<div class="tabs" role="tablist">
|
||||
<button type="button" class="tab-btn" [class.active]="tab === 'started'" (click)="setTab('started')">
|
||||
@@ -202,12 +192,12 @@
|
||||
<span class="dialog-brand">Join with a bot</span>
|
||||
<button type="button" class="dialog-close" (click)="closeJoinDialog()">×</button>
|
||||
</div>
|
||||
<p class="join-hint">Select an official (engine-backed) bot to enter this tournament. These are the bots that actually play their moves.</p>
|
||||
<p class="join-hint">Select one of your bots to enter this tournament. Its token will be rotated to authenticate the join.</p>
|
||||
|
||||
@if (botsLoading) {
|
||||
<div class="dialog-loading"><span class="pulse"></span>Loading bots…</div>
|
||||
} @else if (userBots.length === 0) {
|
||||
<p class="join-empty">No official bots are available. The official-bots engine service must be running to register them.</p>
|
||||
<p class="join-empty">You have no bots yet. Go to <strong>Bots</strong> in the nav to create one first.</p>
|
||||
} @else {
|
||||
<div class="bot-pick-list">
|
||||
@for (bot of userBots; track bot.id) {
|
||||
@@ -228,97 +218,6 @@
|
||||
@if (joinError) {
|
||||
<div class="dialog-error">{{ joinError }}</div>
|
||||
}
|
||||
|
||||
<div class="join-divider">
|
||||
<span class="join-divider-label">or join with an official bot</span>
|
||||
</div>
|
||||
|
||||
<div class="official-bot-grid">
|
||||
@for (d of officialDifficulties; track d) {
|
||||
<button type="button" class="official-bot-btn"
|
||||
[class]="'official-btn-' + d"
|
||||
[disabled]="!!joiningOfficialDifficulty || !!joiningBotId"
|
||||
(click)="joinWithOfficialBot(d)">
|
||||
@if (joiningOfficialDifficulty === d) {
|
||||
<span class="pulse"></span>
|
||||
}
|
||||
{{ d | titlecase }}
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
|
||||
@if (officialJoinError) {
|
||||
<div class="dialog-error">{{ officialJoinError }}</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
@if (showServersDialog) {
|
||||
<div class="dialog-overlay" (click)="closeServersDialog()">
|
||||
<div class="dialog-card servers-dialog" (click)="$event.stopPropagation()">
|
||||
<div class="dialog-head">
|
||||
<span class="dialog-brand">Tournament servers</span>
|
||||
<button type="button" class="dialog-close" (click)="closeServersDialog()">×</button>
|
||||
</div>
|
||||
|
||||
<p class="join-hint">External tournament servers aggregated into this view. Tournaments from all servers appear in the list.</p>
|
||||
|
||||
@if (serversLoading) {
|
||||
<div class="dialog-loading"><span class="pulse"></span>Loading servers…</div>
|
||||
} @else if (servers.length === 0) {
|
||||
<p class="join-empty">No external servers registered yet.</p>
|
||||
} @else {
|
||||
<div class="servers-list">
|
||||
@for (s of servers; track s.id) {
|
||||
<div class="server-row">
|
||||
<div class="server-info">
|
||||
<span class="server-label">{{ s.label }}</span>
|
||||
<span class="server-url">{{ s.url }}</span>
|
||||
</div>
|
||||
<button type="button" class="server-remove-btn"
|
||||
[disabled]="removingServerId === s.id"
|
||||
(click)="removeServer(s.id)"
|
||||
title="Remove server">
|
||||
@if (removingServerId === s.id) { … } @else {
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/>
|
||||
<path d="M10 11v6"/><path d="M14 11v6"/>
|
||||
<path d="M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2"/>
|
||||
</svg>
|
||||
}
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
<div class="server-add-form">
|
||||
<h4 class="server-add-heading">Add server</h4>
|
||||
<div class="dialog-field">
|
||||
<label class="dialog-label">Label</label>
|
||||
<input type="text" class="dialog-input" [(ngModel)]="newServerLabel"
|
||||
placeholder="e.g. Local Dev Server" />
|
||||
</div>
|
||||
<div class="dialog-field">
|
||||
<label class="dialog-label">URL</label>
|
||||
<input type="url" class="dialog-input" [(ngModel)]="newServerUrl"
|
||||
placeholder="http://host:8089" />
|
||||
</div>
|
||||
@if (addServerError) {
|
||||
<div class="dialog-error">{{ addServerError }}</div>
|
||||
}
|
||||
<div class="dialog-actions">
|
||||
<button type="button" class="btn-ghost" (click)="closeServersDialog()">Close</button>
|
||||
<button type="button" class="btn-primary"
|
||||
[disabled]="addingServer || !newServerLabel.trim() || !newServerUrl.trim()"
|
||||
(click)="addServer()">
|
||||
{{ addingServer ? 'Adding…' : 'Add' }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -1,13 +1,11 @@
|
||||
import { Component, DestroyRef, OnInit, inject } from '@angular/core';
|
||||
import { CommonModule, TitleCasePipe } from '@angular/common';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { Router, RouterLink } from '@angular/router';
|
||||
import { FormBuilder, FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
|
||||
import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
|
||||
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
||||
import { TournamentService } from '../../services/tournament.service';
|
||||
import { AuthService } from '../../services/auth.service';
|
||||
import { BotService } from '../../services/bot.service';
|
||||
import { OfficialBotService } from '../../services/official-bot.service';
|
||||
import { TournamentServerService, ExternalTournamentServer } from '../../services/tournament-server.service';
|
||||
import { Bot } from '../../models/bot.models';
|
||||
import { Tournament, TournamentResult, RoundPairings } from '../../models/tournament.models';
|
||||
import { CurrentUser } from '../../models/auth.models';
|
||||
@@ -17,7 +15,7 @@ type StatusTab = 'started' | 'created' | 'finished';
|
||||
@Component({
|
||||
selector: 'app-tournaments',
|
||||
standalone: true,
|
||||
imports: [CommonModule, RouterLink, FormsModule, ReactiveFormsModule, TitleCasePipe],
|
||||
imports: [CommonModule, RouterLink, ReactiveFormsModule],
|
||||
templateUrl: './tournaments.component.html',
|
||||
styleUrl: './tournaments.component.css'
|
||||
})
|
||||
@@ -27,8 +25,6 @@ export class TournamentsComponent implements OnInit {
|
||||
private readonly authService = inject(AuthService);
|
||||
private readonly fb = inject(FormBuilder);
|
||||
private readonly botService = inject(BotService);
|
||||
private readonly officialBotService = inject(OfficialBotService);
|
||||
private readonly tournamentServerService = inject(TournamentServerService);
|
||||
private readonly router = inject(Router);
|
||||
|
||||
loading = true;
|
||||
@@ -62,19 +58,6 @@ export class TournamentsComponent implements OnInit {
|
||||
joiningBotId: string | null = null;
|
||||
joinError: string | null = null;
|
||||
|
||||
readonly officialDifficulties = ['easy', 'medium', 'hard', 'expert'] as const;
|
||||
joiningOfficialDifficulty: string | null = null;
|
||||
officialJoinError: string | null = null;
|
||||
|
||||
showServersDialog = false;
|
||||
servers: ExternalTournamentServer[] = [];
|
||||
serversLoading = false;
|
||||
newServerLabel = '';
|
||||
newServerUrl = '';
|
||||
addingServer = false;
|
||||
addServerError: string | null = null;
|
||||
removingServerId: string | null = null;
|
||||
|
||||
ngOnInit(): void {
|
||||
this.authService.currentUser$
|
||||
.pipe(takeUntilDestroyed(this.destroyRef))
|
||||
@@ -175,7 +158,7 @@ export class TournamentsComponent implements OnInit {
|
||||
this.joinDialogTournamentId = tournamentId;
|
||||
this.joinError = null;
|
||||
this.botsLoading = true;
|
||||
this.botService.listOfficial()
|
||||
this.botService.list()
|
||||
.pipe(takeUntilDestroyed(this.destroyRef))
|
||||
.subscribe({
|
||||
next: bots => { this.userBots = bots; this.botsLoading = false; },
|
||||
@@ -187,110 +170,40 @@ export class TournamentsComponent implements OnInit {
|
||||
this.joinDialogTournamentId = null;
|
||||
this.joiningBotId = null;
|
||||
this.joinError = null;
|
||||
this.joiningOfficialDifficulty = null;
|
||||
this.officialJoinError = null;
|
||||
}
|
||||
|
||||
joinWithOfficialBot(difficulty: string): void {
|
||||
if (!this.joinDialogTournamentId || this.joiningOfficialDifficulty || this.joiningBotId) return;
|
||||
this.joiningOfficialDifficulty = difficulty;
|
||||
this.officialJoinError = null;
|
||||
const tid = this.joinDialogTournamentId;
|
||||
this.officialBotService.joinTournament(tid, difficulty).subscribe({
|
||||
next: () => {
|
||||
this.joiningOfficialDifficulty = null;
|
||||
this.closeJoinDialog();
|
||||
this.tournamentService.get(tid)
|
||||
.pipe(takeUntilDestroyed(this.destroyRef))
|
||||
.subscribe(updated => {
|
||||
this.created = this.created.map(x => x.id === tid ? updated : x);
|
||||
this.started = this.started.map(x => x.id === tid ? updated : x);
|
||||
if (this.selectedTournament?.id === tid) this.selectedTournament = updated;
|
||||
});
|
||||
},
|
||||
error: err => {
|
||||
this.joiningOfficialDifficulty = null;
|
||||
this.officialJoinError = err.error?.error ?? 'Failed to join with official bot.';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
joinWithBot(bot: Bot): void {
|
||||
if (!this.joinDialogTournamentId || this.joiningBotId) return;
|
||||
this.joiningBotId = bot.id;
|
||||
this.joinError = null;
|
||||
this.tournamentService.join(this.joinDialogTournamentId, bot.id, bot.name).subscribe({
|
||||
next: () => {
|
||||
this.botService.rotateToken(bot.id).subscribe({
|
||||
next: token => {
|
||||
this.tournamentService.joinWithBotToken(this.joinDialogTournamentId!, token).subscribe({
|
||||
next: () => {
|
||||
this.joiningBotId = null;
|
||||
const tid = this.joinDialogTournamentId!;
|
||||
this.closeJoinDialog();
|
||||
this.tournamentService.get(tid)
|
||||
.pipe(takeUntilDestroyed(this.destroyRef))
|
||||
.subscribe(updated => {
|
||||
this.created = this.created.map(x => x.id === tid ? updated : x);
|
||||
this.started = this.started.map(x => x.id === tid ? updated : x);
|
||||
if (this.selectedTournament?.id === tid) this.selectedTournament = updated;
|
||||
});
|
||||
},
|
||||
error: err => {
|
||||
this.joiningBotId = null;
|
||||
this.joinError = err.error?.message ?? err.error?.error ?? 'Failed to join tournament.';
|
||||
}
|
||||
});
|
||||
},
|
||||
error: () => {
|
||||
this.joiningBotId = null;
|
||||
const tid = this.joinDialogTournamentId!;
|
||||
this.closeJoinDialog();
|
||||
this.tournamentService.get(tid)
|
||||
.pipe(takeUntilDestroyed(this.destroyRef))
|
||||
.subscribe(updated => {
|
||||
this.created = this.created.map(x => x.id === tid ? updated : x);
|
||||
this.started = this.started.map(x => x.id === tid ? updated : x);
|
||||
if (this.selectedTournament?.id === tid) this.selectedTournament = updated;
|
||||
});
|
||||
},
|
||||
error: err => {
|
||||
this.joiningBotId = null;
|
||||
this.joinError = err.error?.message ?? err.error?.error ?? 'Failed to join tournament.';
|
||||
this.joinError = 'Failed to get bot token.';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
openServersDialog(): void {
|
||||
this.newServerLabel = '';
|
||||
this.newServerUrl = '';
|
||||
this.addServerError = null;
|
||||
this.showServersDialog = true;
|
||||
this.serversLoading = true;
|
||||
this.tournamentServerService.list()
|
||||
.pipe(takeUntilDestroyed(this.destroyRef))
|
||||
.subscribe({
|
||||
next: res => { this.servers = res.servers; this.serversLoading = false; },
|
||||
error: () => { this.serversLoading = false; }
|
||||
});
|
||||
}
|
||||
|
||||
closeServersDialog(): void {
|
||||
this.showServersDialog = false;
|
||||
}
|
||||
|
||||
addServer(): void {
|
||||
const label = this.newServerLabel.trim();
|
||||
const url = this.newServerUrl.trim();
|
||||
if (!label || !url || this.addingServer) return;
|
||||
this.addingServer = true;
|
||||
this.addServerError = null;
|
||||
this.tournamentServerService.register(label, url).subscribe({
|
||||
next: server => {
|
||||
this.addingServer = false;
|
||||
this.servers = [...this.servers, server];
|
||||
this.newServerLabel = '';
|
||||
this.newServerUrl = '';
|
||||
this.loadTournaments();
|
||||
},
|
||||
error: err => {
|
||||
this.addingServer = false;
|
||||
this.addServerError = err.error?.error ?? 'Failed to add server.';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
removeServer(id: string): void {
|
||||
if (this.removingServerId) return;
|
||||
this.removingServerId = id;
|
||||
this.tournamentServerService.remove(id).subscribe({
|
||||
next: () => {
|
||||
this.removingServerId = null;
|
||||
this.servers = this.servers.filter(s => s.id !== id);
|
||||
this.loadTournaments();
|
||||
},
|
||||
error: () => { this.removingServerId = null; }
|
||||
});
|
||||
}
|
||||
|
||||
private loadTournaments(): void {
|
||||
this.tournamentService.list()
|
||||
.pipe(takeUntilDestroyed(this.destroyRef))
|
||||
|
||||
@@ -9,8 +9,7 @@ export const authInterceptor: HttpInterceptorFn = (req, next) => {
|
||||
req.url.includes('/api/account/official-bots') ||
|
||||
req.url.includes('/api/board/game') ||
|
||||
req.url.includes('/api/challenge') ||
|
||||
req.url.includes('/api/tournament') ||
|
||||
req.url.includes('/api/bots');
|
||||
req.url.includes('/api/tournament');
|
||||
|
||||
if (token && isProtectedEndpoint && !req.headers.has('Authorization')) {
|
||||
req = req.clone({
|
||||
|
||||
@@ -7,16 +7,11 @@ import { Bot, BotWithToken } from '../models/bot.models';
|
||||
export class BotService {
|
||||
private readonly http = inject(HttpClient);
|
||||
private readonly base = '/api/account/bots';
|
||||
private readonly officialBase = '/api/account/official-bots';
|
||||
|
||||
list(): Observable<Bot[]> {
|
||||
return this.http.get<Bot[]>(this.base);
|
||||
}
|
||||
|
||||
listOfficial(): Observable<Bot[]> {
|
||||
return this.http.get<Bot[]>(this.officialBase);
|
||||
}
|
||||
|
||||
create(name: string): Observable<BotWithToken> {
|
||||
return this.http.post<BotWithToken>(this.base, { name });
|
||||
}
|
||||
|
||||
@@ -6,115 +6,110 @@ import { ChallengeService } from './challenge.service';
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class ChallengeWebSocketService {
|
||||
private readonly challengeEventService = inject(ChallengeEventService);
|
||||
private readonly challengeService = inject(ChallengeService);
|
||||
private readonly router = inject(Router);
|
||||
private readonly challengeEventService = inject(ChallengeEventService);
|
||||
private readonly challengeService = inject(ChallengeService);
|
||||
private readonly router = inject(Router);
|
||||
|
||||
private ws: WebSocket | null = null;
|
||||
private reconnectAttempts = 0;
|
||||
private readonly maxReconnectAttempts = 5;
|
||||
private readonly reconnectDelay = 3000;
|
||||
private intentionalClose = false;
|
||||
private ws: WebSocket | null = null;
|
||||
private reconnectAttempts = 0;
|
||||
private readonly maxReconnectAttempts = 5;
|
||||
private readonly reconnectDelay = 3000;
|
||||
private intentionalClose = false;
|
||||
|
||||
connect(): void {
|
||||
if (this.ws) return;
|
||||
connect(): void {
|
||||
if (this.ws) return;
|
||||
|
||||
const token = localStorage.getItem('token');
|
||||
if (!token) return;
|
||||
const token = localStorage.getItem('token');
|
||||
if (!token) return;
|
||||
|
||||
const url = `${environment.userWsBaseUrl}/api/user/ws`;
|
||||
const url = `${environment.userWsBaseUrl}/api/user/ws?token=${encodeURIComponent(token)}`;
|
||||
|
||||
try {
|
||||
this.intentionalClose = false;
|
||||
this.ws = new WebSocket(url);
|
||||
try {
|
||||
this.intentionalClose = false;
|
||||
this.ws = new WebSocket(url);
|
||||
|
||||
this.ws.onopen = () => {
|
||||
this.ws.onopen = () => {
|
||||
this.reconnectAttempts = 0;
|
||||
};
|
||||
|
||||
this.ws.onmessage = (event) => {
|
||||
this.handleMessage(event.data as string);
|
||||
};
|
||||
|
||||
this.ws.onerror = () => {
|
||||
// onclose fires right after, handles reconnect
|
||||
};
|
||||
|
||||
this.ws.onclose = () => {
|
||||
this.ws = null;
|
||||
if (!this.intentionalClose) {
|
||||
this.attemptReconnect();
|
||||
}
|
||||
};
|
||||
} catch {
|
||||
this.attemptReconnect();
|
||||
}
|
||||
}
|
||||
|
||||
disconnect(): void {
|
||||
this.intentionalClose = true;
|
||||
this.reconnectAttempts = 0;
|
||||
this.ws?.send(JSON.stringify({ type: 'auth', token }));
|
||||
};
|
||||
|
||||
this.ws.onmessage = (event) => {
|
||||
this.handleMessage(event.data as string);
|
||||
};
|
||||
|
||||
this.ws.onerror = () => {
|
||||
// onclose fires right after, handles reconnect
|
||||
};
|
||||
|
||||
this.ws.onclose = () => {
|
||||
this.ws = null;
|
||||
if (!this.intentionalClose) {
|
||||
this.attemptReconnect();
|
||||
if (this.ws) {
|
||||
this.ws.close();
|
||||
this.ws = null;
|
||||
}
|
||||
};
|
||||
} catch {
|
||||
this.attemptReconnect();
|
||||
}
|
||||
}
|
||||
|
||||
disconnect(): void {
|
||||
this.intentionalClose = true;
|
||||
this.reconnectAttempts = 0;
|
||||
if (this.ws) {
|
||||
this.ws.close();
|
||||
this.ws = null;
|
||||
}
|
||||
}
|
||||
|
||||
private handleMessage(data: string): void {
|
||||
let message: Record<string, unknown>;
|
||||
try {
|
||||
message = JSON.parse(data) as Record<string, unknown>;
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
switch (message['type']) {
|
||||
case 'CONNECTED':
|
||||
break;
|
||||
private handleMessage(data: string): void {
|
||||
let message: Record<string, unknown>;
|
||||
try {
|
||||
message = JSON.parse(data) as Record<string, unknown>;
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
case 'challengeCreated': {
|
||||
const challengeId = message['challengeId'] as string | undefined;
|
||||
if (challengeId) {
|
||||
this.challengeService.getChallenge(challengeId).subscribe({
|
||||
next: (challenge) => this.challengeEventService.onChallengeReceived(challenge),
|
||||
error: () => {
|
||||
/* challenge may have already expired */
|
||||
},
|
||||
});
|
||||
}
|
||||
break;
|
||||
}
|
||||
switch (message['type']) {
|
||||
case 'CONNECTED':
|
||||
break;
|
||||
|
||||
case 'challengeAccepted': {
|
||||
const challengeId = message['challengeId'] as string | undefined;
|
||||
const gameId = message['gameId'] as string | undefined;
|
||||
if (challengeId) {
|
||||
this.challengeEventService.removeChallenge(challengeId);
|
||||
}
|
||||
if (gameId) {
|
||||
void this.router.navigate(['/game', gameId]);
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'challengeCreated': {
|
||||
const challengeId = message['challengeId'] as string | undefined;
|
||||
if (challengeId) {
|
||||
this.challengeService.getChallenge(challengeId).subscribe({
|
||||
next: challenge => this.challengeEventService.onChallengeReceived(challenge),
|
||||
error: () => { /* challenge may have already expired */ }
|
||||
});
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
case 'challengeDeclined':
|
||||
case 'challengeExpired':
|
||||
case 'challengeCancelled': {
|
||||
const challengeId = message['challengeId'] as string | undefined;
|
||||
if (challengeId) {
|
||||
this.challengeEventService.removeChallenge(challengeId);
|
||||
case 'challengeAccepted': {
|
||||
const challengeId = message['challengeId'] as string | undefined;
|
||||
const gameId = message['gameId'] as string | undefined;
|
||||
if (challengeId) {
|
||||
this.challengeEventService.removeChallenge(challengeId);
|
||||
}
|
||||
if (gameId) {
|
||||
void this.router.navigate(['/game', gameId]);
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
case 'challengeDeclined':
|
||||
case 'challengeExpired':
|
||||
case 'challengeCancelled': {
|
||||
const challengeId = message['challengeId'] as string | undefined;
|
||||
if (challengeId) {
|
||||
this.challengeEventService.removeChallenge(challengeId);
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private attemptReconnect(): void {
|
||||
if (this.intentionalClose || this.reconnectAttempts >= this.maxReconnectAttempts) return;
|
||||
this.reconnectAttempts++;
|
||||
setTimeout(() => {
|
||||
this.connect();
|
||||
}, this.reconnectDelay);
|
||||
}
|
||||
private attemptReconnect(): void {
|
||||
if (this.intentionalClose || this.reconnectAttempts >= this.maxReconnectAttempts) return;
|
||||
this.reconnectAttempts++;
|
||||
setTimeout(() => { this.connect(); }, this.reconnectDelay);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -7,7 +7,7 @@ import {
|
||||
GameState,
|
||||
GameStreamEvent,
|
||||
LegalMovesResponse,
|
||||
PlayerInfo,
|
||||
PlayerInfo
|
||||
} from '../models/game.models';
|
||||
import { AnalysisRequest, AnalysisResponse } from '../models/analysis.models';
|
||||
import { StreamHandlerService } from './stream-handler.service';
|
||||
@@ -29,11 +29,11 @@ export class GameApiService {
|
||||
const playerColor = Math.random() > 0.5 ? 'white' : 'black';
|
||||
const playerInfo: PlayerInfo = {
|
||||
id: `player-${Date.now()}`,
|
||||
displayName: 'You',
|
||||
displayName: 'You'
|
||||
};
|
||||
const botInfo: PlayerInfo = {
|
||||
id: `bot-${difficulty}`,
|
||||
displayName: `Bot (${difficulty})`,
|
||||
displayName: `Bot (${difficulty})`
|
||||
};
|
||||
|
||||
const payload =
|
||||
@@ -57,9 +57,7 @@ export class GameApiService {
|
||||
if (square) {
|
||||
params = params.set('square', square);
|
||||
}
|
||||
return this.http.get<LegalMovesResponse>(`${this.apiBase}${this.apiPath}/${gameId}/moves`, {
|
||||
params,
|
||||
});
|
||||
return this.http.get<LegalMovesResponse>(`${this.apiBase}${this.apiPath}/${gameId}/moves`, { params });
|
||||
}
|
||||
|
||||
importFen(fen: string): Observable<GameFull> {
|
||||
@@ -92,8 +90,11 @@ export class GameApiService {
|
||||
}
|
||||
|
||||
streamGame(gameId: string): Observable<GameStreamEvent> {
|
||||
const wsUrl = `${this.resolveWsBase()}${this.apiPath}/${gameId}/ws`;
|
||||
const token = localStorage.getItem('token') ?? '';
|
||||
return this.streamHandler.createGameStream(wsUrl, gameId, token);
|
||||
const token = localStorage.getItem('token');
|
||||
let wsUrl = `${this.resolveWsBase()}${this.apiPath}/${gameId}/ws`;
|
||||
if (token) {
|
||||
wsUrl += `?token=${encodeURIComponent(token)}`;
|
||||
}
|
||||
return this.streamHandler.createGameStream(wsUrl, gameId);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,22 +0,0 @@
|
||||
import { Injectable, inject } from '@angular/core';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { Observable } from 'rxjs';
|
||||
|
||||
export interface JoinTournamentResponse {
|
||||
botId: string;
|
||||
difficulty: string;
|
||||
status: string;
|
||||
}
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class OfficialBotService {
|
||||
private readonly http = inject(HttpClient);
|
||||
private readonly base = '/api/bots/official';
|
||||
|
||||
joinTournament(tournamentId: string, difficulty: string): Observable<JoinTournamentResponse> {
|
||||
return this.http.post<JoinTournamentResponse>(`${this.base}/join-tournament`, {
|
||||
tournamentId,
|
||||
difficulty,
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -6,7 +6,7 @@ const WS_CONNECT_TIMEOUT_MS = 3000;
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class StreamHandlerService {
|
||||
createGameStream(wsUrl: string, gameId: string, token: string): Observable<GameStreamEvent> {
|
||||
createGameStream(wsUrl: string, gameId: string): Observable<GameStreamEvent> {
|
||||
return new Observable<GameStreamEvent>((observer) => {
|
||||
const ws = new WebSocket(wsUrl);
|
||||
let connected = false;
|
||||
@@ -14,7 +14,7 @@ export class StreamHandlerService {
|
||||
const emitErrorEvent = (message: string): void => {
|
||||
const errorEvent: ErrorEvent = {
|
||||
type: 'error',
|
||||
error: { code: 'STREAM_ERROR', message },
|
||||
error: { code: 'STREAM_ERROR', message }
|
||||
};
|
||||
observer.next(errorEvent);
|
||||
};
|
||||
@@ -36,7 +36,6 @@ export class StreamHandlerService {
|
||||
connected = true;
|
||||
clearTimeout(connectionTimeoutId);
|
||||
console.log(`[StreamHandler] WebSocket connected for ${gameId}`);
|
||||
ws.send(JSON.stringify({ type: 'auth', token }));
|
||||
};
|
||||
|
||||
ws.onmessage = (message) => {
|
||||
|
||||
@@ -1,31 +0,0 @@
|
||||
import { Injectable, inject } from '@angular/core';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { Observable } from 'rxjs';
|
||||
|
||||
export interface ExternalTournamentServer {
|
||||
id: string;
|
||||
label: string;
|
||||
url: string;
|
||||
}
|
||||
|
||||
export interface ExternalTournamentServerList {
|
||||
servers: ExternalTournamentServer[];
|
||||
}
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class TournamentServerService {
|
||||
private readonly http = inject(HttpClient);
|
||||
private readonly base = '/api/tournament/servers';
|
||||
|
||||
list(): Observable<ExternalTournamentServerList> {
|
||||
return this.http.get<ExternalTournamentServerList>(this.base);
|
||||
}
|
||||
|
||||
register(label: string, url: string): Observable<ExternalTournamentServer> {
|
||||
return this.http.post<ExternalTournamentServer>(this.base, { label, url });
|
||||
}
|
||||
|
||||
remove(id: string): Observable<void> {
|
||||
return this.http.delete<void>(`${this.base}/${id}`);
|
||||
}
|
||||
}
|
||||
@@ -40,8 +40,10 @@ export class TournamentService {
|
||||
return this.http.post<Tournament>(`${this.base}/${id}/start`, null);
|
||||
}
|
||||
|
||||
join(id: string, botId: string, botName: string): Observable<void> {
|
||||
return this.http.post<void>(`${this.base}/${id}/join`, { botId, botName });
|
||||
joinWithBotToken(id: string, botToken: string): Observable<void> {
|
||||
return this.http.post<void>(`${this.base}/${id}/join`, null, {
|
||||
headers: new HttpHeaders({ Authorization: `Bearer ${botToken}` })
|
||||
});
|
||||
}
|
||||
|
||||
roundPairings(id: string, round: number): Observable<RoundPairings> {
|
||||
|
||||
+2
-2
@@ -1,3 +1,3 @@
|
||||
MAJOR=0
|
||||
MINOR=4
|
||||
PATCH=2
|
||||
MINOR=2
|
||||
PATCH=8
|
||||
|
||||
Reference in New Issue
Block a user