✨ Feature(custom): add upload selected file in menu

Author: Kuingsmile

package.json

@@ -61,13 +61,22 @@
         "command": "piclist.uploadAllImgInFile",
         "title": "%command.uploadAllImgInFile.title%",
         "category": "PicList"
+      },
+      {
+        "command": "piclist.uploadSelectedImg",
+        "title": "%command.uploadSelectedImg.title%",
+        "category": "PicList"
       }
     ],
     "menus": {
       "editor/context": [
         {
           "command": "piclist.deleteImage",
           "when": "editorTextFocus"
+        },
+        {
+          "command": "piclist.uploadSelectedImg",
+          "when": "editorTextFocus"
         }
       ]
     },

package.nls.json

@@ -7,6 +7,7 @@
   "command.openImageDB.title": "Open PicList image database",
   "command.uploadAllImgInFile.title": "Upload all images in the file",
   "command.delete.title": "Delete Image by PicList",
+  "command.uploadSelectedImg.title": "Upload Image by PicList",
   "config.title": "PicList",
   "config.uploadAPIUrl.description": "Upload API URL, default is `http://127.0.0.1:36677/upload`",
   "config.deleteAPIUrl.description": "Delete API URL, default is `http://127.0.0.1:36677/delete`",

src/extension.ts

@@ -43,6 +43,9 @@ export async function activate(context: vscode.ExtensionContext) {
         }
       }
     }),
+    vscode.commands.registerCommand('piclist.uploadSelectedImg', async () => {
+      await Commands.commandManager.uploadSelectedImg()
+    }),
     vscode.commands.registerCommand('piclist.uploadAllImgInFile', async () => {
       await Commands.commandManager.uploadAllImgInFile()
     })

src/vscode/commands.ts

@@ -12,8 +12,13 @@ import getClipboardImage from './clipboard/getClipboardImage'
 export class Commands {
   static commandManager: Commands = new Commands()
 
-  async uploadCommand(input?: string[], shouldKeepAfterUploading = true, writeToEditor = true) {
-    const output = await Uploader.picgoAPI.upload(input)
+  async uploadCommand(
+    input?: string[],
+    shouldKeepAfterUploading = true,
+    writeToEditor = true,
+    getFileNameFromRes = false
+  ) {
+    const output = await Uploader.picgoAPI.upload(input, getFileNameFromRes)
     if (!output) return
     if (shouldKeepAfterUploading === false && input) {
       fs.removeSync(input[0])
@@ -106,11 +111,17 @@ export class Commands {
     }
   }
 
-  async uploadAllImgInFile() {
+  async uploadAllImgInFile(selected = false) {
     const editor = vscode.window.activeTextEditor
     if (editor) {
       const document = editor.document
       let text = document.getText()
+      if (selected) {
+        if (editor.selection.isEmpty) {
+          return
+        }
+        text = document.getText(editor.selection)
+      }
       const regex = /(!\[.*?\]\((.*?)\))|(<img[^>]*src="(.*?)"[^>]*>)|(https?:\/\/[^\s]+)|(\[img\](.*?)\[\/img\])/g
       let match
       const uploadedImages: { [key: string]: string } = {}
@@ -127,11 +138,11 @@ export class Commands {
             res = uploadedImages[url]
           } else {
             if (isURL(url)) {
-              res = await this.uploadCommand([url], true, false)
+              res = await this.uploadCommand([url], true, false, true)
             } else {
               const localPath = path.isAbsolute(url) ? url : path.join(document.uri.fsPath, '../', url)
               if (fs.existsSync(localPath)) {
-                res = await this.uploadCommand([localPath], true, false)
+                res = await this.uploadCommand([localPath], true, false, true)
               }
             }
             if (res) {
@@ -143,10 +154,20 @@ export class Commands {
           }
         }
       }
-      const range = new vscode.Range(document.positionAt(0), document.positionAt(text.length))
+      const range =
+        selected && !editor.selection.isEmpty
+          ? editor.selection
+          : new vscode.Range(document.positionAt(0), document.positionAt(text.length))
       editor.edit(editBuilder => {
         editBuilder.replace(range, text)
       })
     }
   }
+
+  async uploadSelectedImg() {
+    const editor = vscode.window.activeTextEditor
+    if (editor) {
+      await this.uploadAllImgInFile(true)
+    }
+  }
 }

src/vscode/uploader.ts

@@ -47,7 +47,7 @@ export class Uploader {
     return false
   }
 
-  async upload(input?: string[]): Promise<string> {
+  async upload(input?: string[], getFileNameFromRes = false): Promise<string> {
     try {
       let res
       if (getRemoteServerMode()) {
@@ -79,7 +79,7 @@ export class Uploader {
       if (res.status === 200 && res.data.success) {
         const selectedText = Editor.editor?.document.getText(Editor.editor.selection)
         const output = res.data.result.map((item: string) => {
-          return this.formatOutput(item, getFileName(item, selectedText))
+          return this.formatOutput(item, getFileName(item, selectedText, getFileNameFromRes))
         })
         const outputStr = output.join('\n')
         DataStore.writeUploadedFileDB(res.data.fullResult)

src/vscode/utils/index.ts

@@ -64,9 +64,9 @@ export function getRemoteServerMode(): boolean {
   return false
 }
 
-export function getFileName(item: string, selectedText?: string): string {
+export function getFileName(item: string, selectedText?: string, getFileNameFromRes = false): string {
   let fileName: string = ''
-  if (selectedText) {
+  if (selectedText && !getFileNameFromRes) {
     fileName = selectedText
   } else {
     try {