fix links in broadcast chatp

ui/analyse/src/study/interfaces.ts

@@ -295,3 +295,8 @@ export interface WithChapterId {
 
 export type WithWhoAndPos = WithWho & WithPosition;
 export type WithWhoAndChap = WithWho & WithChapterId;
+
+export interface ChapterSelect {
+  is: (idOrNumber: ChapterId | number) => boolean;
+  set: (idOrNumber: ChapterId | number, force?: boolean) => Promise<boolean>;
+}

ui/analyse/src/study/multiBoard.ts

@@ -74,7 +74,7 @@ export function view(ctrl: MultiBoardCtrl, study: StudyCtrl): MaybeVNode {
       'div.now-playing',
       {
         hook: {
-          insert: gameLinksListener(study.setChapter),
+          insert: gameLinksListener(study.chapterSelect),
         },
       },
       pager.currentPageResults.map(makePreview(basePath, study.vm.chapterId, cloudEval)),

ui/analyse/src/study/relay/relayCtrl.ts

@@ -1,5 +1,5 @@
 import { RelayData, LogEvent, RelaySync, RelayRound, RoundId } from './interfaces';
-import { BothClocks, ChapterId, Federations, ServerClockMsg } from '../interfaces';
+import { BothClocks, ChapterId, ChapterSelect, Federations, ServerClockMsg } from '../interfaces';
 import { StudyMemberCtrl } from '../studyMembers';
 import { AnalyseSocketSend } from '../../socket';
 import { Prop, Toggle, defined, notNull, prop, toggle } from 'common';
@@ -36,7 +36,7 @@ export default class RelayCtrl {
     private readonly chapters: StudyChapters,
     private readonly multiCloudEval: MultiCloudEval,
     private readonly federations: () => Federations | undefined,
-    setChapter: (id: ChapterId | number) => Promise<boolean>,
+    chapterSelect: ChapterSelect,
   ) {
     this.tourShow = toggle((location.pathname.split('/broadcast/')[1].match(/\//g) || []).length < 5);
     const locationTab = location.hash.replace(/^#/, '') as RelayTab;
@@ -47,7 +47,7 @@ export default class RelayCtrl {
       : 'boards';
     this.tab = prop<RelayTab>(initialTab);
     this.teams = data.tour.teamTable
-      ? new RelayTeams(id, this.multiCloudEval, setChapter, this.roundPath, redraw)
+      ? new RelayTeams(id, this.multiCloudEval, chapterSelect, this.roundPath, redraw)
       : undefined;
     this.leaderboard = data.tour.leaderboard
       ? new RelayLeaderboard(data.tour.id, this.federations, redraw)

ui/analyse/src/study/relay/relayTeams.ts

@@ -1,7 +1,7 @@
 import { MaybeVNodes, Redraw, VNode, onInsert, looseH as h } from 'common/snabbdom';
 import * as xhr from 'common/xhr';
 import { RoundId } from './interfaces';
-import { ChapterId, ChapterPreview, ChapterPreviewPlayer, StatusStr } from '../interfaces';
+import { ChapterId, ChapterPreview, ChapterPreviewPlayer, ChapterSelect, StatusStr } from '../interfaces';
 import { MultiCloudEval, renderScoreAtDepth } from '../multiCloudEval';
 import { spinnerVdom as spinner } from 'common/spinner';
 import { playerFed } from '../playerBars';
@@ -31,7 +31,7 @@ export default class RelayTeams {
   constructor(
     private readonly roundId: RoundId,
     readonly multiCloudEval: MultiCloudEval,
-    readonly setChapter: (id: ChapterId | number) => Promise<boolean>,
+    readonly chapterSelect: ChapterSelect,
     readonly roundPath: () => string,
     private readonly redraw: Redraw,
   ) {}
@@ -53,7 +53,7 @@ export const teamsView = (ctrl: RelayTeams, chapters: StudyChapters) =>
       class: { loading: ctrl.loading, nodata: !ctrl.teams },
       hook: {
         insert: vnode => {
-          gameLinksListener(ctrl.setChapter)(vnode);
+          gameLinksListener(ctrl.chapterSelect)(vnode);
           ctrl.loadFromXhr(true);
         },
       },

ui/analyse/src/study/relay/relayTourView.ts

@@ -44,7 +44,7 @@ export const tourSide = (ctx: RelayViewContext) => {
     'aside.relay-tour__side',
     {
       hook: {
-        insert: gameLinksListener(study.setChapter),
+        insert: gameLinksListener(study.chapterSelect),
       },
     },
     [

ui/analyse/src/study/studyChapters.ts

@@ -18,6 +18,7 @@ import {
   Federations,
   ChapterPreviewPlayerFromServer,
   ChapterPreviewPlayer,
+  ChapterSelect,
 } from './interfaces';
 import StudyCtrl from './studyCtrl';
 import { opposite } from 'chessops/util';
@@ -138,22 +139,21 @@ export function resultOf(tags: TagArray[], isWhite: boolean): string | undefined
 export const gameLinkAttrs = (basePath: string, game: { id: ChapterId }) => ({
   href: `${basePath}/${game.id}`,
 });
-export const gameLinksListener =
-  (setChapter: (id: ChapterId | number) => Promise<boolean>) => (vnode: VNode) =>
-    (vnode.elm as HTMLElement).addEventListener(
-      'click',
-      async e => {
-        let target = e.target as HTMLLinkElement;
-        while (target && target.tagName !== 'A') target = target.parentNode as HTMLLinkElement;
-        const href = target?.href;
-        const id = target?.dataset['board'] || href?.match(/^[^?#]*/)?.[0].slice(-8);
-        if (id) {
-          if (!href?.match(/[?&]embed=/)) e.preventDefault();
-          await setChapter(id);
-        }
-      },
-      { passive: false },
-    );
+export const gameLinksListener = (select: ChapterSelect) => (vnode: VNode) =>
+  (vnode.elm as HTMLElement).addEventListener(
+    'click',
+    async e => {
+      let target = e.target as HTMLLinkElement;
+      while (target && target.tagName !== 'A') target = target.parentNode as HTMLLinkElement;
+      const href = target?.href;
+      const id = target?.dataset['board'] || href?.match(/^[^?#]*/)?.[0].slice(-8);
+      if (id && select.is(id)) {
+        if (!href?.match(/[?&]embed=/)) e.preventDefault();
+        await select.set(id);
+      }
+    },
+    { passive: false },
+  );
 
 export function view(ctrl: StudyCtrl): VNode {
   const canContribute = ctrl.members.canContribute(),

ui/analyse/src/study/studyCtrl.ts

@@ -37,6 +37,7 @@ import {
   StudyDataFromServer,
   StudyData,
   ChapterPreviewFromServer,
+  ChapterSelect,
 } from './interfaces';
 import GamebookPlayCtrl from './gamebook/gamebookPlayCtrl';
 import { DescriptionCtrl } from './description';
@@ -169,7 +170,7 @@ export default class StudyCtrl {
         this.chapters.list,
         this.multiCloudEval,
         () => this.data.federations,
-        id => this.setChapter(id),
+        this.chapterSelect,
       );
     this.multiBoard = new MultiBoardCtrl(
       this.chapters.list,
@@ -481,6 +482,11 @@ export default class StudyCtrl {
     return true;
   };
 
+  chapterSelect: ChapterSelect = {
+    is: (idOrNumber: ChapterId | number) => defined(this.chapters.list.get(idOrNumber)),
+    set: this.setChapter,
+  };
+
   private deltaChapter = (delta: number): ChapterPreview | undefined => {
     const chs = this.chapters.list.all();
     const i = chs.findIndex(ch => ch.id === this.vm.chapterId);