ayanova/src/components/wiki-control.vue

@@ -238,7 +238,25 @@ import marked from "marked";
 import DOMPurify from "dompurify";
 
 export default {
-  created() {},
+  created() {
+  
+    // Add a hook to make all links open a new window
+    DOMPurify.addHook("afterSanitizeAttributes", function(node) {
+      // set all elements owning target to target=_blank
+      if ("target" in node) {
+        node.setAttribute("target", "_blank");
+        // prevent https://www.owasp.org/index.php/Reverse_Tabnabbing
+        node.setAttribute("rel", "noopener noreferrer");
+      }
+      // set non-HTML/MathML links to xlink:show=new
+      if (
+        !node.hasAttribute("target") &&
+        (node.hasAttribute("xlink:href") || node.hasAttribute("href"))
+      ) {
+        node.setAttribute("xlink:show", "new");
+      }
+    });
+  },
   data() {
     return {
       localVal: this.value,
@@ -277,6 +295,12 @@ export default {
     }
   },
   methods: {
+    compiledOutput() {
+      if (this.localVal.length == 0) {
+        return "";
+      }
+      return DOMPurify.sanitize(marked(this.localVal, { breaks: true }));
+    },
     onResize() {
       // this.editAreaHeight = window.innerHeight / 2;
       this.editAreaHeight = window.innerHeight * 0.8;
@@ -396,6 +420,7 @@ export default {
       }
     },
     handleInput(val) {
+      debugger;
       this.$emit("input", val);
       this.localVal = val;
     },
@@ -466,12 +491,7 @@ export default {
     visibleIcon() {
       return this.wikiVisible ? "fa-eye-slash" : "fa-eye";
     },
-    compiledOutput() {
+
-      if (this.localVal.length == 0) {
-        return "";
-      }
-      return DOMPurify.sanitize(marked(this.localVal, { breaks: true }));
-    },
     clickBold() {
       this.getSelectedRange();
       this.replaceSelectedText("**" + this.getSelectedText() + "**");
@@ -625,11 +645,17 @@ export default {
     },
     clickLink() {
       this.linkMenu = false;
-
       this.getSelectedRange();
+
       //this.linkUrl
       //this.linkText
-      let t = "\nHYOUR LINK HERE";
+      let url = this.linkUrl;
+      //force it to an external url
+      if (!url.includes(":")) {
+        url = "https://" + url;
+      }
+      let t = "[" + this.linkText + "](" + url + ")";
+      // [MY Awesome LINK](www.ayanova.com)
 
       this.replaceSelectedText(t);
     }