Add "directly open editor" shortcut and icon

public/i18n/en_US.json

@@ -1,10 +1,12 @@
 {
   "insertDrawing": "Insert Drawing",
   "editDrawing": "Edit with js-draw",
+  "editShortcut": "Open editor directly",
   "errNoFileID": "File ID missing - couldn't open file.",
   "errSyncIDNotFound": "Couldn't find SyncID in document for drawing, make sure you're trying to edit a drawing that is included in at least a note.",
   "errCreateUnknown": "Unknown error while creating editor, please try again.",
   "errInvalidBackgroundColor": "Invalid background color! Please enter an HEX color, like #000000 (black) or #FFFFFF (white). The old background color will be used.",
+  "msgMustSelect": "Select a whiteboard in your document by left-clicking it, then use this icon/shortcut to open the editor directly.",
   "drawing": "Drawing",
   "settings": {
     "name": "js-draw Plugin Settings",

src/index.ts

@@ -1,4 +1,4 @@
-import {Plugin, Protyle} from 'siyuan';
+import {Plugin, Protyle, showMessage} from 'siyuan';
 import {
     getMarkdownBlock,
     loadIcons,
@@ -51,6 +51,23 @@ export default class DrawJSPlugin extends Plugin {
             })
         })
 
+        this.addCommand({
+            langKey: "editShortcut",
+            hotkey: "⌥⇧D",
+            callback: async () => {
+                await this.editSelectedImg();
+            },
+        })
+
+        this.addTopBar({
+            icon: "iconDraw",
+            title: this.i18n.insertDrawing,
+            callback: async () => {
+                await this.editSelectedImg();
+            },
+            position: "left"
+        })
+
     }
 
     onunload() {
@@ -61,6 +78,23 @@ export default class DrawJSPlugin extends Plugin {
         void this.analytics.sendEvent("uninstall");
     }
 
+    private async editSelectedImg() {
+
+        let selectedImg = document.getElementsByClassName('img--select');
+        if(selectedImg.length == 0) {
+            showMessage(this.i18n.msgMustSelect, 5000, 'info');
+            return;
+        }
+
+        let ids = imgSrcToIDs(findImgSrc(selectedImg[0] as HTMLElement));
+        if(ids == null) {
+            return;
+        }
+        void this.analytics.sendEvent('edit');
+        (await EditorManager.create(ids.fileID, this)).open(this);
+
+    }
+
     private async startConfig() {
         this.config = new PluginConfig();
         await this.config.load();