Fix liniting and optimize some functions

First fixed some linting issues. Also optimized some functions to be
undoable with one ctrl+z.

This should also speedup some operations

Signed-off-by: Sheogorath <sheogorath@shivering-isles.com>

2 files changed, 72 insertions, 43 deletions

diff --git a/public/js/lib/editor/index.js b/public/js/lib/editor/index.js
index cb9192bc..0537e927 100644
--- a/public/js/lib/editor/index.js
+++ b/public/js/lib/editor/index.js
@@ -139,13 +139,10 @@ export default class Editor {
 
   addToolBar () {
     this.toolBar = $(toolBarTemplate)
-    //console.log('PLACE', $('#toolbarPlace'))
-    //$('#toolbarPlace').html(this.toolBar)
     this.toolbarPanel = this.editor.addPanel(this.toolBar[0], {
-       position: 'top'
+      position: 'top'
     })
 
-    var insertDemo = $('#insertDemo')
     var makeBold = $('#makeBold')
     var makeItalic = $('#makeItalic')
     var makeStrike = $('#makeStrike')
@@ -162,18 +159,18 @@ export default class Editor {
     var makeComment = $('#makeComment')
 
     makeBold.click(() => {
-        utils.wrapTextWith(this.editor, this.editor, '**')
-        this.editor.focus()
+      utils.wrapTextWith(this.editor, this.editor, '**')
+      this.editor.focus()
     })
 
     makeItalic.click(() => {
-        utils.wrapTextWith(this.editor, this.editor, '*')
-        this.editor.focus()
+      utils.wrapTextWith(this.editor, this.editor, '*')
+      this.editor.focus()
     })
 
     makeStrike.click(() => {
-        utils.wrapTextWith(this.editor, this.editor, '~~')
-        this.editor.focus()
+      utils.wrapTextWith(this.editor, this.editor, '~~')
+      this.editor.focus()
     })
 
     makeHeader.click(() => {
@@ -182,7 +179,7 @@ export default class Editor {
 
     makeCode.click(() => {
       utils.wrapTextWith(this.editor, this.editor, '```')
-        this.editor.focus()
+      this.editor.focus()
     })
 
     makeQuote.click(() => {
@@ -202,11 +199,11 @@ export default class Editor {
     })
 
     makeLink.click(() => {
-      utils.insertText(this.editor, '[](https://)', 1)
+      utils.insertLink(this.editor, false)
     })
 
     makeImage.click(() => {
-      utils.insertText(this.editor, '![](https://)', 4)
+      utils.insertLink(this.editor, true)
     })
 
     makeTable.click(() => {
@@ -218,9 +215,8 @@ export default class Editor {
     })
 
     makeComment.click(() => {
-      utils.insertText(this.editor, '> []', 4)
+      utils.insertText(this.editor, '> []')
     })
-
   }
 
   addStatusBar () {
diff --git a/public/js/lib/editor/utils.js b/public/js/lib/editor/utils.js
index f1053c4c..33670884 100644
--- a/public/js/lib/editor/utils.js
+++ b/public/js/lib/editor/utils.js
@@ -3,39 +3,39 @@ export function wrapTextWith (editor, cm, symbol) {
   if (!cm.getSelection()) {
     return CodeMirror.Pass
   } else {
-    var ranges = cm.listSelections()
-    for (var i = 0; i < ranges.length; i++) {
-      var range = ranges[i]
+    let ranges = cm.listSelections()
+    for (let i = 0; i < ranges.length; i++) {
+      let range = ranges[i]
       if (!range.empty()) {
         const from = range.from()
         const to = range.to()
 
         if (symbol !== 'Backspace') {
-          cm.replaceRange(symbol, to, to, '+input')
-          cm.replaceRange(symbol, from, from, '+input')
-          // workaround selection range not correct after add symbol
-          var _ranges = cm.listSelections()
-          var anchorIndex = editor.indexFromPos(_ranges[i].anchor)
-          var headIndex = editor.indexFromPos(_ranges[i].head)
+          let selection = cm.getRange(from, to)
+          let anchorIndex = editor.indexFromPos(ranges[i].anchor)
+          let headIndex = editor.indexFromPos(ranges[i].head)
+          cm.replaceRange(symbol + selection + symbol, from, to, '+input')
           if (anchorIndex > headIndex) {
-            _ranges[i].anchor.ch--
+            ranges[i].anchor.ch+= symbol.length
+            ranges[i].head.ch+= symbol.length
           } else {
-            _ranges[i].head.ch--
+            ranges[i].head.ch+= symbol.length
+            ranges[i].anchor.ch+= symbol.length
           }
-          cm.setSelections(_ranges)
+          cm.setSelections(ranges)
         } else {
-          var preEndPos = {
+          let preEndPos = {
             line: to.line,
-            ch: to.ch + 1
+            ch: to.ch + symbol.length
           }
-          var preText = cm.getRange(to, preEndPos)
-          var preIndex = wrapSymbols.indexOf(preText)
-          var postEndPos = {
+          let preText = cm.getRange(to, preEndPos)
+          let preIndex = wrapSymbols.indexOf(preText)
+          let postEndPos = {
             line: from.line,
-            ch: from.ch - 1
+            ch: from.ch - symbol.length
           }
-          var postText = cm.getRange(postEndPos, from)
-          var postIndex = wrapSymbols.indexOf(postText)
+          let postText = cm.getRange(postEndPos, from)
+          let postIndex = wrapSymbols.indexOf(postText)
           // check if surround symbol are list in array and matched
           if (preIndex > -1 && postIndex > -1 && preIndex === postIndex) {
             cm.replaceRange('', to, preEndPos, '+delete')
@@ -48,12 +48,44 @@ export function wrapTextWith (editor, cm, symbol) {
 }
 
 export function insertText (cm, text, cursorEnd = 0) {
-  var cursor = cm.getCursor()
+  let cursor = cm.getCursor()
   cm.replaceSelection(text, cursor, cursor)
   cm.focus()
   cm.setCursor({line: cursor.line, ch: cursor.ch + cursorEnd})
 }
 
+export function insertLink(cm, isImage) {
+  let cursor = cm.getCursor()
+  let ranges = cm.listSelections()
+  const linkEnd = '](https://)'
+  const symbol = (isImage) ? '![' : '['
+
+  for (let i = 0; i < ranges.length; i++) {
+    let range = ranges[i]
+    if (!range.empty()) {
+      const from = range.from()
+      const to = range.to()
+      let anchorIndex = editor.indexFromPos(ranges[i].anchor)
+      let headIndex = editor.indexFromPos(ranges[i].head)
+      let selection = cm.getRange(from, to)
+      selection = symbol + selection + linkEnd
+      cm.replaceRange(selection, from, to)
+      if (anchorIndex > headIndex) {
+        ranges[i].anchor.ch+= symbol.length
+        ranges[i].head.ch+= symbol.length
+      } else {
+        ranges[i].head.ch+= symbol.length
+        ranges[i].anchor.ch+= symbol.length
+      }
+      cm.setSelections(ranges)
+    } else {
+      cm.replaceRange(symbol + linkEnd, cursor, cursor)
+      cm.setCursor({line: cursor.line, ch: cursor.ch + symbol.length + linkend.length})
+    }
+  }
+  cm.focus()
+}
+
 export function insertHeader (cm) {
   let cursor = cm.getCursor()
   let startOfLine = {line: cursor.line, ch: 0}
@@ -67,22 +99,23 @@ export function insertHeader (cm) {
   cm.focus()
 }
 
-export function insertOnStartOfLines (cm, symbol, cursorEnd) {
+export function insertOnStartOfLines (cm, symbol) {
   let cursor = cm.getCursor()
-  var ranges = cm.listSelections()
+  let ranges = cm.listSelections()
 
   for (let i = 0; i < ranges.length; i++) {
-    var range = ranges[i]
+    let range = ranges[i]
     if (!range.empty()) {
       const from = range.from()
       const to = range.to()
-      for (let j = from.line; j <= to.line; ++j) {
-        cm.replaceRange(symbol, {line: j, ch: 0}, {line: j, ch: 0})
-      }
+      let selection = cm.getRange({line: from.line, ch: 0}, to)
+      selection = selection.replace(/\n/g, '\n' + symbol)
+      selection = symbol + selection
+      cm.replaceRange(selection, from, to)
     } else {
       cm.replaceRange(symbol, {line: cursor.line, ch: 0}, {line: cursor.line, ch: 0})
     }
   }
-  cm.setCursor({line: cursor.line, ch: (cursorEnd)? cursorEnd : cursor.ch})
+  cm.setCursor({line: cursor.line, ch: cursor.ch + symbol.length})
   cm.focus()
 }