完成编辑markdown

dev-wan · Oct 10, 2024 · aef408f · aef408f
1 parent 1bb492b
commit aef408f
Show file tree

Hide file tree

Showing 29 changed files with 164 additions and 75 deletions.
diff --git a/component/items/editMarkdown.tsx b/component/items/editMarkdown.tsx
@@ -0,0 +1,25 @@
+import { EditOutlined, StarTwoTone } from "@ant-design/icons"
+
+import { sendToContentScript } from "@plasmohq/messaging"
+
+import { i18n } from "~tools"
+
+export default function EditMarkdown(props) {
+  let { name } = props
+
+  async function editMarkdown() {
+    sendToContentScript({
+      name: `${name}-editMarkdown`
+    })
+  }
+
+  return (
+    <div className="item download" onClick={editMarkdown}>
+      <span>
+        <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />
+        {i18n("editMarkdown")}
+      </span>
+      <EditOutlined style={{ color: "#52c41a", fontSize: "16px" }} />
+    </div>
+  )
+}
diff --git a/component/options/51cto.tsx b/component/options/51cto.tsx
@@ -1,8 +1,9 @@
-import { DownloadOutlined, StarTwoTone } from "@ant-design/icons"
+import { DownloadOutlined, EditOutlined, StarTwoTone } from "@ant-design/icons"
 
 import { sendToContentScript } from "@plasmohq/messaging"
 import { useStorage } from "@plasmohq/storage/hook"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Cto51() {
@@ -55,6 +56,7 @@ export default function Cto51() {
           htmlFor="51cto-closeLoginModal"
           className="codebox-switch"></label>
       </div>
+      <EditMarkdown></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/component/options/baidu.tsx b/component/options/baidu.tsx
@@ -3,6 +3,7 @@ import { DownloadOutlined, StarTwoTone } from "@ant-design/icons"
 import { sendToContentScript } from "@plasmohq/messaging"
 import { useStorage } from "@plasmohq/storage/hook"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Baidu() {
@@ -37,6 +38,7 @@ export default function Baidu() {
         />
         <label className="codebox-switch" htmlFor="baidu-closeAIBox"></label>
       </div>
+      <EditMarkdown name="baidu"></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/component/options/cnblogs.tsx b/component/options/cnblogs.tsx
@@ -3,6 +3,7 @@ import { DownloadOutlined, StarTwoTone } from "@ant-design/icons"
 import { sendToContentScript } from "@plasmohq/messaging"
 import { useStorage } from "@plasmohq/storage/hook"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Cnblogs() {
@@ -37,6 +38,7 @@ export default function Cnblogs() {
         />
         <label className="codebox-switch" htmlFor="cnblogs-copyCode"></label>
       </div>
+      <EditMarkdown name="cnblogs"></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/component/options/csdn.tsx b/component/options/csdn.tsx
@@ -3,6 +3,7 @@ import { DownloadOutlined, StarTwoTone } from "@ant-design/icons"
 import { sendToContentScript } from "@plasmohq/messaging"
 import { useStorage } from "@plasmohq/storage/hook"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Csdn() {
@@ -135,6 +136,7 @@ export default function Csdn() {
           htmlFor="csdn-closeRedirectModal"
           className="codebox-switch"></label>
       </div>
+      <EditMarkdown name="csdn"></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/component/options/custom.tsx b/component/options/custom.tsx
@@ -5,6 +5,7 @@ import { useEffect, useState } from "react"
 import { sendToContentScript } from "@plasmohq/messaging"
 import { useStorage } from "@plasmohq/storage/hook"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Custom() {
@@ -25,12 +26,6 @@ export default function Custom() {
     sendToContentScript({ name: `custom-scrollIntoViewCode`, body: { index } })
   }
 
-  function editMarkdown() {
-    sendToContentScript({
-      name: "custom-editMarkdown"
-    })
-  }
-
   function downloadMarkdown() {
     sendToContentScript({
       name: "custom-downloadMarkdown"
@@ -92,13 +87,7 @@ export default function Custom() {
           onChange={(e) => setRenderValue(e.target.value)}
           onBlur={(e) => setStoreValue()}></Input.TextArea>
       </div>
-      <div className="item download" onClick={editMarkdown}>
-        <span>
-          <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />
-          {i18n("editMarkdown")}
-        </span>
-        <EditOutlined style={{ color: "#52c41a", fontSize: "16px" }} />
-      </div>
+      <EditMarkdown name="custom"></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/component/options/jb51.tsx b/component/options/jb51.tsx
@@ -3,6 +3,7 @@ import { DownloadOutlined, StarTwoTone } from "@ant-design/icons"
 import { sendToContentScript } from "@plasmohq/messaging"
 import { useStorage } from "@plasmohq/storage/hook"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Jb51() {
@@ -52,6 +53,7 @@ export default function Jb51() {
         />
         <label className="codebox-switch" htmlFor="jb51-copyCode"></label>
       </div>
+      <EditMarkdown name="jb51"></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/component/options/jianshu.tsx b/component/options/jianshu.tsx
@@ -3,6 +3,7 @@ import { DownloadOutlined, StarTwoTone } from "@ant-design/icons"
 import { sendToContentScript } from "@plasmohq/messaging"
 import { useStorage } from "@plasmohq/storage/hook"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Jianshu() {
@@ -73,6 +74,7 @@ export default function Jianshu() {
           className="codebox-switch"
           htmlFor="jianshu-autoOpenCode"></label>
       </div>
+      <EditMarkdown name="jianshu"></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/component/options/juejin.tsx b/component/options/juejin.tsx
@@ -2,6 +2,7 @@ import { DownloadOutlined, EditOutlined, StarTwoTone } from "@ant-design/icons"
 
 import { sendToContentScript } from "@plasmohq/messaging"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Juejin() {
@@ -26,13 +27,7 @@ export default function Juejin() {
   return (
     <fieldset>
       <legend>{i18n("juejinConfig")}</legend>
-      <div className="item download" onClick={editMarkdown}>
-        <span>
-          <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />
-          {i18n("editMarkdown")}
-        </span>
-        <EditOutlined style={{ color: "#52c41a", fontSize: "16px" }} />
-      </div>
+      <EditMarkdown name="juejin"></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/component/options/oschina.tsx b/component/options/oschina.tsx
@@ -2,6 +2,7 @@ import { DownloadOutlined, StarTwoTone } from "@ant-design/icons"
 
 import { sendToContentScript } from "@plasmohq/messaging"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Oschina() {
@@ -20,6 +21,7 @@ export default function Oschina() {
   return (
     <fieldset>
       <legend>{i18n("oschinaConfig")}</legend>
+      <EditMarkdown name="oschina"></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/component/options/php.tsx b/component/options/php.tsx
@@ -3,6 +3,7 @@ import { DownloadOutlined, StarTwoTone } from "@ant-design/icons"
 import { sendToContentScript } from "@plasmohq/messaging"
 import { useStorage } from "@plasmohq/storage/hook"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Php() {
@@ -53,6 +54,7 @@ export default function Php() {
         />
         <label htmlFor="php-closeLoginModal" className="codebox-switch"></label>
       </div>
+      <EditMarkdown name="php"></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/component/options/segmentfault.tsx b/component/options/segmentfault.tsx
@@ -2,6 +2,7 @@ import { DownloadOutlined, StarTwoTone } from "@ant-design/icons"
 
 import { sendToContentScript } from "@plasmohq/messaging"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Segmentfault() {
@@ -20,6 +21,7 @@ export default function Segmentfault() {
   return (
     <fieldset>
       <legend>{i18n("segmentfaultConfig")}</legend>
+      <EditMarkdown name="segmentfault"></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/component/options/weixin.tsx b/component/options/weixin.tsx
@@ -3,6 +3,7 @@ import { DownloadOutlined, StarTwoTone } from "@ant-design/icons"
 import { sendToContentScript } from "@plasmohq/messaging"
 import { useStorage } from "@plasmohq/storage/dist/hook"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Weixin() {
@@ -37,6 +38,7 @@ export default function Weixin() {
         />
         <label className="codebox-switch" htmlFor="weixin-copyCode"></label>
       </div>
+      <EditMarkdown name="weixin"></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/component/options/zhihu.tsx b/component/options/zhihu.tsx
@@ -3,6 +3,7 @@ import { DownloadOutlined, StarTwoTone } from "@ant-design/icons"
 import { sendToContentScript } from "@plasmohq/messaging"
 import { useStorage } from "@plasmohq/storage/hook"
 
+import EditMarkdown from "~component/items/editMarkdown"
 import { i18n } from "~tools"
 
 export default function Zhihu() {
@@ -71,6 +72,7 @@ export default function Zhihu() {
         />
         <label className="codebox-switch" htmlFor="zhihu-autoOpenCode"></label>
       </div>
+      <EditMarkdown name="zhihu"></EditMarkdown>
       <div className="item download" onClick={downloadMarkdown}>
         <span>
           <StarTwoTone twoToneColor="#eb2f96" style={{ marginRight: "5px" }} />

diff --git a/contents/51cto.tsx b/contents/51cto.tsx
@@ -6,6 +6,7 @@ import { useMessage } from "@plasmohq/messaging/hook"
 import { useStorage } from "@plasmohq/storage/hook"
 
 import { addCss, saveHtml, saveMarkdown, setIcon } from "~tools"
+import { useContent } from "~utils/editMarkdownHook"
 import Turndown from "~utils/turndown"
 
 export const config: PlasmoCSConfig = {
@@ -20,6 +21,7 @@ export default function Cto51() {
   const [closeLoginModal] = useStorage<boolean>("51cto-closeLoginModal")
   const [history, setHistory] = useStorage<any[]>("codebox-history")
   const [closeLog] = useStorage("config-closeLog", true)
+  const [content, setContent] = useContent()
 
   useEffect(() => {
     closeLog || console.log("51CTO status", { closeLoginModal, copyCode })
@@ -34,6 +36,9 @@ export default function Cto51() {
     if (req.name == "51cto-isShow") {
       res.send({ isShow: true })
     }
+    if (req.name == "51cto-editMarkdown") {
+      setContent("article")
+    }
     if (req.name == "51cto-downloadMarkdown") {
       downloadMarkdown()
     }

diff --git a/contents/baidu.tsx b/contents/baidu.tsx
@@ -5,6 +5,7 @@ import { useMessage } from "@plasmohq/messaging/hook"
 import { useStorage } from "@plasmohq/storage/hook"
 
 import { addCss, saveHtml, saveMarkdown, setIcon } from "~tools"
+import { useContent } from "~utils/editMarkdownHook"
 import Turndown from "~utils/turndown"
 
 export const config: PlasmoCSConfig = {
@@ -17,6 +18,7 @@ const articleTitle = document.querySelector<HTMLElement>("head title").innerText
 export default function Custom() {
   const [closeAIBox] = useStorage<boolean>("baidu-closeAIBox")
   const [closeLog] = useStorage("config-closeLog", true)
+  const [content, setContent] = useContent()
 
   useEffect(() => {
     closeLog || console.log("baidu", { closeAIBox })
@@ -28,6 +30,9 @@ export default function Custom() {
     if (req.name == "baidu-isShow") {
       res.send({ isShow: true })
     }
+    if (req.name == "baidu-editMarkdown") {
+      setContent(".wd-ai-index-pc")
+    }
     if (req.name == "baidu-downloadMarkdown") {
       downloadMarkdown()
     }
@@ -43,6 +48,13 @@ export default function Custom() {
     }`)
   }
 
+  function editMarkdown() {
+    const html = document.querySelector("article.article")
+    const markdown = turndownService.turndown(html)
+    setContent(markdown)
+    window.open("https://md.randbox.top", "_blank")
+  }
+
   function downloadMarkdown() {
     const html = document.querySelector(".wd-ai-index-pc")
     const markdown = turndownService.turndown(html)

diff --git a/contents/cnblogs.tsx b/contents/cnblogs.tsx
@@ -6,6 +6,7 @@ import { useMessage } from "@plasmohq/messaging/hook"
 import { useStorage } from "@plasmohq/storage/hook"
 
 import { saveHtml, saveMarkdown, setIcon } from "~tools"
+import { useContent } from "~utils/editMarkdownHook"
 import Turndown from "~utils/turndown"
 
 export const config: PlasmoCSConfig = {
@@ -20,6 +21,7 @@ export default function cnblogs() {
   const [copyCode] = useStorage<boolean>("cnblogs-copyCode")
   const [history, setHistory] = useStorage<any[]>("codebox-history")
   const [closeLog] = useStorage("config-closeLog", true)
+  const [content, setContent] = useContent()
 
   useEffect(() => {
     closeLog || console.log("cnblogs copyCode", copyCode)
@@ -31,6 +33,9 @@ export default function cnblogs() {
     if (req.name == "cnblogs-isShow") {
       res.send({ isShow: true })
     }
+    if (req.name == "cnblogs-editMarkdown") {
+      setContent("article.article")
+    }
     if (req.name == "cnblogs-downloadMarkdown") {
       downloadMarkdown()
     }

diff --git a/contents/csdn.tsx b/contents/csdn.tsx
@@ -6,6 +6,7 @@ import { useMessage } from "@plasmohq/messaging/hook"
 import { useStorage } from "@plasmohq/storage/hook"
 
 import { addCss, saveHtml, saveMarkdown, setIcon } from "~tools"
+import { useContent } from "~utils/editMarkdownHook"
 import Turndown from "~utils/turndown"
 
 export const config: PlasmoCSConfig = {
@@ -25,6 +26,7 @@ const csdn = () => {
   const [closeRedirectModal] = useStorage<boolean>("csdn-closeLoginModal")
   const [history, setHistory] = useStorage<any[]>("codebox-history")
   const [closeLog] = useStorage("config-closeLog", true)
+  const [content, setContent] = useContent()
 
   useEffect(() => {
     closeLog ||
@@ -65,6 +67,9 @@ const csdn = () => {
     if (req.name == "csdn-isShow") {
       res.send({ isShow: true })
     }
+    if (req.name == "csdn-editMarkdown") {
+      setContent(".blog-content-box")
+    }
     if (req.name == "csdn-downloadMarkdown") {
       downloadMarkdown()
     }