:recycle:

src/ts/toolbar/Devtools.ts

@@ -1,32 +1,23 @@
 import bugSVG from "../../assets/icons/bug.svg";
 import {getEventName} from "../util/compatibility";
 import {MenuItem} from "./MenuItem";
+import {setPadding} from "../ui/initUI";
 
 export class Devtools extends MenuItem {
     constructor(vditor: IVditor, menuItem: IMenuItem) {
         super(vditor, menuItem);
         this.element.children[0].innerHTML = menuItem.icon || bugSVG;
 
-        this.element.addEventListener(getEventName(),  (event) => {
+        this.element.addEventListener(getEventName(), (event) => {
             event.preventDefault();
             if (this.element.children[0].classList.contains("vditor-menu--current")) {
                 this.element.children[0].classList.remove("vditor-menu--current");
                 vditor.devtools.element.style.display = "none";
-                if (vditor.wysiwyg) {
-                    const padding =
-                        (vditor.wysiwyg.element.parentElement.scrollWidth - vditor.options.preview.maxWidth) / 2;
-                    vditor.wysiwyg.element.style.paddingLeft = `${Math.max(10, padding)}px`;
-                    vditor.wysiwyg.element.style.paddingRight = `${Math.max(10, padding)}px`;
-                }
+                setPadding(vditor)
             } else {
                 this.element.children[0].classList.add("vditor-menu--current");
                 vditor.devtools.element.style.display = "block";
-                if (vditor.wysiwyg) {
-                    const padding =
-                        ((vditor.wysiwyg.element.parentElement.scrollWidth / 2) - vditor.options.preview.maxWidth) / 2;
-                    vditor.wysiwyg.element.style.paddingLeft = `${Math.max(10, padding)}px`;
-                    vditor.wysiwyg.element.style.paddingRight = `${Math.max(10, padding)}px`;
-                }
+                setPadding(vditor)
                 vditor.devtools.renderEchart(vditor);
             }
         });

src/ts/ui/initUI.ts

@@ -22,17 +22,11 @@ export const initUI = (vditor: IVditor) => {
     const contentElement = document.createElement("div");
     contentElement.className = "vditor-content";
 
-    if (vditor.wysiwyg) {
-        contentElement.appendChild(vditor.wysiwyg.element.parentElement);
-    }
+    contentElement.appendChild(vditor.wysiwyg.element.parentElement);
 
-    if (vditor.editor) {
-        contentElement.appendChild(vditor.editor.element);
-    }
+    contentElement.appendChild(vditor.editor.element);
 
-    if (vditor.ir) {
-        contentElement.appendChild(vditor.ir.element.parentElement);
-    }
+    contentElement.appendChild(vditor.ir.element.parentElement);
 
     if (vditor.preview) {
         contentElement.appendChild(vditor.preview.element);
@@ -65,6 +59,13 @@ export const initUI = (vditor: IVditor) => {
     afterRender(vditor, contentElement);
 };
 
+export const setPadding = (vditor: IVditor) => {
+    const padding = (vditor.wysiwyg.element.parentElement.parentElement.clientWidth
+        - vditor.options.preview.maxWidth) / 2;
+    vditor.wysiwyg.element.style.padding = `10px ${Math.max(35, padding)}px`;
+    vditor.ir.element.style.padding = `10px ${Math.max(35, padding)}px`;
+};
+
 const afterRender = (vditor: IVditor, contentElement: HTMLElement) => {
 
     let height: number = Math.max(contentElement.offsetHeight, 20);
@@ -77,18 +78,10 @@ const afterRender = (vditor: IVditor, contentElement: HTMLElement) => {
         contentElement.style.setProperty("--editor-bottom", height / 2 + "px");
     }
 
-    if (vditor.wysiwyg || vditor.ir) {
-        const setPadding = () => {
-            const padding = (vditor.wysiwyg.element.parentElement.parentElement.clientWidth
-                - vditor.options.preview.maxWidth) / 2;
-            vditor.wysiwyg.element.style.padding = `10px ${Math.max(35, padding)}px`;
-            vditor.ir.element.style.padding = `10px ${Math.max(35, padding)}px`;
-        };
-        setPadding();
-        window.addEventListener("resize", () => {
-            setPadding();
-        });
-    }
+    setPadding(vditor);
+    window.addEventListener("resize", () => {
+        setPadding(vditor);
+    });
 
     // set default value
     let initValue = localStorage.getItem("vditor" + vditor.id);

src/ts/ui/setTheme.ts

@@ -5,16 +5,12 @@ export const setTheme = (vditor: IVditor) => {
         if (vditor.preview) {
             vditor.preview.element.firstElementChild.classList.add("vditor-reset--dark");
         }
-        if (vditor.wysiwyg) {
-            vditor.wysiwyg.element.classList.add("vditor-reset--dark");
-        }
+        vditor.wysiwyg.element.classList.add("vditor-reset--dark");
     } else {
         vditorElement.classList.remove("vditor--dark");
         if (vditor.preview) {
             vditor.preview.element.firstElementChild.classList.remove("vditor-reset--dark");
         }
-        if (vditor.wysiwyg) {
-            vditor.wysiwyg.element.classList.remove("vditor-reset--dark");
-        }
+        vditor.wysiwyg.element.classList.remove("vditor-reset--dark");
     }
 };

src/ts/util/getMarkdown.ts

@@ -5,7 +5,7 @@ export const getMarkdown = (vditor: IVditor) => {
     if (vditor.currentMode === "markdown") {
         // last char must be a `\n`.
         return code160to32(`${vditor.editor.element.textContent}\n`.replace(/\n\n$/, "\n"));
-    } else if (vditor.wysiwyg) {
+    } else if (vditor.currentMode === "wysiwyg") {
         const tempEditorElement = vditor.wysiwyg.element.cloneNode(true) as HTMLElement;
         addP2Li(tempEditorElement);
         return vditor.lute.VditorDOM2Md(tempEditorElement.innerHTML);