diff --git a/src/app/editor.ts b/src/app/editor.ts index 823dad7..f3674f6 100644 --- a/src/app/editor.ts +++ b/src/app/editor.ts @@ -44,6 +44,7 @@ const fixedHeightEditor = EditorView.theme({ minWidth: "8em", flex: "none", fontSize: "16px", + scrollMargin: "100px", }, ".cm-scroller": { overflow: "auto scroll" }, }); @@ -144,6 +145,7 @@ export class Editor implements Displayable { // lintKeymap, ], }); + this.view.dom.addEventListener("focusin", () => this.focus()); van.derive(() => { LanguageDescription.matchFilename(languages, file.filePath.val) @@ -169,7 +171,7 @@ export class Editor implements Displayable { } focus() { - this.view.dom.scrollIntoView(); + this.view.dom.scrollIntoView({ behavior: "smooth", }); this.view.focus(); } diff --git a/src/app/editorgrid.ts b/src/app/editorgrid.ts index 0b906d7..07ed3cc 100644 --- a/src/app/editorgrid.ts +++ b/src/app/editorgrid.ts @@ -91,8 +91,15 @@ export const EditorTabs = v.div( vanX.list(TabBar, editors, TabHeader); vanX.list(EditorTabs, editors, EditorGrid); -document.addEventListener("keyup", (e) => { +function shortcutHandler(e: KeyboardEvent) { if (e.key === "t" && e.altKey) { - addTerminal(); + if (e.type === "keydown") { + addTerminal(); + } + e.preventDefault(); + } -}); +} + +document.addEventListener("keyup", shortcutHandler, { capture: true, }); +document.addEventListener("keydown", shortcutHandler, { capture: true, }); \ No newline at end of file diff --git a/src/app/terminal.ts b/src/app/terminal.ts index 231076d..b08e71d 100644 --- a/src/app/terminal.ts +++ b/src/app/terminal.ts @@ -33,7 +33,9 @@ export class Terminal implements Displayable { this.fitAddon = new FitAddon(); this.term.loadAddon(this.fitAddon); - this.dom = v.div({ class: "h-full w-lg resize-x overflow-x-hidden" }); + this.dom = v.div({ class: "h-full w-lg resize-x overflow-x-hidden scroll-m-[100px]" }); + this.dom.addEventListener("focusin", () => this.focus()); + const loaded = van.state(false); van.derive(() => { @@ -108,7 +110,7 @@ export class Terminal implements Displayable { } focus() { - this.dom.scrollIntoView(); + this.dom.scrollIntoView({ behavior: "smooth" }); this.term.focus(); }