Add copy to clipboard feature and editor configuration (#15)

* A editorconfig

* A run lint at pre-commit

* U change index_size to 4

* A copyMarkDownTitleFromFile/showMindMapFromFile

* U lint copyMarkDownTitleFromFile/showMindMapFromFile

* Revert 23ae53d: refuse adding husky.

* lint: add new line to file

* U mindMapPreviewWebview.ts 根据评审修改

* change command name & pre-release works:

 - Document: checked
 - Change Log: checked
 - Update version: checked

Co-authored-by: Joseph Chris <baobao1270@gmail.com>

.editorconfig

@@ -0,0 +1,13 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 4
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+insert_final_newline = false
+trim_trailing_whitespace = false

CHANGELOG.md

@@ -1,5 +1,9 @@
 # Change Log
 
+## [v1.3.0]
+ - Added Markdown title-only mode
+ - Added Markdown title to clipboard
+
 ## [v1.1.0]
 
  - Added SVG export support

CHANGELOG_ZH.md

@@ -1,5 +1,9 @@
 # Change Log
 
+## [v1.3.0]
+ - 【新增】提取 Markdown 标题生成思维导图
+ - 【新增】提取 Markdown 标题到剪贴板
+
 ## [v1.1.0]
 
  - 【新增】SVG 导出功能

README.md

@@ -39,6 +39,11 @@ When previewing, open the command panel by shortcut keys `Ctrl+Shift+P` and type
 
 **If you run the command again, the previous svg file will be overwritten.**
 
+### Title-only Mode
+When a file is opened, the `Mind Map From File` command can find all markdown title of the document and generate a markdown preveiw.
+
+You can also use the `Copy Title From File` command to copy all markdown titles to clipboard.
+
 ## Reporting Bugs and Suggestions
 We use [GitHub Issue Page](https://github.com/baobao1270/vscode-markmind/issues/new/choose) as bug tracer and communition tool.
 

README_ZH.md

@@ -39,6 +39,11 @@
 
 **若您多次导出同名文件，仅保留最后一次导出的结果，先前的文件将被覆盖。**
 
+### 提取任意文件的 Markdown 标题
+在打开一个文件的状态下，使用 `Mind Map From File` 命令，可以提取该文件中所有的 Markdown 标题，并生成思维导图。
+
+同时，也可以使用 `Copy Title From File` 命令，将所有 Markdown 标题复制到剪贴板。
+
 ## 反馈 bug 或提供意见与建议
 本项目使用 [Issue](https://github.com/baobao1270/vscode-markmind/issues/new/choose) 来追踪 bug 和进行与项目有关的讨论。讨论的首选语言为英语，中文也可接受。
 

package.json

@@ -9,7 +9,7 @@
     "publisher": "josephcz",
     "displayName": "Markdown Mind Map Preview",
     "description": "A simple markdown mind map maker and previewer developed by a young and naive student.",
-    "version": "1.2.1",
+    "version": "1.3.0",
     "engines": {
         "vscode": "^1.49.0"
     },
@@ -27,7 +27,9 @@
     ],
     "activationEvents": [
         "onCommand:mdmmp.showMindMap",
-        "onCommand:mdmmp.exportSvg"
+        "onCommand:mdmmp.exportSvg",
+        "onCommand:mdmmp.showMindMapFromFile",
+        "onCommand:mdmmp.copyTitle"
     ],
     "main": "./out/extension.js",
     "contributes": {
@@ -49,6 +51,18 @@
                     "light": "./icon/mind-map-theme-light.svg",
                     "dark": "./icon/mind-map-theme-dark.svg"
                 }
+            },
+            {
+                "command": "mdmmp.showMindMapFromFile",
+                "title": "Mind Map From File",
+                "icon": {
+                    "light": "./icon/mind-map-theme-light.svg",
+                    "dark": "./icon/mind-map-theme-dark.svg"
+                }
+            },
+            {
+                "command": "mdmmp.copyTitle",
+                "title": "Copy Title To Clipboard"
             }
         ],
         "menus": {

src/extension.ts

@@ -1,5 +1,6 @@
 import * as vscode from "vscode";
 import { MindMapPreview } from "./mindMapPreviewWebview";
+import { writeToClipBoard } from "./writeToClipBoard";
 
 export function activate(context: vscode.ExtensionContext) {
     let mindMapPreview: MindMapPreview;
@@ -21,6 +22,17 @@ export function activate(context: vscode.ExtensionContext) {
             mindMapPreview.exportSvg();
         })
     );
+    context.subscriptions.push(
+        vscode.commands.registerCommand("mdmmp.showMindMapFromFile", () => {
+            if (mindMapPreview === undefined || mindMapPreview.isDisposed) {
+                mindMapPreview = new MindMapPreview(context);
+            }
+            mindMapPreview.updatePreview(true);
+        })
+    );
+    context.subscriptions.push(
+        vscode.commands.registerCommand("mdmmp.copyTitle", writeToClipBoard)
+    );
 }
 
 export function deactivate() {}

src/mindMapPreviewWebview.ts

@@ -8,7 +8,8 @@ class MindMapPreview {
     view: vscode.WebviewPanel;
     editingEditor!: vscode.TextEditor;
     isDisposed: boolean = false;
-
+    fromFile: boolean = false;
+
     // Configure initialization here.
     configureWebviewScripts(webviewScripts: string[]) {
         webviewScripts.push("libs/d3.js");
@@ -18,9 +19,12 @@ class MindMapPreview {
     }
 
     configureDisposables(disposables: vscode.Disposable[]) {
-        disposables.push(vscode.workspace.onDidChangeTextDocument(() => {
-            this.updatePreview();
-        }));
+        disposables.push(vscode.workspace.onDidChangeTextDocument(
+            utils.debounce(
+                this, 
+                () => { this.updatePreview.call(this, this.fromFile); },
+                2000 // Debounce 2000ms before rerending.
+            )));
         disposables.push(this.view.webview.onDidReceiveMessage((message) => {
             this.onMessageReceived(message);
         }, null, this.context.subscriptions));
@@ -118,10 +122,13 @@ class MindMapPreview {
         fs.writeFileSync(tempImage, html);
     }
 
-    updatePreview() {
-        const data = this.editingEditor.document.getText();
+    updatePreview(fromFile = false) {
+        this.fromFile = fromFile;
+
+        let data = this.editingEditor.document.getText();
+        if(this.fromFile) {data = utils.getMarkDownTitle(data);}
         this.view.webview.postMessage({
-            "command": "renderMarkdown", "data": data
+            command: "renderMarkdown", data: data
         });
     }
 

src/utils.ts

@@ -1,9 +1,30 @@
-export function getFileNameWithoutExtension(filename: string) {
+function getFileNameWithoutExtension(filename: string) {
     var pattern = /\.[A-Za-z]+$/;
     let ansMatch = pattern.exec(filename);
     if (ansMatch !== null) {
-        return (filename.slice(0, ansMatch.index));
+        return filename.slice(0, ansMatch.index);
     } else {
         return filename;
     }
 }
+
+function debounce(context: any, fn = () => {}, delay: number = 1000) {
+    let timeout: any = null;
+    return function () {
+        clearTimeout(timeout);
+
+        timeout = setTimeout(() => {
+            fn.apply(context, []);
+        }, delay);
+    };
+}
+
+function getMarkDownTitle(data: string = "") {
+    const titleMatchReg = /#+\s[^#\n]+/g;
+    let matchResult = data.match(titleMatchReg) || [];
+    data = matchResult.join("\n");
+
+    return data;
+}
+
+export { getFileNameWithoutExtension, debounce, getMarkDownTitle };

src/writeToClipBoard.ts

@@ -0,0 +1,21 @@
+import * as vscode from "vscode";
+import * as utils from "./utils";
+
+function writeToClipBoard() {
+    let editingEditor = vscode.window.activeTextEditor;
+
+    if (editingEditor && editingEditor.document) {
+        let data = editingEditor.document.getText();
+        data = utils.getMarkDownTitle(data);
+        vscode.env.clipboard.writeText(data).then(
+            (res) => {
+                vscode.window.setStatusBarMessage("copy success", 2000);
+            },
+            (res) => {
+                vscode.window.showErrorMessage("copy fail");
+            }
+        );
+    }
+}
+
+export { writeToClipBoard };