Added branch navigation shortcuts

modifié : src/state/keybinds.ts
franciscoBSalgueiro · Apr 15, 2024 · bcb9405 · bcb9405
1 parent 75f93b5
commit bcb9405
Show file tree

Hide file tree

Showing 3 changed files with 89 additions and 2 deletions.
diff --git a/src/components/common/MoveControls.tsx b/src/components/common/MoveControls.tsx
@@ -23,13 +23,22 @@ function MoveControls({
   const start = useStore(store, (s) => s.goToStart);
   const end = useStore(store, (s) => s.goToEnd);
   const deleteMove = useStore(store, (s) => s.deleteMove);
+  const startBranch = useStore(store, (s) => s.goToBranchStart);
+  const endBranch = useStore(store, (s) => s.goToBranchEnd);
+  const nextBranch = useStore(store, (s) => s.nextBranch);
+  const previousBranch = useStore(store, (s) => s.previousBranch);
 
   const keyMap = useAtomValue(keyMapAtom);
   useHotkeys(keyMap.PREVIOUS_MOVE.keys, previous);
   useHotkeys(keyMap.NEXT_MOVE.keys, next);
   useHotkeys(keyMap.GO_TO_START.keys, start);
   useHotkeys(keyMap.GO_TO_END.keys, end);
   useHotkeys(keyMap.DELETE_MOVE.keys, readOnly ? () => {} : () => deleteMove());
+  useHotkeys(keyMap.GO_TO_BRANCH_START.keys, startBranch);
+  useHotkeys(keyMap.GO_TO_BRANCH_END.keys, endBranch);
+  useHotkeys(keyMap.NEXT_BRANCH.keys, nextBranch);
+  useHotkeys(keyMap.PREVIOUS_BRANCH.keys, previousBranch);
+
   return (
     <Group grow gap="xs">
       <ActionIcon variant="default" size="lg" onClick={start}>

diff --git a/src/state/keybinds.ts b/src/state/keybinds.ts
@@ -13,12 +13,16 @@ const keys = {
   CLEAR_SHAPES: { name: "Clear shapes", keys: "ctrl+l" },
   NEXT_MOVE: { name: "Next move", keys: "arrowright" },
   PREVIOUS_MOVE: { name: "Previous move", keys: "arrowleft" },
-  GO_TO_START: { name: "Go to start of game", keys: "arrowup" },
-  GO_TO_END: { name: "Go to end of game", keys: "arrowdown" },
+  GO_TO_START: { name: "Go to start of game", keys: "shift+arrowup" },
+  GO_TO_END: { name: "Go to end of game", keys: "shift+arrowdown" },
   DELETE_MOVE: { name: "Delete move", keys: "delete" },
   CYCLE_TABS: { name: "Cycle tabs", keys: "ctrl+tab" },
   REVERSE_CYCLE_TABS: { name: "Reverse cycle tabs", keys: "ctrl+shift+tab" },
   TOGGLE_EVAL_BAR: { name: "Toggle Eval Bar and Arrows", keys: "z" },
+  GO_TO_BRANCH_START: { name: "Go to start of branch", keys: "arrowup" },
+  GO_TO_BRANCH_END: { name: "Go to end of branch", keys: "arrowdown" },
+  NEXT_BRANCH: { name: "Next branch", keys: "shift+arrowright" },
+  PREVIOUS_BRANCH: { name: "Previous branch", keys: "shift+arrowleft" },
 };
 
 export const keyMapAtom = atomWithStorage(

diff --git a/src/state/store.ts b/src/state/store.ts
@@ -34,6 +34,10 @@ export interface TreeStoreState {
   goToStart: () => void;
   goToEnd: () => void;
   goToMove: (move: number[]) => void;
+  goToBranchStart: () => void;
+  goToBranchEnd: () => void;
+  nextBranch: () => void;
+  previousBranch: () => void;
 
   goToAnnotation: (annotation: Annotation, color: "white" | "black") => void;
 
@@ -245,6 +249,76 @@ export const createTreeStore = (id?: string, initialTree?: TreeState) => {
         ...state,
         position: move,
       })),
+    goToBranchStart: () => {
+      set(
+        produce((state) => {
+          if (
+            state.position.length > 0 &&
+            state.position[state.position.length - 1] !== 0
+          ) {
+            state.position = state.position.slice(0, -1);
+          }
+
+          while (
+            state.position.length > 0 &&
+            state.position[state.position.length - 1] === 0
+          ) {
+            state.position = state.position.slice(0, -1);
+          }
+        }),
+      );
+    },
+
+    goToBranchEnd: () => {
+      set(
+        produce((state) => {
+          let currentNode = getNodeAtPath(state.root, state.position);
+          while (currentNode.children.length > 0) {
+            state.position.push(0);
+            currentNode = currentNode.children[0];
+          }
+        }),
+      );
+    },
+
+    nextBranch: () =>
+      set(
+        produce((state) => {
+          let branchIndex = state.position[state.position.length - 1];
+          let branchCount = getNodeAtPath(state.root, state.position).children.length;
+
+          while (
+            state.position.length > 0 &&
+            branchCount <= 1
+          ) {
+            branchIndex = state.position[state.position.length - 1];
+            state.position = state.position.slice(0, -1);
+            branchCount = getNodeAtPath(state.root, state.position).children.length;
+          }
+
+          let currentNode = getNodeAtPath(state.root, state.position);
+          state.position.push((branchIndex + 1) % currentNode.children.length);
+        }),
+      ),
+    previousBranch: () => set(
+      produce((state) => {
+        let branchIndex = state.position[state.position.length - 1];
+        let branchCount = getNodeAtPath(state.root, state.position).children.length;
+
+        while (
+          state.position.length > 0 &&
+          branchCount <= 1
+        ) {
+          branchIndex = state.position[state.position.length - 1];
+          state.position = state.position.slice(0, -1);
+          branchCount = getNodeAtPath(state.root, state.position).children.length;
+        }
+
+        let currentNode = getNodeAtPath(state.root, state.position);
+        state.position.push((branchIndex + currentNode.children.length - 1) % currentNode.children.length);
+      }),
+    ),
+
     deleteMove: (path) =>
       set(
         produce((state) => {