Minor cleanup #2

client/src/app/site/modules/global-headbar/components/account-button/account-button.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, ViewChild } from '@angular/core';
-import { MatDialog } from '@angular/material/dialog';
+import { MatDialog, MatDialogConfig } from '@angular/material/dialog';
 import { MatMenuTrigger } from '@angular/material/menu';
 import { Router } from '@angular/router';
 import { TranslateService } from '@ngx-translate/core';
@@ -18,6 +18,7 @@ import { ThemeService } from 'src/app/site/services/theme.service';
 import { UserControllerService } from 'src/app/site/services/user-controller.service';
 import { BaseUiComponent } from 'src/app/ui/base/base-ui-component';
 import { ChessDialogComponent } from 'src/app/ui/modules/sidenav/modules/easter-egg/modules/chess-dialog/components/chess-dialog/chess-dialog.component';
+import { ChessChallengeService } from 'src/app/ui/modules/sidenav/modules/easter-egg/modules/chess-dialog/services/chess-challenge.service';
 
 import { AccountDialogComponent } from '../account-dialog/account-dialog.component';
 
@@ -81,9 +82,11 @@ export class AccountButtonComponent extends BaseUiComponent implements OnInit {
         private theme: ThemeService,
         private meetingSettingsService: MeetingSettingsService,
         private activeMeetingIdService: ActiveMeetingIdService,
-        private controller: UserControllerService
+        private controller: UserControllerService,
+        chessChallengeService: ChessChallengeService
     ) {
         super();
+        chessChallengeService.startListening();
     }
 
     public ngOnInit(): void {
@@ -159,7 +162,12 @@ export class AccountButtonComponent extends BaseUiComponent implements OnInit {
 
         if (this.clickCounter === 4) {
             this.clickCounter = 0;
-            this.dialog.open(ChessDialogComponent, { ...mediumDialogSettings });
+            const config: MatDialogConfig = mediumDialogSettings;
+            const match = this.router.url.match(/.*\/participants\/(\d+)\/?$/);
+            if (match) {
+                config.data = { userId: +match[1] };
+            }
+            this.dialog.open(ChessDialogComponent, config);
         } else {
             this.clickTimeout = <any>setTimeout(() => {
                 this.clickCounter = 0;

client/src/app/site/modules/global-headbar/global-headbar.module.ts

@@ -19,6 +19,7 @@ import { RouterModule } from '@angular/router';
 import { DirectivesModule } from 'src/app/ui/directives';
 import { CommaSeparatedListingModule } from 'src/app/ui/modules/comma-separated-listing';
 import { InputModule } from 'src/app/ui/modules/input';
+import { ChessDialogModule } from 'src/app/ui/modules/sidenav/modules/easter-egg/modules/chess-dialog';
 
 import { OpenSlidesTranslationModule } from '../translations';
 import { UserComponentsModule } from '../user-components';
@@ -58,6 +59,7 @@ const DECLARATIONS = [GlobalHeadbarComponent];
         ScrollingModule,
         FormsModule,
         ReactiveFormsModule,
+        ChessDialogModule,
         ...MODULES
     ]
 })

client/src/app/ui/modules/sidenav/modules/easter-egg/components/base-game-dialog/base-game-dialog.ts

@@ -56,7 +56,7 @@ export abstract class BaseGameDialogComponent implements OnInit, OnDestroy {
     /**
      * The channel of the opponent.
      */
-    private replyChannel: string | null = null;
+    protected replyChannel: string | null = null;
 
     /**
      * The opponents name.
@@ -227,6 +227,15 @@ export abstract class BaseGameDialogComponent implements OnInit, OnDestroy {
         return this.op.shortName;
     }
 
+    protected setTimeout(): void {
+        if (this.waitTimout) {
+            clearTimeout(<any>this.waitTimout);
+        }
+        this.waitTimout = <any>setTimeout(() => {
+            this.handleEvent(`waitTimeout`);
+        }, 5000);
+    }
+
     /**
      * Main state machine handler. The current state handler will be called with
      * the given event. If the handler returns a state (and not null), this will be
@@ -276,12 +285,7 @@ export abstract class BaseGameDialogComponent implements OnInit, OnDestroy {
             { name: this.getPlayerName() },
             this.replyChannel!
         );
-        if (this.waitTimout) {
-            clearTimeout(<any>this.waitTimout);
-        }
-        this.waitTimout = <any>setTimeout(() => {
-            this.handleEvent(`waitTimeout`);
-        }, 5000);
+        this.setTimeout();
     }
 
     /**

client/src/app/ui/modules/sidenav/modules/easter-egg/modules/chess-dialog/chess-dialog.module.ts

@@ -4,12 +4,21 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatDialogModule } from '@angular/material/dialog';
 import { MatIconModule } from '@angular/material/icon';
 import { OpenSlidesTranslationModule } from 'src/app/site/modules/translations';
+import { PromptDialogModule, PromptService } from 'src/app/ui/modules/prompt-dialog';
 
 import { ChessDialogComponent } from './components/chess-dialog/chess-dialog.component';
 
 @NgModule({
     declarations: [ChessDialogComponent],
-    imports: [CommonModule, MatButtonModule, MatIconModule, MatDialogModule, OpenSlidesTranslationModule.forChild()]
+    imports: [
+        CommonModule,
+        MatButtonModule,
+        MatIconModule,
+        MatDialogModule,
+        OpenSlidesTranslationModule.forChild(),
+        PromptDialogModule
+    ],
+    providers: [PromptService]
 })
 export class ChessDialogModule {
     public static readonly label = `Play chess`;

client/src/app/ui/modules/sidenav/modules/easter-egg/modules/chess-dialog/components/chess-dialog/chess-dialog.component.html

@@ -5,13 +5,10 @@ <h2 mat-dialog-title class="left-align no-margin">{{ caption | translate }}</h2>
             <mat-icon>close</mat-icon>
         </button>
     </div>
-    <ng-container *ngIf="opponentName">
-        <div class="center spacer-top-5 spacer-bottom-5">{{ 'Playing against' | translate }} {{ opponentName }}</div>
-    </ng-container>
-    <div #chessboard></div>
-
-    <div class="center spacer-top-5">
-        <button (click)="handleEvent('searchClicked')" *ngIf="state === 'start'" mat-raised-button color="accent">
+    <div *ngIf="opponentName" class="center spacer-top-5">{{ 'Playing against' | translate }} {{ opponentName }}</div>
+    <div #chessboard class="spacer-top-5"></div>
+    <div *ngIf="inMeeting && state === 'start'" class="center spacer-top-5">
+        <button (click)="handleEvent('searchClicked')" mat-raised-button color="accent">
             {{ 'Search player' | translate }}
         </button>
     </div>

client/src/app/ui/modules/sidenav/modules/easter-egg/modules/chess-dialog/components/chess-dialog/chess-dialog.component.ts

@@ -1,17 +1,28 @@
-import { Component, ElementRef, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
+import { Component, ElementRef, Inject, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
+import { MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { TranslateService } from '@ngx-translate/core';
 import { Chess, EVENT_TYPE } from 'cm-chess/src/Chess';
 import { BORDER_TYPE, Chessboard, COLOR, FEN, INPUT_EVENT_TYPE } from 'cm-chessboard/src/Chessboard';
 import { PromotionDialog } from 'cm-chessboard/src/extensions/promotion-dialog/PromotionDialog';
+import { Id } from 'src/app/domain/definitions/key-types';
+import { NotifyResponse, NotifyService } from 'src/app/gateways/notify.service';
+import { ActiveMeetingService } from 'src/app/site/pages/meetings/services/active-meeting.service';
+import { OperatorService } from 'src/app/site/services/operator.service';
 
 import { BaseGameDialogComponent, State } from '../../../../components/base-game-dialog/base-game-dialog';
 
+interface ChessDialogConfig {
+    userId?: Id;
+    notify?: NotifyResponse<{ name: string }>;
+}
+
 @Component({
     selector: `os-chess-dialog`,
     templateUrl: `./chess-dialog.component.html`,
     styleUrls: [`./chess-dialog.component.scss`],
     encapsulation: ViewEncapsulation.None
 })
-export class ChessDialogComponent extends BaseGameDialogComponent implements OnInit, OnDestroy {
+export class ChessDialogComponent extends BaseGameDialogComponent implements OnInit {
     protected prefix = `chess`;
 
     /**
@@ -24,6 +35,9 @@ export class ChessDialogComponent extends BaseGameDialogComponent implements OnI
      */
     private board: Chessboard = null;
 
+    /**
+     * The HTML element for the chess board
+     */
     @ViewChild(`chessboard`, { static: true })
     public boardContainer: ElementRef;
 
@@ -32,23 +46,51 @@ export class ChessDialogComponent extends BaseGameDialogComponent implements OnI
      */
     private ownColor: COLOR = COLOR.white;
 
+    public constructor(
+        activeMeetingService: ActiveMeetingService,
+        notifyService: NotifyService,
+        op: OperatorService,
+        translate: TranslateService,
+        @Inject(MAT_DIALOG_DATA) private config: ChessDialogConfig
+    ) {
+        super(activeMeetingService, notifyService, op, translate);
+    }
+
     public override ngOnInit(): void {
         super.ngOnInit();
-        this.board = new Chessboard(this.boardContainer.nativeElement, {
-            position: FEN.start,
-            language: this.translate.currentLang == `de` ? `de` : `en`,
-            assetsUrl: `./chess/`,
-            style: {
-                borderType: BORDER_TYPE.frame
-            },
-            extensions: [{ class: PromotionDialog }]
-        });
-        this.chess.addObserver(({ type }) => {
-            if (type === EVENT_TYPE.initialized || type === EVENT_TYPE.legalMove) {
-                this.board.setPosition(this.chess.fen(), true);
-            }
-        });
         this.caption = this.translate.instant(`Chess`);
+        if (this.inMeeting) {
+            this.board = new Chessboard(this.boardContainer.nativeElement, {
+                position: FEN.start,
+                language: this.translate.currentLang == `de` ? `de` : `en`,
+                assetsUrl: `./chess/`,
+                style: {
+                    borderType: BORDER_TYPE.frame
+                },
+                extensions: [{ class: PromotionDialog }]
+            });
+            this.chess.addObserver(({ type }) => {
+                if (type === EVENT_TYPE.initialized || type === EVENT_TYPE.legalMove) {
+                    this.board.setPosition(this.chess.fen(), true);
+                }
+            });
+        }
+        if (this.config?.userId) {
+            this.state = `waitForResponse`;
+            this.notifyService.sendToUsers(`chess_challenge`, { name: this.getPlayerName() }, this.config.userId);
+            this.caption = this.translate.instant(`Waiting for response...`);
+            const handle = this.SM.waitForResponse.receivedACK.handle;
+            this.SM.waitForResponse.receivedACK.handle = (notify: NotifyResponse<{ name: string }>) => {
+                if (notify.sender_user_id === this.config.userId) {
+                    this.replyChannel = notify.sender_channel_id;
+                    return handle(notify);
+                }
+                return null;
+            };
+        } else if (this.config?.notify) {
+            this.state = `search`;
+            this.handleEvent(`receivedSearchResponse`, this.config.notify);
+        }
     }
 
     protected override reset(): void {

client/src/app/ui/modules/sidenav/modules/easter-egg/modules/chess-dialog/services/chess-challenge.service.ts

@@ -0,0 +1,40 @@
+import { Injectable } from '@angular/core';
+import { MatDialog } from '@angular/material/dialog';
+import { TranslateService } from '@ngx-translate/core';
+import { NotifyResponse, NotifyService } from 'src/app/gateways/notify.service';
+import { mediumDialogSettings } from 'src/app/infrastructure/utils/dialog-settings';
+import { OperatorService } from 'src/app/site/services/operator.service';
+import { PromptService } from 'src/app/ui/modules/prompt-dialog';
+
+import { ChessDialogModule } from '../chess-dialog.module';
+
+@Injectable({
+    providedIn: ChessDialogModule
+})
+export class ChessChallengeService {
+    constructor(
+        private notifyService: NotifyService,
+        private op: OperatorService,
+        private dialog: MatDialog,
+        private translate: TranslateService,
+        private prompt: PromptService
+    ) {}
+
+    public startListening(): void {
+        this.notifyService
+            .getMessageObservable(`chess_challenge`)
+            .subscribe(async (notify: NotifyResponse<{ name: string }>) => {
+                if (!notify.sendByThisUser) {
+                    const title =
+                        notify.message.name + ` ` + this.translate.instant(`challenged you to a chess match!`);
+                    const content = this.translate.instant(`Do you accept?`);
+                    if (await this.prompt.open(title, content)) {
+                        this.dialog.open(ChessDialogModule.getComponent(), {
+                            ...mediumDialogSettings,
+                            data: { notify }
+                        });
+                    }
+                }
+            });
+    }
+}