From e24b8ba615a76655bfb60bfb403c9220b20b9eed Mon Sep 17 00:00:00 2001 From: Tomofumi Chiba Date: Sat, 23 Sep 2023 01:36:53 +0000 Subject: [PATCH] shortcut-key post --- deno.json | 4 ++-- islands/PostEdit.tsx | 30 ++++++++++++++++++++++-------- islands/PostNew.tsx | 23 +++++++++++++++++++++-- 3 files changed, 45 insertions(+), 12 deletions(-) diff --git a/deno.json b/deno.json index 48b50a9..c22d166 100644 --- a/deno.json +++ b/deno.json @@ -3,7 +3,7 @@ "tasks": { "win": "deno run --watch=static/,routes/ --allow-env --allow-read --allow-write=.,$LOCALAPPDATA/Temp --allow-run=$(where deno),$LOCALAPPDATA/Cache/esbuild/bin/esbuild-windows-64@0.14.51 --allow-net=:8000,deno.land,esm.sh,accounts.google.com,www.googleapis.com,cdn.jsdelivr.net,$PGHOST dev.ts", "arm": "deno run --watch=static/,routes/ --allow-env --allow-read --allow-write=.,/tmp --allow-run=$(which deno),$HOME/.cache/esbuild/bin/esbuild-linux-arm64@0.14.51 --allow-net=:8000,deno.land,esm.sh,accounts.google.com,www.googleapis.com,cdn.jsdelivr.net,$PGHOST dev.ts", - "linux": "deno run --watch=static/,routes/ --allow-env --allow-read --allow-write=.,$HOME/.cache/fresh --allow-run=$(which deno),$HOME/.cache/esbuild/bin/@esbuild-linux-x64@0.18.11 --allow-net=:8000,deno.land,dl.deno.land,esm.sh,accounts.google.com,www.googleapis.com,cdn.jsdelivr.net,$PGHOST dev.ts", + "linux": "deno run --watch=static/,routes/ --allow-env --allow-read --allow-write=.,$HOME/.cache/fresh,$HOME/.cache/esbuild --allow-run=$(which deno),$HOME/.cache/esbuild/bin/@esbuild-linux-x64@0.18.11 --allow-net=:8000,deno.land,dl.deno.land,esm.sh,accounts.google.com,www.googleapis.com,cdn.jsdelivr.net,$PGHOST,registry.npmjs.org dev.ts", "update": "deno run -A -r https://fresh.deno.dev/update .", "build": "deno run --allow-env --allow-read --allow-write=.,$HOME/.cache/fresh,$HOME/.cache/esbuild --allow-run=$(which deno),$HOME/.cache/esbuild/bin/@esbuild-linux-x64@0.18.11 --allow-net=deno.land,dl.deno.land,esm.sh,cdn.jsdelivr.net,registry.npmjs.org dev.ts build", "preview": "deno run -A main.ts" @@ -48,4 +48,4 @@ "_fresh" ] } -} +} \ No newline at end of file diff --git a/islands/PostEdit.tsx b/islands/PostEdit.tsx index 3fee0ec..9cba5cd 100644 --- a/islands/PostEdit.tsx +++ b/islands/PostEdit.tsx @@ -1,33 +1,46 @@ -import { useSignal } from "@preact/signals"; +import { effect, useSignal } from "@preact/signals"; import * as hljs from "highlightjs"; import { useEffect, useState } from "preact/hooks"; import { Post } from "~/server/db.ts"; import { trpc } from "~/client/trpc.ts"; +import Mousetrap from "mousetrap"; export default function Edit(props: { post: Post }) { const postId = props.post.id; - const [flag, setFlag] = useState(true); + const preview = useSignal(false); const text = useSignal(props.post.source); const draft = useSignal(props.post.draft); const sanitizedHtml = useSignal(""); const [loading, setLoading] = useState(false); function displayEdit() { - setFlag(true); + preview.value = false; } async function displayPreview() { sanitizedHtml.value = await trpc.md2html.query({ source: text.value, }); - setFlag(false); + preview.value = true; } useEffect(() => { (hljs as any).highlightAll(); }); + useEffect(() => { + if (!preview.value) { + Mousetrap(document.querySelector("textarea") as Element).bind( + "mod+enter", + () => { + text.value = (document.getElementById("textarea") as HTMLTextAreaElement).value + save(); + }, + ); + } + }, [preview.value]); + async function save() { setLoading(true); await trpc.updatePost.mutate({ @@ -49,7 +62,7 @@ export default function Edit(props: { post: Post }) { - {flag && + {!preview.value && ( )} - {!flag && + {preview.value && ( { (hljs as any).highlightAll(); }); + useEffect(() => { + if (!preview.value) { + Mousetrap(document.querySelector("textarea") as Element).bind( + "mod+enter", + () => { + text.value = (document.getElementById("textarea") as HTMLTextAreaElement).value + post(); + }, + ); + } + }, [preview.value]); async function post() { loading.value = true; @@ -59,6 +71,7 @@ export default function Post() { {!preview.value && (