feat: new tourment and add bot

src/app/components/move-history/move-history.component.ts

@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Input, OnChanges, Output } from '@angular/core';
+import { Component, ElementRef, EventEmitter, Input, OnChanges, Output, ViewChild } from '@angular/core';
 
 export type MoveNavDirection = 'first' | 'prev' | 'next' | 'last';
 
@@ -16,7 +16,11 @@ interface MovePair {
 })
 export class MoveHistoryComponent implements OnChanges {
   @Input({ required: true }) moves: string[] = [];
+  @Input() viewingPly: number | null = null;
   @Output() navigate = new EventEmitter<MoveNavDirection>();
+  @Output() navigateToPly = new EventEmitter<number>();
+
+  @ViewChild('movesEl') movesEl?: ElementRef<HTMLElement>;
 
   movePairs: MovePair[] = [];
 
@@ -24,24 +28,33 @@ export class MoveHistoryComponent implements OnChanges {
     return this.moves.length;
   }
 
-  get currentWhiteIndex(): number {
-    const lastPairIndex = this.movePairs.length - 1;
-    if (lastPairIndex < 0) return -1;
-    const lastMove = this.moves.length - 1;
-    return lastMove % 2 === 0 ? lastPairIndex : -1;
-  }
-
-  get currentBlackIndex(): number {
-    const lastPairIndex = this.movePairs.length - 1;
-    if (lastPairIndex < 0) return -1;
-    const lastMove = this.moves.length - 1;
-    return lastMove % 2 === 1 ? lastPairIndex : -1;
+  get isLive(): boolean {
+    return this.viewingPly === null || this.viewingPly >= this.moves.length - 1;
   }
 
   ngOnChanges(): void {
     this.movePairs = this.buildPairs(this.moves);
   }
 
+  isWhiteViewing(pairIndex: number): boolean {
+    const ply = this.viewingPly ?? this.moves.length - 1;
+    return ply === pairIndex * 2;
+  }
+
+  isBlackViewing(pairIndex: number): boolean {
+    const ply = this.viewingPly ?? this.moves.length - 1;
+    return ply === pairIndex * 2 + 1;
+  }
+
+  clickWhite(pairIndex: number): void {
+    this.navigateToPly.emit(pairIndex * 2);
+  }
+
+  clickBlack(pairIndex: number, black: string | null): void {
+    if (!black) return;
+    this.navigateToPly.emit(pairIndex * 2 + 1);
+  }
+
   private buildPairs(moves: string[]): MovePair[] {
     const pairs: MovePair[] = [];
     for (let i = 0; i < moves.length; i += 2) {