From 9f8042fb8715508456e47c721390ee4a2d573e83 Mon Sep 17 00:00:00 2001
From: sawka <mike.sawka@gmail.com>
Date: Fri, 2 Aug 2024 16:50:11 -0700
Subject: [PATCH] new keybindings for switching tabs/blocks

---
 frontend/app/app.tsx          | 47 +++++++++++++++++++++++++++++++++--
 frontend/app/block/block.less |  2 +-
 2 files changed, 46 insertions(+), 3 deletions(-)

diff --git a/frontend/app/app.tsx b/frontend/app/app.tsx
index a0409c774..6d940a720 100644
--- a/frontend/app/app.tsx
+++ b/frontend/app/app.tsx
@@ -86,6 +86,16 @@ function handleContextMenu(e: React.MouseEvent<HTMLDivElement>) {
     ContextMenuModel.showContextMenu(menu, e);
 }
 
+function switchTabAbs(index: number) {
+    const ws = globalStore.get(atoms.workspace);
+    const newTabIdx = index - 1;
+    if (newTabIdx < 0 || newTabIdx >= ws.tabids.length) {
+        return;
+    }
+    const newActiveTabId = ws.tabids[newTabIdx];
+    services.ObjectService.SetActiveTab(newActiveTabId);
+}
+
 function switchTab(offset: number) {
     const ws = globalStore.get(atoms.workspace);
     const activeTabId = globalStore.get(atoms.tabAtom).oid;
@@ -160,6 +170,24 @@ function findBlockAtPoint(m: Map<string, Bounds>, p: Point): string {
     return null;
 }
 
+function switchBlockIdx(index: number) {
+    const tabId = globalStore.get(atoms.activeTabId);
+    const tabAtom = WOS.getWaveObjectAtom<Tab>(WOS.makeORef("tab", tabId));
+    const layoutTreeState = globalStore.get(getLayoutStateAtomForTab(tabId, tabAtom));
+    if (layoutTreeState?.leafs == null) {
+        return;
+    }
+    const newLeafIdx = index - 1;
+    if (newLeafIdx < 0 || newLeafIdx >= layoutTreeState.leafs.length) {
+        return;
+    }
+    const leaf = layoutTreeState.leafs[newLeafIdx];
+    if (leaf?.data?.blockId == null) {
+        return;
+    }
+    setBlockFocus(leaf.data.blockId);
+}
+
 function switchBlock(tabId: string, offsetX: number, offsetY: number) {
     console.log("switch block", offsetX, offsetY);
     if (offsetY == 0 && offsetX == 0) {
@@ -339,14 +367,14 @@ const AppKeyHandlers = () => {
 
     function handleKeyUp(event: KeyboardEvent) {
         const waveEvent = keyutil.adaptFromReactOrNativeKeyEvent(event);
-        if (waveEvent.key == "Meta" || waveEvent.key == "Shift") {
+        if (waveEvent.key == "Control" || waveEvent.key == "Shift") {
             globalStore.set(simpleCmdShiftAtom, false);
             globalStore.set(atoms.cmdShiftDelayAtom, false);
         }
     }
 
     function handleKeyDown(waveEvent: WaveKeyboardEvent): boolean {
-        if ((waveEvent.key == "Meta" || waveEvent.key == "Shift") && waveEvent.cmd && waveEvent.shift) {
+        if ((waveEvent.key == "Control" || waveEvent.key == "Shift") && waveEvent.control && waveEvent.shift) {
             globalStore.set(simpleCmdShiftAtom, true);
             setTimeout(() => {
                 const simpleState = globalStore.get(simpleCmdShiftAtom);
@@ -366,6 +394,21 @@ const AppKeyHandlers = () => {
             switchTab(-1);
             return true;
         }
+        for (let idx = 1; idx <= 9; idx++) {
+            if (keyutil.checkKeyPressed(waveEvent, `Cmd:${idx}`)) {
+                switchTabAbs(idx);
+                return true;
+            }
+        }
+        for (let idx = 1; idx <= 9; idx++) {
+            if (
+                keyutil.checkKeyPressed(waveEvent, `Ctrl:Shift:c{Digit${idx}}`) ||
+                keyutil.checkKeyPressed(waveEvent, `Ctrl:Shift:c{Numpad${idx}}`)
+            ) {
+                switchBlockIdx(idx);
+                return true;
+            }
+        }
         if (keyutil.checkKeyPressed(waveEvent, "Cmd:ArrowUp")) {
             switchBlock(tabId, 0, -1);
             return true;
diff --git a/frontend/app/block/block.less b/frontend/app/block/block.less
index 64a090c48..cd8e1ee4a 100644
--- a/frontend/app/block/block.less
+++ b/frontend/app/block/block.less
@@ -276,7 +276,7 @@
             &.is-layoutmode .block-mask-inner {
                 margin-top: 35px; // TODO fix this magic
                 background-color: rgba(0, 0, 0, 0.5);
-                height: 100%;
+                height: calc(100% - 35px);
                 width: 100%;
                 display: flex;
                 align-items: center;