:recycle: #650 剪切重构及其余模式修改

CHANGELOG.md

@@ -77,7 +77,11 @@
 * [open issues](https://github.com/Vanessa219/vditor/issues)
 * [346](https://github.com/Vanessa219/vditor/issues/346) 内容主题推荐（长期有效） `改进功能`
 
-### v3.4.0 / 2020-07-xx
+### v3.4.1 / 2020-08-xx
+
+* [650](https://github.com/Vanessa219/vditor/pull/650) 全选剪切及任务列表样式和点击问题改进 `修复缺陷`
+
+### v3.4.0 / 2020-07-30
 
 * [636](https://github.com/Vanessa219/vditor/issues/636) SV 模式 Setext 标题问题 `修复缺陷`
 * [647](https://github.com/Vanessa219/vditor/pull/647) 即时渲染模式输入 ``` 后会弹出 hint，此时执行 undo 后， hint 不消失 `改进功能`

demo/index.js

@@ -50,8 +50,8 @@ if (window.innerWidth < 768) {
 }
 
 window.vditor = new Vditor('vditor', {
-  _lutePath: `http://192.168.0.107:9090/lute.min.js?${new Date().getTime()}`,
-  // _lutePath: 'src/js/lute/lute.min.js',
+  // _lutePath: `http://192.168.0.107:9090/lute.min.js?${new Date().getTime()}`,
+  _lutePath: 'src/js/lute/lute.min.js',
   toolbar,
   mode: 'wysiwyg',
   height: window.innerHeight + 100,

src/ts/ir/index.ts

@@ -1,6 +1,14 @@
 import {Constants} from "../constants";
 import {isCtrl, isFirefox} from "../util/compatibility";
-import {blurEvent, dropEvent, focusEvent, hotkeyEvent, scrollCenter, selectEvent} from "../util/editorCommonEvent";
+import {
+    blurEvent,
+    copyEvent, cutEvent,
+    dropEvent,
+    focusEvent,
+    hotkeyEvent,
+    scrollCenter,
+    selectEvent,
+} from "../util/editorCommonEvent";
 import {paste} from "../util/fixBrowserBehavior";
 import {hasClosestByClassName} from "../util/hasClosest";
 import {
@@ -35,11 +43,14 @@ class IR {
         hotkeyEvent(vditor, this.element);
         selectEvent(vditor, this.element);
         dropEvent(vditor, this.element);
+        copyEvent(vditor, this.element, this.copy);
+        cutEvent(vditor, this.element, this.copy);
     }
-    private copyEvent(event: ClipboardEvent & { target: HTMLElement }, vditor: IVditor) {
+
+    private copy(event: ClipboardEvent, vditor: IVditor) {
         const range = getSelection().getRangeAt(0);
         if (range.toString() === "") {
-          return;
+            return;
         }
         event.stopPropagation();
         event.preventDefault();
@@ -50,16 +61,8 @@ class IR {
         event.clipboardData.setData("text/plain", vditor.lute.VditorIRDOM2Md(tempElement.innerHTML).trim());
         event.clipboardData.setData("text/html", "");
     }
+
     private bindEvent(vditor: IVditor) {
-        const copyEvent = this.copyEvent;
-        this.element.addEventListener(
-            "copy",
-            (event: ClipboardEvent & { target: HTMLElement }) => copyEvent(event, vditor));
-
-        this.element.addEventListener("cut", (event: ClipboardEvent & { target: HTMLElement }) => {
-            copyEvent(event, vditor);
-            document.execCommand("delete");
-        });
         this.element.addEventListener("paste", (event: ClipboardEvent & { target: HTMLElement }) => {
             paste(vditor, event, {
                 pasteCode: (code: string) => {

src/ts/sv/index.ts

@@ -1,5 +1,13 @@
 import {isCtrl, isFirefox} from "../util/compatibility";
-import {blurEvent, dropEvent, focusEvent, hotkeyEvent, scrollCenter, selectEvent} from "../util/editorCommonEvent";
+import {
+    blurEvent,
+    copyEvent, cutEvent,
+    dropEvent,
+    focusEvent,
+    hotkeyEvent,
+    scrollCenter,
+    selectEvent,
+} from "../util/editorCommonEvent";
 import {paste} from "../util/fixBrowserBehavior";
 import {getSelectText} from "../util/getSelectText";
 import {inputEvent} from "./inputEvent";
@@ -25,15 +33,17 @@ class Editor {
         hotkeyEvent(vditor, this.element);
         selectEvent(vditor, this.element);
         dropEvent(vditor, this.element);
+        copyEvent(vditor, this.element, this.copy);
+        cutEvent(vditor, this.element, this.copy);
     }
 
-    private bindEvent(vditor: IVditor) {
-        this.element.addEventListener("copy", (event: ClipboardEvent) => {
-            event.stopPropagation();
-            event.preventDefault();
-            event.clipboardData.setData("text/plain", getSelectText(this.element));
-        });
+    private copy(event: ClipboardEvent) {
+        event.stopPropagation();
+        event.preventDefault();
+        event.clipboardData.setData("text/plain", getSelectText(this.element));
+    }
 
+    private bindEvent(vditor: IVditor) {
         this.element.addEventListener("paste", (event: ClipboardEvent & { target: HTMLElement }) => {
             paste(vditor, event, {
                 pasteCode: (code: string) => {

src/ts/util/editorCommonEvent.ts

@@ -54,6 +54,19 @@ export const dropEvent = (vditor: IVditor, editorElement: HTMLElement) => {
     }
 };
 
+export const copyEvent =
+    (vditor: IVditor, editorElement: HTMLElement, copy: (event: ClipboardEvent, vditor: IVditor) => void) => {
+        editorElement.addEventListener("copy", (event: ClipboardEvent) => copy(event, vditor));
+    };
+
+export const cutEvent =
+    (vditor: IVditor, editorElement: HTMLElement, copy: (event: ClipboardEvent, vditor: IVditor) => void) => {
+        editorElement.addEventListener("cut", (event: ClipboardEvent) => {
+            copy(event, vditor);
+            document.execCommand("delete");
+        });
+    };
+
 export const scrollCenter = (vditor: IVditor) => {
     if (!vditor.options.typewriterMode) {
         return;

src/ts/wysiwyg/index.ts

@@ -1,7 +1,15 @@
 import {Constants} from "../constants";
 import {hidePanel} from "../toolbar/setToolbar";
 import {isCtrl, isFirefox} from "../util/compatibility";
-import {blurEvent, dropEvent, focusEvent, hotkeyEvent, scrollCenter, selectEvent} from "../util/editorCommonEvent";
+import {
+    blurEvent,
+    copyEvent, cutEvent,
+    dropEvent,
+    focusEvent,
+    hotkeyEvent,
+    scrollCenter,
+    selectEvent,
+} from "../util/editorCommonEvent";
 import {isHeadingMD, isHrMD, paste, renderToc} from "../util/fixBrowserBehavior";
 import {
     hasClosestBlock, hasClosestByAttribute,
@@ -46,6 +54,50 @@ class WYSIWYG {
         hotkeyEvent(vditor, this.element);
         selectEvent(vditor, this.element);
         dropEvent(vditor, this.element);
+        copyEvent(vditor, this.element, this.copy);
+        cutEvent(vditor, this.element, this.copy);
+    }
+
+    private copy(event: ClipboardEvent, vditor: IVditor) {
+        const range = getSelection().getRangeAt(0);
+        if (range.toString() === "") {
+            return;
+        }
+        event.stopPropagation();
+        event.preventDefault();
+
+        const codeElement = hasClosestByMatchTag(range.startContainer, "CODE");
+        const codeEndElement = hasClosestByMatchTag(range.endContainer, "CODE");
+        if (codeElement && codeEndElement && codeEndElement.isSameNode(codeElement)) {
+            let codeText = "";
+            if (codeElement.parentElement.tagName === "PRE") {
+                codeText = range.toString();
+            } else {
+                codeText = "`" + range.toString() + "`";
+            }
+            event.clipboardData.setData("text/plain", codeText);
+            event.clipboardData.setData("text/html", "");
+            return;
+        }
+
+        const aElement = hasClosestByMatchTag(range.startContainer, "A");
+        const aEndElement = hasClosestByMatchTag(range.endContainer, "A");
+        if (aElement && aEndElement && aEndElement.isSameNode(aElement)) {
+            let aTitle = aElement.getAttribute("title") || "";
+            if (aTitle) {
+                aTitle = ` "${aTitle}"`;
+            }
+            event.clipboardData.setData("text/plain",
+                `[${range.toString()}](${aElement.getAttribute("href")}${aTitle})`);
+            event.clipboardData.setData("text/html", "");
+            return;
+        }
+
+        const tempElement = document.createElement("div");
+        tempElement.appendChild(range.cloneContents());
+
+        event.clipboardData.setData("text/plain", vditor.lute.VditorDOM2Md(tempElement.innerHTML).trim());
+        event.clipboardData.setData("text/html", "");
     }
 
     private bindEvent(vditor: IVditor) {
@@ -80,48 +132,6 @@ class WYSIWYG {
             this.popover.style.top = Math.max(max, Math.min(top, this.element.clientHeight - 21)) + "px";
         });
 
-        this.element.addEventListener("copy", (event: ClipboardEvent & { target: HTMLElement }) => {
-            const range = getSelection().getRangeAt(0);
-            if (range.toString() === "") {
-                return;
-            }
-            event.stopPropagation();
-            event.preventDefault();
-
-            const codeElement = hasClosestByMatchTag(range.startContainer, "CODE");
-            const codeEndElement = hasClosestByMatchTag(range.endContainer, "CODE");
-            if (codeElement && codeEndElement && codeEndElement.isSameNode(codeElement)) {
-                let codeText = "";
-                if (codeElement.parentElement.tagName === "PRE") {
-                    codeText = range.toString();
-                } else {
-                    codeText = "`" + range.toString() + "`";
-                }
-                event.clipboardData.setData("text/plain", codeText);
-                event.clipboardData.setData("text/html", "");
-                return;
-            }
-
-            const aElement = hasClosestByMatchTag(range.startContainer, "A");
-            const aEndElement = hasClosestByMatchTag(range.endContainer, "A");
-            if (aElement && aEndElement && aEndElement.isSameNode(aElement)) {
-                let aTitle = aElement.getAttribute("title") || "";
-                if (aTitle) {
-                    aTitle = ` "${aTitle}"`;
-                }
-                event.clipboardData.setData("text/plain",
-                    `[${range.toString()}](${aElement.getAttribute("href")}${aTitle})`);
-                event.clipboardData.setData("text/html", "");
-                return;
-            }
-
-            const tempElement = document.createElement("div");
-            tempElement.appendChild(range.cloneContents());
-
-            event.clipboardData.setData("text/plain", vditor.lute.VditorDOM2Md(tempElement.innerHTML).trim());
-            event.clipboardData.setData("text/html", "");
-        });
-
         this.element.addEventListener("paste", (event: ClipboardEvent & { target: HTMLElement }) => {
             paste(vditor, event, {
                 pasteCode: (code: string) => {