From 3149b15d2e87da9a3c85cf9739292d7a48c6dc8c Mon Sep 17 00:00:00 2001 From: GreenAsJade Date: Sat, 14 Sep 2024 17:14:16 +0930 Subject: [PATCH 1/2] Provide a "stone font scale" preference, use it to set Goban stone font scale. --- src/components/MiniGoban/MiniGoban.tsx | 1 + src/lib/configure-goban.tsx | 1 + src/lib/preferences.ts | 7 +-- src/views/Game/Game.tsx | 1 + src/views/Joseki/Joseki.tsx | 2 + src/views/LearningHub/InstructionalGoban.tsx | 3 ++ src/views/Settings/ThemePreferences.styl | 8 ++-- src/views/Settings/ThemePreferences.tsx | 50 ++++++++++++++++++++ 8 files changed, 66 insertions(+), 7 deletions(-) diff --git a/src/components/MiniGoban/MiniGoban.tsx b/src/components/MiniGoban/MiniGoban.tsx index 486ccb0417..17443c2104 100644 --- a/src/components/MiniGoban/MiniGoban.tsx +++ b/src/components/MiniGoban/MiniGoban.tsx @@ -130,6 +130,7 @@ export function MiniGoban(props: MiniGobanProps): JSX.Element { height: props.height || (props.json ? props.json.height : 19), last_move_opacity: last_move_opacity, variation_stone_opacity: preferences.get("variation-stone-opacity"), + stone_font_scale: preferences.get("stone-font-scale"), }, props.json, ); diff --git a/src/lib/configure-goban.tsx b/src/lib/configure-goban.tsx index 81090a29e3..1ef5ac7e81 100644 --- a/src/lib/configure-goban.tsx +++ b/src/lib/configure-goban.tsx @@ -107,6 +107,7 @@ export function configure_goban() { getShowVariationMoveNumbers: (): boolean => preferences.get("show-variation-move-numbers"), getMoveTreeNumbering: (): "none" | "move-number" | "move-coordinates" => preferences.get("move-tree-numbering"), + getStoneFontScale: (): number => preferences.get("stone-font-scale"), getCDNReleaseBase: (): string => data.get("config.cdn_release", ""), getSoundEnabled: (): boolean => sfx.getVolume("master") > 0, getSoundVolume: (): number => sfx.getVolume("master"), diff --git a/src/lib/preferences.ts b/src/lib/preferences.ts index 048e1c997e..4b1d24989d 100644 --- a/src/lib/preferences.ts +++ b/src/lib/preferences.ts @@ -39,6 +39,9 @@ export const defaults = { "chat-mode": "main", "desktop-notifications": true, "desktop-notifications-require-interaction": false, + "dynamic-title": true, + "function-keys-enabled": false, + "game-list-threshold": 10, "dock-delay": 0, // seconds. "double-click-submit-correspondence": false, "double-click-submit-live": false, @@ -46,9 +49,7 @@ export const defaults = { "variation-stone-opacity": 0.6, "variation-move-count": 10, "visual-undo-request-indicator": true, - "dynamic-title": true, - "function-keys-enabled": false, - "game-list-threshold": 10, + "stone-font-scale": 1.0, "goban-theme-black": null as null | string, "goban-theme-board": null as null | string, "goban-theme-white": null as null | string, diff --git a/src/views/Game/Game.tsx b/src/views/Game/Game.tsx index 132d99118a..837b16921b 100644 --- a/src/views/Game/Game.tsx +++ b/src/views/Game/Game.tsx @@ -1125,6 +1125,7 @@ export function Game(): JSX.Element | null { draw_right_labels: label_position === "all" || label_position.indexOf("right") >= 0, draw_bottom_labels: label_position === "all" || label_position.indexOf("bottom") >= 0, variation_stone_opacity: preferences.get("variation-stone-opacity"), + stone_font_scale: preferences.get("stone-font-scale"), onScoreEstimationUpdated: () => { goban.current?.redraw(true); }, diff --git a/src/views/Joseki/Joseki.tsx b/src/views/Joseki/Joseki.tsx index 43ac079d2b..fc522ab376 100644 --- a/src/views/Joseki/Joseki.tsx +++ b/src/views/Joseki/Joseki.tsx @@ -26,6 +26,7 @@ import { RouteComponentProps, rr6ClassShim } from "@/lib/ogs-rr6-shims"; import * as queryString from "query-string"; import * as data from "@/lib/data"; +import * as preferences from "@/lib/preferences"; import { _, interpolate, pgettext, npgettext } from "@/lib/translate"; import { get, put, post } from "@/lib/requests"; import { KBShortcut } from "@/components/KBShortcut"; @@ -329,6 +330,7 @@ class _Joseki extends React.Component { player_id: 0, server_socket: undefined, square_size: 20, + stone_font_scale: preferences.get("stone-font-scale"), }; if (initial_position) { diff --git a/src/views/LearningHub/InstructionalGoban.tsx b/src/views/LearningHub/InstructionalGoban.tsx index c6cff43b2b..6b61f0dd3e 100644 --- a/src/views/LearningHub/InstructionalGoban.tsx +++ b/src/views/LearningHub/InstructionalGoban.tsx @@ -16,6 +16,7 @@ */ import * as React from "react"; +import * as preferences from "@/lib/preferences"; import { createGoban, GobanRenderer } from "goban"; import { sfx } from "@/lib/sfx"; import { PersistentElement } from "@/components/PersistentElement"; @@ -78,6 +79,8 @@ export class InstructionalGoban extends React.Component puzzle_opponent_move_mode: "automatic", puzzle_player_move_mode: "free", + stone_font_scale: preferences.get("stone-font-scale"), + getPuzzlePlacementSetting: () => { return { mode: "play" }; }, diff --git a/src/views/Settings/ThemePreferences.styl b/src/views/Settings/ThemePreferences.styl index 6c0dcc0d30..54feec2532 100644 --- a/src/views/Settings/ThemePreferences.styl +++ b/src/views/Settings/ThemePreferences.styl @@ -23,23 +23,23 @@ align-items: center; justify-content: center; align-content: center; - + .title { display: inline-block; padding-right: 1rem; } } - + .small.board { padding-left: 0; } - + .MiniGoban.inline { height: 1.5rem; width: 10rem; margin-left: 3rem; } - + div.with-sample-goban { .left { display: inline-flex; diff --git a/src/views/Settings/ThemePreferences.tsx b/src/views/Settings/ThemePreferences.tsx index fe800e9863..83699f0731 100644 --- a/src/views/Settings/ThemePreferences.tsx +++ b/src/views/Settings/ThemePreferences.tsx @@ -80,6 +80,7 @@ export function ThemePreferences(): JSX.Element | null { "visual-undo-request-indicator", ); const [last_move_opacity, _setLastMoveOpacity] = usePreference("last-move-opacity"); + const [stone_font_scale, _setStoneFontScale] = usePreference("stone-font-scale"); /* const [variation_stone_opacity, _setVariationStoneOpacity] = usePreference("variation-stone-opacity"); @@ -117,6 +118,14 @@ export function ThemePreferences(): JSX.Element | null { _setShowVariationMoveNumbers(tf); }, []); + function setStoneFontScale(ev: React.ChangeEvent) { + const value = parseFloat(ev.target.value); + + if (value >= 0.3 && value <= 1.3) { + _setStoneFontScale(value); + } + } + function setLastMoveOpacity(ev: React.ChangeEvent) { const value = parseFloat(ev.target.value); @@ -143,6 +152,7 @@ export function ThemePreferences(): JSX.Element | null { (enable_svg ? "svg" : "canvas") + board_labeling + label_positioning + + stone_font_scale + //stone_removal_graphic + //removal_scale + visual_undo_request_indicator + @@ -269,6 +279,46 @@ export function ThemePreferences(): JSX.Element | null { checked={removal_scale < 1.0} /> + +
+
+ + {stone_font_scale} +
+ + +
+ Date: Sat, 14 Sep 2024 18:41:36 +0930 Subject: [PATCH 2/2] Finer control (I like 0.85 :) ) --- src/views/Settings/ThemePreferences.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/views/Settings/ThemePreferences.tsx b/src/views/Settings/ThemePreferences.tsx index 83699f0731..2ff877bf86 100644 --- a/src/views/Settings/ThemePreferences.tsx +++ b/src/views/Settings/ThemePreferences.tsx @@ -287,7 +287,7 @@ export function ThemePreferences(): JSX.Element | null {