Add some tooltips

gbtami · Jan 30, 2025 · b5cef63 · b5cef63
1 parent c1a9142
commit b5cef63
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 6 deletions.
diff --git a/client/bug/movelist.bug.ts b/client/bug/movelist.bug.ts
@@ -1,5 +1,6 @@
 import { h, VNode } from 'snabbdom';
 
+import { _ } from '@/i18n';
 import AnalysisControllerBughouse from './analysisCtrl.bug';
 import { result } from '../result'
 import { patch } from '../document';
@@ -70,8 +71,8 @@ export function activatePlyVari (ply: number) {
 export function createMovelistButtons (ctrl: AnalysisControllerBughouse | RoundControllerBughouse ) {
     const container = document.getElementById('move-controls') as HTMLElement;
     let buttons = [
-        h('button', { on: { click: () => ctrl.flipBoards() } }, [ h('i.icon.icon-refresh') ]),
-        h('button', { on: { click: () => ctrl.switchBoards() } }, [ h('i.icon.icon-exchange') ]),
+        h('button', { on: { click: () => ctrl.flipBoards() }, props: { title: _('Flip boards')} }, [ h('i.icon.icon-refresh') ]),
+        h('button', { on: { click: () => ctrl.switchBoards() }, props: { title: _('Switch boards')} }, [ h('i.icon.icon-exchange') ]),
         h('button', { on: { click: () => selectMove(ctrl, 0) } }, [ h('i.icon.icon-fast-backward') ]),
         h('button', { on: { click: () => selectMove(ctrl, ctrl.ply - 1, ctrl.plyVari) } }, [ h('i.icon.icon-step-backward') ]),
         h('button', { on: { click: () => selectMove(ctrl, ctrl.ply + 1, ctrl.plyVari) } }, [ h('i.icon.icon-step-forward') ]),

diff --git a/client/movelist.ts b/client/movelist.ts
@@ -1,5 +1,6 @@
 import { h, VNode } from 'snabbdom';
 
+import { _ } from './i18n';
 import { GameController } from './gameCtrl';
 import { result } from './result'
 import { Step } from './messages';
@@ -68,22 +69,22 @@ export function activatePlyVari (ply: number) {
 export function createMovelistButtons (ctrl: GameController) {
     const container = document.getElementById('move-controls') as HTMLElement;
     let buttons = [
-        h('button', { on: { click: () => ctrl.toggleOrientation() } }, [ h('i.icon.icon-refresh') ]),
+        h('button', { on: { click: () => ctrl.toggleOrientation() }, props: { title: _('Flip board')} }, [ h('i.icon.icon-refresh') ]),
         h('button', { on: { click: () => selectMove(ctrl, 0) } }, [ h('i.icon.icon-fast-backward') ]),
         h('button', { on: { click: () => selectMove(ctrl, ctrl.ply - 1, ctrl.plyVari) } }, [ h('i.icon.icon-step-backward') ]),
         h('button', { on: { click: () => selectMove(ctrl, ctrl.ply + 1, ctrl.plyVari) } }, [ h('i.icon.icon-step-forward') ]),
         h('button', { on: { click: () => selectMove(ctrl, ctrl.steps.length - 1) } }, [ h('i.icon.icon-fast-forward') ]),
     ];
     if (ctrl.variant.name === 'alice') {
-        buttons.push(h('button#alice', { on: { click: () => ctrl.switchAliceBoards() } }, [ h('i.icon.icon-exchange') ]));
+        buttons.push(h('button#alice', { on: { click: () => ctrl.switchAliceBoards() }, props: { title: _('Switch boards')} }, [ h('i.icon.icon-exchange') ]));
     }
 
     if ("localEngine" in ctrl) {
-        buttons.push(h('button#bars', { on: { click: () => ctrl.toggleSettings() } }, [ h('i.icon.icon-bars') ]));
+        buttons.push(h('button#bars', { on: { click: () => ctrl.toggleSettings() }, props: { title: _('Menu')} }, [ h('i.icon.icon-bars') ]));
     } else {
         if (ctrl.corr && ctrl.variant.name !== 'fogofwar') {
             const url = ctrl.home + '/corranalysis/' + ctrl.gameId + `?ply=${ctrl.ply + 1}`;
-            buttons.push(h('button#corr', { on: { click: () => window.location.assign(url) } }, [ h('i.icon.icon-microscope') ]));
+            buttons.push(h('button#corr', { on: { click: () => window.location.assign(url) }, props: { title: _('Analysis board')} }, [ h('i.icon.icon-microscope') ]));
         }
     }