feat: add "upload local image" option to "copy rendered content"

src/renderer/plugins/copy-rendered-content.tsx

@@ -6,18 +6,30 @@ export default {
     const options = ctx.lib.vue.reactive({
       inlineStyle: false,
       inlineLocalImage: false,
+      uploadLocalImage: false,
       highlightCode: false,
       type: 'rtf' as 'html' | 'rtf',
     })
 
     const panel = ctx.lib.vue.defineComponent({
       setup () {
+        ctx.lib.vue.watch(() => ({ ...options }), (val, prev) => {
+          if (val.uploadLocalImage && val.inlineLocalImage) {
+            if (!prev.uploadLocalImage) {
+              options.inlineLocalImage = false
+            } else {
+              options.uploadLocalImage = false
+            }
+          }
+        })
+
         return () => <div class="copy-rendered-content">
           <div>
             <div class="label">{ctx.i18n.t('copy-rendered-content.options')}</div>
             <div>
-              <label><input v-model={options.inlineStyle} type="checkbox" /> {ctx.i18n.t('copy-rendered-content.inline-style')} </label>
               <label><input v-model={options.inlineLocalImage} type="checkbox" /> {ctx.i18n.t('copy-rendered-content.inline-image')} </label>
+              <label><input v-model={options.uploadLocalImage} type="checkbox" /> {ctx.i18n.t('copy-rendered-content.upload-image')} </label>
+              <label><input v-model={options.inlineStyle} type="checkbox" /> {ctx.i18n.t('copy-rendered-content.inline-style')} </label>
               <label><input v-model={options.highlightCode} type="checkbox" /> {ctx.i18n.t('copy-rendered-content.highlight-code')} </label>
             </div>
           </div>
@@ -38,8 +50,14 @@ export default {
         component: panel,
       })) {
         try {
+          const startedAt = Date.now()
+          ctx.ui.useToast().show('info', ctx.i18n.t('loading'), 10000)
           const html = await ctx.view.getContentHtml(options)
 
+          if (Date.now() - startedAt > 3000) {
+            await ctx.ui.useModal().alert({ content: ctx.i18n.t('copy-rendered-content.complete') })
+          }
+
           if (options.type === 'rtf') {
             await ctx.base.writeToClipboard('text/html', html)
             ctx.ui.useToast().show('info', ctx.i18n.t('copied'))

src/renderer/plugins/markdown-link.ts

@@ -179,12 +179,23 @@ export default {
       // local image
       const srcAttr = node.getAttribute('src')
       if (srcAttr && node.getAttribute(DOM_ATTR_NAME.LOCAL_IMAGE)) {
-        if (options.inlineLocalImage) {
+        if (options.inlineLocalImage || options.uploadLocalImage) {
           try {
+            const originSrc = node.getAttribute(DOM_ATTR_NAME.ORIGIN_SRC)
             const res: Response = await ctx.api.fetchHttp(srcAttr)
-            const base64Url = await ctx.utils.fileToBase64URL(await res.blob())
-            node.setAttribute('src', base64Url)
-            node.removeAttribute(DOM_ATTR_NAME.ORIGIN_SRC)
+            const file = new File([await res.blob()], originSrc ? ctx.utils.path.basename(originSrc) : 'img')
+
+            let url: string | undefined
+            if (options.inlineLocalImage) {
+              url = await ctx.utils.fileToBase64URL(file)
+            } else if (options.uploadLocalImage) {
+              url = await ctx.action.getActionHandler('plugin.image-hosting-picgo.upload')(file)
+            }
+
+            if (url) {
+              node.setAttribute('src', url)
+              node.removeAttribute(DOM_ATTR_NAME.ORIGIN_SRC)
+            }
           } catch (error) {
             console.log(error)
           }

src/renderer/types.ts

@@ -148,7 +148,7 @@ export type BuildInActions = {
   'xterm.init': () => void,
   'plugin.document-history-stack.back': () => void,
   'plugin.document-history-stack.forward': () => void,
-  'plugin.image-hosting-picgo.upload': (file: File) => void,
+  'plugin.image-hosting-picgo.upload': (file: File) => Promise<string | undefined>,
   'plugin.status-bar-help.show-readme': () => void,
   'plugin.status-bar-help.show-features': () => void,
   'plugin.status-bar-help.show-shortcuts': () => void,
@@ -186,6 +186,7 @@ export type BuildInHookTypes = {
     options: {
       inlineStyle?: boolean,
       inlineLocalImage?: boolean,
+      uploadLocalImage?: boolean,
       highlightCode?: boolean,
       nodeProcessor?: (node: HTMLElement) => void
     }

src/share/i18n/languages/en.ts

@@ -483,8 +483,10 @@ const data = {
     'type': 'Copy Type: ',
     'inline-style': 'Inline Style',
     'inline-image': 'Inline Local Image',
+    'upload-image': 'Upload Local Image',
     'highlight-code': 'Highlight Code',
     'rtf': 'Rich Text Format',
+    'complete': 'Conversion completed, click OK to copy',
   },
   'share-preview': {
     'expire': 'Expire',

src/share/i18n/languages/zh-CN.ts

@@ -484,8 +484,10 @@ const data: BaseLanguage = {
     'type': '复制类型: ',
     'inline-style': '内联样式',
     'inline-image': '内联本地图片',
+    'upload-image': '上传本地图片',
     'highlight-code': '高亮代码',
     'rtf': '富文本',
+    'complete': '转换完成，点击确定复制',
   },
   'share-preview': {
     'expire': '到期',