Initial markdown ez buttons

4 files changed, 93 insertions, 0 deletions

diff --git a/app/assets/javascripts/lib/text_utility.js.coffee b/app/assets/javascripts/lib/text_utility.js.coffee
new file mode 100644
index 00000000000..830b5d6ec49
--- /dev/null
+++ b/app/assets/javascripts/lib/text_utility.js.coffee
@@ -0,0 +1,74 @@
+((w) -> 
+  w.gl ?= {}
+  w.gl.text ?= {}
+  w.gl.text.undoManager ?= {}
+
+  gl.text.replaceRange = (s, start, end, substitute) ->
+    s.substring(0, start) + substitute + s.substring(end);
+
+  gl.text.wrap = (textArea, tag) ->
+    $textArea = $(textArea)
+    $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.prepend = (textArea, tag) ->
+    $textArea = $(textArea)
+    $textArea.focus()
+    textArea = $textArea.get(0)
+    selObj = window.getSelection()
+    selRange = selObj.getRangeAt(0)
+    text = $textArea.val()
+    lineBreak = '\n' if textArea.selectionStart > 0
+    console.log(textArea.selectionStart,lineBreak)
+    replaceWith = @replaceRange(
+      text,
+      textArea.selectionStart,
+      textArea.selectionEnd,
+      ("#{lineBreak}#{tag} #{selObj.toString()} \n")
+    )
+    $textArea.data('old-val', text).val(replaceWith);
+    # $textArea.val(replaceWith)
+
+  gl.text.undoManager.undo = () ->
+    
+
+  gl.text.addListeners = () ->
+    self = @
+    $('.js-md').on 'click', ->
+      $this = $(@)
+      if $this.data('md-wrap')?
+        self.wrap(
+          $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')
+        )
+
+    $(window).on 'keydown', (e) ->
+      if e.ctrlKey or e.metaKey
+        if String.fromCharCode(e.which).toLowerCase() is 'z' and !e.shiftKey
+          e.preventDefault()
+        else if ((String.fromCharCode(e.which).toLowerCase() is 'z' and e.shiftKey) or (String.fromCharCode(e.which).toLowerCase() is 'y'))
+          e.preventDefault()
+
+  gl.text.removeListeners = () ->
+    $('js-md.btn-bold').off()
+
+) window
\ No newline at end of file
diff --git a/app/assets/stylesheets/pages/note_form.scss b/app/assets/stylesheets/pages/note_form.scss
index 577dddae741..245c07bf106 100644
--- a/app/assets/stylesheets/pages/note_form.scss
+++ b/app/assets/stylesheets/pages/note_form.scss
@@ -179,6 +179,10 @@
   border-top: 1px solid $border-color;
 }
 
+.md-helper {
+  padding-top: 10px;
+}
+
 .toolbar-button {
   padding: 0;
   background: none;
diff --git a/app/views/projects/merge_requests/_discussion.html.haml b/app/views/projects/merge_requests/_discussion.html.haml
index 393998f15b9..6b9185c4a07 100644
--- a/app/views/projects/merge_requests/_discussion.html.haml
+++ b/app/views/projects/merge_requests/_discussion.html.haml
@@ -6,3 +6,9 @@
       = link_to 'Reopen merge request', merge_request_path(@merge_request, merge_request: {state_event: :reopen }), method: :put, class: "btn btn-nr btn-comment btn-grouped btn-reopen reopen-mr-link js-note-target-reopen", title: "Reopen merge request", data: {original_text: "Reopen merge request", alternative_text: "Comment & reopen merge request"}
 
 #notes= render "projects/notes/notes_with_form"
+
+:javascript
+  $(function(){
+    gl.text.removeListeners();
+    gl.text.addListeners();
+  })
diff --git a/app/views/projects/notes/_hints.html.haml b/app/views/projects/notes/_hints.html.haml
index 0b002043408..f26866468ce 100644
--- a/app/views/projects/notes/_hints.html.haml
+++ b/app/views/projects/notes/_hints.html.haml
@@ -6,3 +6,12 @@
   %button.toolbar-button.markdown-selector{ type: 'button', tabindex: '-1' }
     = icon('file-image-o', class: 'toolbar-button-icon')
     Attach a file
+.md-helper
+  %a.btn.btn-xs.js-md{ 'data-md-tag' => '**' }
+    =icon('bold fw')
+  %a.btn.btn-xs.js-md{ 'data-md-tag' => '*' }
+    =icon('italic fw')
+  %a.btn.btn-xs.js-md.js-list{ 'data-md-tag' => '*', 'data-md-prepend' => true }
+    =icon('list-ul fw')
+  %a.btn.btn-xs.js-md.js-list{ 'data-md-tag' => '1.', 'data-md-prepend' => true }
+    =icon('list-ol fw')
\ No newline at end of file