obsidian-plugin/chrislicodes_obsidian-chess-study
1
0
Fork 0
mirror of https://github.com/chrislicodes/obsidian-chess-study.git synced 2026-07-22 07:50:30 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: adds undo button

Browse source
This commit is contained in:
latenitecoding 2024-01-30 11:38:29 -06:00
parent 38e11cc131
commit 33ec49c4c2
2 changed files with 68 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

63
src/components/react/ChessStudy.tsx
View file

@ -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 = ({
<PgnViewer
history={gameState.study.moves}
currentMoveId={gameState.currentMove?.moveId}
onUndoButtonClick={() =>
dispatch({ type: 'REMOVE_LAST_MOVE_FROM_HISTORY' })
}
onBackButtonClick={() =>
dispatch({ type: 'DISPLAY_PREVIOUS_MOVE_IN_HISTORY' })
}

9
src/components/react/PgnViewer/index.tsx
View file

@ -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(
</div>
</div>
<div className="button-section">
<button onClick={() => onUndoButtonClick()}>
<Undo2 />
</button>
<button onClick={() => onBackButtonClick()}>
<ArrowLeft />
</button>
<button onClick={() => onForwardButtonClick()}>
<ArrowRight />
</button>
</div>
<div className="button-section">
<button onClick={() => onSaveButtonClick()}>
<Save strokeWidth={'1px'} />
</button>