From 743338ea4c2fd1192697d3cc77581f96398995e2 Mon Sep 17 00:00:00 2001
From: dumbmoron <log@riseup.net>
Date: Wed, 3 Jul 2024 17:42:34 +0000
Subject: [PATCH] =?UTF-8?q?web/omnibox:=20add=20keyboard=20shortcuts=20sup?=
 =?UTF-8?q?port=20=20=20=20=20-=20shift+d=20to=20paste=20=20=20=20=20-=20?=
 =?UTF-8?q?=E2=8C=98/ctrl+v=20to=20paste=20=20=20=20=20-=20shift+k=20for?=
 =?UTF-8?q?=20auto=20mode=20=20=20=20=20-=20shift+l=20for=20audio=20mode?=
 =?UTF-8?q?=20=20=20=20=20-=20esc=20to=20clear=20input?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

todo:
    - shortcut for "muted" mode
---
 web/src/components/save/Omnibox.svelte | 61 +++++++++++++++++++++-----
 web/src/lib/types/settings.ts          |  2 +
 2 files changed, 53 insertions(+), 10 deletions(-)

diff --git a/web/src/components/save/Omnibox.svelte b/web/src/components/save/Omnibox.svelte
index 2b248562..b0702232 100644
--- a/web/src/components/save/Omnibox.svelte
+++ b/web/src/components/save/Omnibox.svelte
@@ -12,13 +12,16 @@
     import ActionButton from "$components/buttons/ActionButton.svelte";
     import SettingsButton from "$components/buttons/SettingsButton.svelte";
 
+    import { updateSetting } from "$lib/settings";
+    import type { DownloadModeOption } from "$lib/types/settings";
+
     import IconSparkles from "$lib/icons/Sparkles.svelte";
     import IconMusic from "$lib/icons/Music.svelte";
     import IconMute from "$lib/icons/Mute.svelte";
-
     import IconClipboard from "$lib/icons/Clipboard.svelte";
 
     let link: string = "";
+    let linkInput: HTMLInputElement | undefined;
     let isFocused = false;
 
     let downloadButton: SvelteComponent;
@@ -26,10 +29,8 @@
     const validLink = (link: string) => {
         try {
             return /^https:/i.test(new URL(link).protocol);
-        } catch {
-            return false;
-        }
-    };
+        } catch {}
+    }
 
     const pasteClipboard = () => {
         navigator.clipboard.readText().then(async (text) => {
@@ -42,8 +43,47 @@
             }
         });
     };
+
+    const changeDownloadMode = (mode: DownloadModeOption) => {
+        updateSetting({ save: { downloadMode: mode }});
+    }
+
+    const handleKeydown = (e: KeyboardEvent) => {
+        if (!linkInput) {
+            return;
+        }
+
+        if (e.metaKey || e.ctrlKey || e.key === '/') {
+            linkInput.focus();
+        }
+
+        if (['Escape', 'Clear'].includes(e.key)) {
+            link = "";
+        }
+
+        if (e.target === linkInput) {
+            return;
+        }
+
+        switch (e.key) {
+            case 'D':
+                pasteClipboard();
+                break;
+            case 'K':
+                changeDownloadMode('auto');
+                break;
+            case 'L':
+                changeDownloadMode('audio');
+                break;
+            // TODO: keyboard shortcut for "muted" mode
+            default:
+                break;
+        }
+    }
 </script>
 
+<svelte:window on:keydown={handleKeydown} />
+
 <div id="omnibox">
     <div
         id="input-container"
@@ -55,9 +95,10 @@
         <input
             id="link-area"
             bind:value={link}
-            on:input={() => (isFocused = true)}
-            on:focus={() => (isFocused = true)}
-            on:blur={() => (isFocused = false)}
+            bind:this={linkInput}
+            on:input={() => isFocused = true}
+            on:focus={() => isFocused = true}
+            on:blur={() => isFocused = false}
             spellcheck="false"
             autocomplete="off"
             autocapitalize="off"
@@ -67,8 +108,8 @@
             data-form-type="other"
         />
 
-        {#if link.length > 0}
-            <ClearButton click={() => (link = "")} />
+        {#if link}
+            <ClearButton click={() => link = ""} />
         {/if}
         {#if validLink(link)}
             <DownloadButton url={link} bind:this={downloadButton} />
diff --git a/web/src/lib/types/settings.ts b/web/src/lib/types/settings.ts
index b434d7cb..3212144e 100644
--- a/web/src/lib/types/settings.ts
+++ b/web/src/lib/types/settings.ts
@@ -50,3 +50,5 @@ export type CobaltSettings = {
     save: CobaltSettingsSave,
     privacy: CobaltSettingsPrivacy,
 };
+
+export type DownloadModeOption = CobaltSettings['save']['downloadMode'];
\ No newline at end of file