Improved design

Updated JS to remove undo manager - instead let the browser handle it all

app/assets/javascripts/lib/text_utility.js.coffee

 ((w) ->
   w.gl ?= {}
   w.gl.text ?= {}
-  w.gl.text.undoManager ?= {}
 
   gl.text.randomString = -> Math.random().toString(36).substring(7)
 
   gl.text.replaceRange = (s, start, end, substitute) ->
     s.substring(0, start) + substitute + s.substring(end);
 
-  gl.text.wrap = (textArea, tag) ->
-    $textArea = $(textArea)
-    oldVal = $textArea.val()
-    $textArea.focus()
-    textArea = $textArea.get(0)
-    selObj = window.getSelection()
-    selRange = selObj.getRangeAt(0)
-    text = $textArea.val()
-    replaceWith = @replaceRange(
-        text,
-        textArea.selectionStart,
-        textArea.selectionEnd,
-        (tag+selObj.toString()+tag))
-    $textArea.data('old-val', text).val(replaceWith)
-    gl.text.undoManager.addUndo(oldVal, $textArea.val())
+  gl.text.selectedText = (text, textarea) ->
+    text.substring(textarea.selectionStart, textarea.selectionEnd)
 
-  gl.text.prepend = (textArea, tag) ->
-    $textArea = $(textArea)
-    oldVal = $textArea.val()
-    $textArea.focus()
-    textArea = $textArea.get(0)
-    selObj = window.getSelection()
-    selRange = selObj.getRangeAt(0)
-    text = $textArea.val()
-    if textArea.selectionStart > 0 
-      lineBreak = '\n'
+  gl.text.insertText = (textArea, text, tag, selected, wrap) ->
+    startChar = if not wrap and textArea.selectionStart > 0 then '\n' else ''
+    insertText = "#{startChar}#{tag}#{selected}#{if wrap then tag else ' '}"
+
+    if document.queryCommandSupported('insertText')
+      document.execCommand 'insertText', false, insertText
     else
-      lineBreak = ''
+      try
+        document.execCommand("ms-beginUndoUnit")
 
-    replaceWith = @replaceRange(
+      textArea.value = @replaceRange(
           text,
           textArea.selectionStart,
           textArea.selectionEnd,
-      ("#{lineBreak}#{tag}#{selObj.toString()} \n")
-    )
-    $textArea.data('old-val', text).val(replaceWith);
-    gl.text.undoManager.addUndo(oldVal, $textArea.val())
+          insertText)
+      try
+        document.execCommand("ms-endUndoUnit")
 
-  gl.text.undoManager.history = {}
-  gl.text.undoManager.undoHistory = {}
+    @moveCursor(textArea, tag, wrap)
 
-  gl.text.undoManager.addUniqueIfNotExists = ($ta) ->
-    unique = $ta.attr('data-unique')
-    if not unique?
-      unique = gl.text.randomString()
-      $ta.attr('data-unique', unique)
-      gl.text.undoManager.history[unique] = []
-      gl.text.undoManager.undoHistory[unique] = []
-    unique
+  gl.text.moveCursor = (textArea, tag, wrapped) ->
+    return unless textArea.setSelectionRange
 
-  gl.text.undoManager.addUndo = (oldVal, newVal) ->
-    $thisTextarea = $('textarea:focus')
-    unique = gl.text.undoManager.addUniqueIfNotExists($thisTextarea)
-    gl.text.undoManager.history[unique].push({
-      oldVal: oldVal,
-      newVal: newVal
-    })
+    if textArea.selectionStart is textArea.selectionEnd
+      if wrapped
+        pos = textArea.selectionStart - tag.length
+      else
+        pos = textArea.selectionStart
+
+      textArea.setSelectionRange pos, pos
 
-  gl.text.undoManager.undo = () ->
-    $thisTextarea = $('textarea:focus')
-    unique = gl.text.undoManager.addUniqueIfNotExists($thisTextarea)
-    if not gl.text.undoManager.history[unique].length
-      return
-    latestChange = gl.text.undoManager.history[unique].pop()
-    gl.text.undoManager.undoHistory[unique].push(latestChange)
-    $thisTextarea.val(latestChange.oldVal)
+  gl.text.updateText = (textArea, tag, wrap) ->
+    $textArea = $(textArea)
+    oldVal = $textArea.val()
+    textArea = $textArea.get(0)
+    text = $textArea.val()
+    selected = @selectedText(text, textArea)
+    $textArea.focus()
 
-  gl.text.undoManager.redo = () ->
-    $thisTextarea = $('textarea:focus')
-    unique = gl.text.undoManager.addUniqueIfNotExists($thisTextarea)
-    if not gl.text.undoManager.undoHistory[unique].length
-      return
-    latestUndo = gl.text.undoManager.undoHistory[unique].pop()
-    gl.text.undoManager.history[unique].push(latestUndo)
-    $thisTextarea.val(latestUndo.newVal)
+    @insertText(textArea, text, tag, selected, wrap)
 
-  gl.text.addListeners = () ->
+  gl.text.addListeners = ->
     self = @
     $('.js-md').on 'click', ->
       $this = $(@)
-      if $this.data('md-wrap')?
-        self.wrap(
+      self.updateText(
         $this.closest('.md-area').find('textarea'),
-          $this.data('md-tag')
-        )  
-      else if $this.data('md-prepend')?
-        self.prepend(
-          $this.closest('.md-area').find('textarea'),
-          $this.data('md-tag')
-        )
-      else
-        self.wrap(
-          $this.closest('.md-area').find('textarea'),
-          $this.data('md-tag')
-        )
-
-    gl.text._previousState = null
-
-    $(window).on 'keydown', (e) =>
-      $thisTextarea = $('textarea:focus')
-      if e.ctrlKey or e.metaKey
-        if String.fromCharCode(e.which).toLowerCase() is 'z' and !e.shiftKey
-          e.preventDefault()
-          self.undoManager.undo()
-        else if ((String.fromCharCode(e.which).toLowerCase() is 'z' and e.shiftKey) or (String.fromCharCode(e.which).toLowerCase() is 'y'))
-          e.preventDefault()
-          self.undoManager.redo()
-      else if e.which is 13 or e.which is 8 # enter key or backspace key has been pressed
-        if gl.text._previousState?
-          gl.text.undoManager.addUndo(
-            gl.text._previousState,
-            $thisTextarea.val()
+        $this.data('md-tag'),
+        not $this.data('md-prepend')
       )
-      gl.text._previousState = $thisTextarea.val()
 
-  gl.text.removeListeners = () ->
+  gl.text.removeListeners = ->
     $('.js-md').off()
 
 ) window