From 0a8746532fc83817fad3f52941c2816a661d5a24 Mon Sep 17 00:00:00 2001 From: latenitecode <85068850+latenitecoding@users.noreply.github.com> Date: Sun, 4 Feb 2024 11:00:14 -0600 Subject: [PATCH 1/2] feat: adds option to disable comments (#10) --- README.md | 1 + src/components/obsidian/SettingsTab.ts | 18 ++++++++++++++++++ src/components/react/ChessStudy.tsx | 24 ++++++++++++------------ 3 files changed, 31 insertions(+), 12 deletions(-) diff --git a/README.md b/README.md index 147af73..beb59c6 100644 --- a/README.md +++ b/README.md @@ -71,6 +71,7 @@ Here are the available settings for a `chessStudy` code block: | `chessStudyId` | Valid nanoid | Valid ID for a file stored in the plugin storage | | `boardOrientation` | `white` \| `black` | Orientation of the board | | `boardColor` | `green` \| `brown` | Color of the board | +| `viewComments` | `true` \| `false` | Whether to display the comments section | You can permanently set some settings in the [Obsidian](https://obsidian.md/) plugin settings for Obsidian Chess Study. diff --git a/src/components/obsidian/SettingsTab.ts b/src/components/obsidian/SettingsTab.ts index 4e1e4a8..5eb0c48 100644 --- a/src/components/obsidian/SettingsTab.ts +++ b/src/components/obsidian/SettingsTab.ts @@ -4,11 +4,13 @@ import ChessStudyPlugin from 'src/main'; export interface ChessStudyPluginSettings { boardOrientation: 'white' | 'black'; boardColor: 'green' | 'brown'; + viewComments: true | false; } export const DEFAULT_SETTINGS: ChessStudyPluginSettings = { boardOrientation: 'white', boardColor: 'green', + viewComments: true, }; export class SettingsTab extends PluginSettingTab { @@ -55,5 +57,21 @@ export class SettingsTab extends PluginSettingTab { this.plugin.saveSettings(); }); }); + + new Setting(containerEl) + .setName('View Comments') + .setDesc('Sets the default view of the comments') + .addDropdown((dropdown) => { + dropdown.addOption('true', 'True'); + dropdown.addOption('false', 'False'); + + dropdown + .setValue(this.plugin.settings.viewComments) + .onChange((viewComments) => { + this.plugin.settings.viewComments = (viewComments == true || viewComments == "true" || viewComments == "True") as true | false; + this.plugin.saveSettings(); + }); + }); + } } diff --git a/src/components/react/ChessStudy.tsx b/src/components/react/ChessStudy.tsx index fe9d246..db1b136 100644 --- a/src/components/react/ChessStudy.tsx +++ b/src/components/react/ChessStudy.tsx @@ -55,10 +55,8 @@ export const ChessStudy = ({ dataAdapter, }: AppProps) => { // Parse Obsidian / Code Block Settings - const { boardColor, boardOrientation, chessStudyId } = parseUserConfig( - pluginSettings, - source - ); + const { boardColor, boardOrientation, viewComments, chessStudyId } = + parseUserConfig(pluginSettings, source); // Setup Chessground API const [chessView, setChessView] = useState(null); @@ -276,14 +274,16 @@ export const ChessStudy = ({ /> -
- - dispatch({ type: 'SYNC_COMMENT', comment: comment }) - } - /> -
+ {viewComments && ( +
+ + dispatch({ type: 'SYNC_COMMENT', comment: comment }) + } + /> +
+ )} ); }; From 87e4b522dcf53cbadfbeff05cbf8b70529f02873 Mon Sep 17 00:00:00 2001 From: latenitecode <85068850+latenitecoding@users.noreply.github.com> Date: Sun, 4 Feb 2024 11:02:26 -0600 Subject: [PATCH 2/2] feat: adds undo button feat: adds undo button --- src/components/react/ChessStudy.tsx | 63 ++++++++++++++++++++++-- src/components/react/PgnViewer/index.tsx | 9 +++- 2 files changed, 68 insertions(+), 4 deletions(-) diff --git a/src/components/react/ChessStudy.tsx b/src/components/react/ChessStudy.tsx index db1b136..c7300b1 100644 --- a/src/components/react/ChessStudy.tsx +++ b/src/components/react/ChessStudy.tsx @@ -42,6 +42,7 @@ export interface GameState { export type GameActions = | { type: 'ADD_MOVE_TO_HISTORY'; move: Move } + | { type: 'REMOVE_LAST_MOVE_FROM_HISTORY' } | { type: 'DISPLAY_NEXT_MOVE_IN_HISTORY' } | { type: 'DISPLAY_PREVIOUS_MOVE_IN_HISTORY' } | { type: 'DISPLAY_SELECTED_MOVE_IN_HISTORY'; moveId: string } @@ -81,7 +82,7 @@ export const ChessStudy = ({ (draft, action) => { switch (action.type) { case 'DISPLAY_NEXT_MOVE_IN_HISTORY': { - if (!chessView) return draft; + if (!chessView || !draft || draft.study.moves.length == 0) return draft; displayMoveInHistory(draft, chessView, setChessLogic, { offset: 1, @@ -91,7 +92,7 @@ export const ChessStudy = ({ return draft; } case 'DISPLAY_PREVIOUS_MOVE_IN_HISTORY': { - if (!chessView) return draft; + if (!chessView || !draft || draft.study.moves.length == 0) return draft; displayMoveInHistory(draft, chessView, setChessLogic, { offset: -1, @@ -100,8 +101,57 @@ export const ChessStudy = ({ return draft; } + case 'REMOVE_LAST_MOVE_FROM_HISTORY': { + if (!chessView || !draft || draft.study.moves.length == 0) return draft; + + let moves = draft.study.moves; + + const currentMoveId = draft.currentMove?.moveId; + + const { variant, moveIndex } = findMoveIndex(moves, currentMoveId); + + if (variant) { + const parent = moves[variant.parentMoveIndex]; + const variantMoves = parent.variants[variant.variantIndex].moves; + + const isLastMove = moveIndex === variantMoves.length - 1; + + if (isLastMove) { + displayMoveInHistory(draft, chessView, setChessLogic, { + offset: -1, + selectedMoveId: currentMoveId, + }); + } + + variantMoves.pop(); + if (variantMoves.length == 0) { + parent.variants.splice(variant.variantIndex, 1); + } + + if (isLastMove) { + draft.currentMove = (variantMoves.length > 0) ? variantMoves[variantMoves.length - 1] : moves[variant.parentMoveIndex]; + } + } else { + const isLastMove = moveIndex === moves.length - 1; + + if (isLastMove) { + displayMoveInHistory(draft, chessView, setChessLogic, { + offset: -1, + selectedMoveId: currentMoveId, + }); + } + + moves.pop(); + + if (isLastMove) { + draft.currentMove = (moves.length > 0) ? moves[moves.length - 1] : null; + } + } + + return draft; + } case 'DISPLAY_SELECTED_MOVE_IN_HISTORY': { - if (!chessView) return draft; + if (!chessView || !draft || draft.study.moves.length == 0) return draft; const selectedMoveId = action.moveId; @@ -113,6 +163,8 @@ export const ChessStudy = ({ return draft; } case 'SYNC_SHAPES': { + if (!chessView || !draft || draft.study.moves.length == 0) return draft; + const move = getCurrentMove(draft); move.shapes = action.shapes; @@ -121,6 +173,8 @@ export const ChessStudy = ({ return draft; } case 'SYNC_COMMENT': { + if (!chessView || !draft || draft.study.moves.length == 0) return draft; + const move = getCurrentMove(draft); move.comment = action.comment; @@ -258,6 +312,9 @@ export const ChessStudy = ({ + dispatch({ type: 'REMOVE_LAST_MOVE_FROM_HISTORY' }) + } onBackButtonClick={() => dispatch({ type: 'DISPLAY_PREVIOUS_MOVE_IN_HISTORY' }) } diff --git a/src/components/react/PgnViewer/index.tsx b/src/components/react/PgnViewer/index.tsx index d4066dd..0dea7e9 100644 --- a/src/components/react/PgnViewer/index.tsx +++ b/src/components/react/PgnViewer/index.tsx @@ -1,4 +1,4 @@ -import { ArrowLeft, ArrowRight, Save } from 'lucide-react'; +import { ArrowLeft, ArrowRight, Save, Undo2 } from 'lucide-react'; import * as React from 'react'; import { ReactNode, useEffect, useMemo, useRef } from 'react'; import { ChessStudyMove } from 'src/lib/storage'; @@ -108,6 +108,7 @@ export const PgnViewer = React.memo( ({ history, currentMoveId, + onUndoButtonClick, onBackButtonClick, onForwardButtonClick, onMoveItemClick, @@ -115,6 +116,7 @@ export const PgnViewer = React.memo( }: { history: ChessStudyMove[]; currentMoveId: string; + onUndoButtonClick: () => void; onBackButtonClick: () => void; onForwardButtonClick: () => void; onMoveItemClick: (moveId: string) => void; @@ -268,12 +270,17 @@ export const PgnViewer = React.memo(
+ +
+