diff --git a/islands/PostEdit.tsx b/islands/PostEdit.tsx index 889e884..553891f 100644 --- a/islands/PostEdit.tsx +++ b/islands/PostEdit.tsx @@ -21,6 +21,7 @@ export default function Edit(props: { post: Post }) { } async function displayPreview() { + text.value = textarea.current.value; sanitizedHtml.value = await trpc.md2html.query({ source: text.value, }); @@ -32,7 +33,21 @@ export default function Edit(props: { post: Post }) { }); useEffect(() => { - if (!preview.value) { + if (textarea.current) { + textarea.current.focus(); + } + }, textarea.current); + + useEffect(() => { + if (preview.value) { + Mousetrap.bind( + "mod+p", + () => { + displayEdit(); + return false; + }, + ); + } else { Mousetrap(textarea.current).bind( "mod+enter", () => { @@ -40,6 +55,13 @@ export default function Edit(props: { post: Post }) { save(); }, ); + Mousetrap(textarea.current).bind( + "mod+p", + () => { + displayPreview(); + return false; + }, + ); } }, [preview.value]); diff --git a/islands/PostNew.tsx b/islands/PostNew.tsx index 2ecb305..2d0762f 100644 --- a/islands/PostNew.tsx +++ b/islands/PostNew.tsx @@ -13,11 +13,38 @@ export default function Post() { const sanitizedHtml = useSignal(""); const textarea = createRef(); + function displayEdit() { + preview.value = false; + } + + async function displayPreview() { + text.value = textarea.current.value; + sanitizedHtml.value = await trpc.md2html.query({ + source: text.value, + }); + preview.value = true; + } + useEffect(() => { (hljs as any).highlightAll(); }); + + useEffect(() => { + if (textarea.current) { + textarea.current.focus(); + } + }, textarea.current); + useEffect(() => { - if (!preview.value) { + if (preview.value) { + Mousetrap.bind( + "mod+p", + () => { + displayEdit(); + return false; + }, + ); + } else { Mousetrap(textarea.current).bind( "mod+enter", () => { @@ -25,6 +52,13 @@ export default function Post() { post(); }, ); + Mousetrap(textarea.current).bind( + "mod+p", + () => { + displayPreview(); + return false; + }, + ); } }, [preview.value]); @@ -50,7 +84,7 @@ export default function Post() { preview.value = false} + onClick={displayEdit} > Edit @@ -59,12 +93,7 @@ export default function Post() { { - sanitizedHtml.value = await trpc.md2html.query({ - source: text.value, - }); - preview.value = true; - }} + onClick={displayPreview} > Preview diff --git a/routes/help.tsx b/routes/help.tsx index cf3f2f5..e4bffe9 100644 --- a/routes/help.tsx +++ b/routes/help.tsx @@ -105,7 +105,11 @@ export default defineRoute(async (req, _ctx) => {