summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorJacob Schatz <jschatz@gitlab.com>2016-06-29 05:17:39 +0000
committerJacob Schatz <jschatz@gitlab.com>2016-06-29 05:17:39 +0000
commit9c2fbcb06497eef2fc53026ebb419e74d7a2be2c (patch)
treef089a4e89dd77aa9cfee7bd5369581bbd6f30f01
parent3611ee5663a25bc619b7c2201908af99dc58debf (diff)
parent4678e22b5f9ff0fd81375091e3de864784522d20 (diff)
downloadgitlab-ce-9c2fbcb06497eef2fc53026ebb419e74d7a2be2c.tar.gz
Merge branch 'md-toolbar-multiline-code' into 'master'
Markdown toolbar inserts code blocks ## What does this MR do? Adds the ability to insert code blocks with the markdown toolbar buttons. This is done by selecting the block & then clicking the code button. ## What are the relevant issue numbers? Closes #19173 See merge request !4950
-rw-r--r--app/assets/javascripts/lib/utils/text_utility.js.coffee45
-rw-r--r--app/views/projects/_md_preview.html.haml4
2 files changed, 37 insertions, 12 deletions
diff --git a/app/assets/javascripts/lib/utils/text_utility.js.coffee b/app/assets/javascripts/lib/utils/text_utility.js.coffee
index bb2772dfed2..7bcb876d056 100644
--- a/app/assets/javascripts/lib/utils/text_utility.js.coffee
+++ b/app/assets/javascripts/lib/utils/text_utility.js.coffee
@@ -10,17 +10,41 @@
gl.text.selectedText = (text, textarea) ->
text.substring(textarea.selectionStart, textarea.selectionEnd)
- gl.text.insertText = (textArea, text, tag, selected, wrap) ->
+ gl.text.lineBefore = (text, textarea) ->
+ split = text.substring(0, textarea.selectionStart).trim().split('\n')
+ split[split.length - 1]
+
+ gl.text.lineAfter = (text, textarea) ->
+ text.substring(textarea.selectionEnd).trim().split('\n')[0]
+
+ gl.text.blockTagText = (text, textArea, blockTag, selected) ->
+ lineBefore = @lineBefore(text, textArea)
+ lineAfter = @lineAfter(text, textArea)
+
+ if lineBefore is blockTag and lineAfter is blockTag
+ # To remove the block tag we have to select the line before & after
+ if blockTag?
+ textArea.selectionStart = textArea.selectionStart - (blockTag.length + 1)
+ textArea.selectionEnd = textArea.selectionEnd + (blockTag.length + 1)
+
+ selected
+ else
+ "#{blockTag}\n#{selected}\n#{blockTag}"
+
+ gl.text.insertText = (textArea, text, tag, blockTag, selected, wrap) ->
selectedSplit = selected.split('\n')
startChar = if not wrap and textArea.selectionStart > 0 then '\n' else ''
- if selectedSplit.length > 1 and not wrap
- insertText = selectedSplit.map((val) ->
- if val.indexOf(tag) is 0
- "#{val.replace(tag, '')}"
- else
- "#{tag}#{val}"
- ).join('\n')
+ if selectedSplit.length > 1 and (not wrap or blockTag?)
+ if blockTag?
+ insertText = @blockTagText(text, textArea, blockTag, selected)
+ else
+ insertText = selectedSplit.map((val) ->
+ if val.indexOf(tag) is 0
+ "#{val.replace(tag, '')}"
+ else
+ "#{tag}#{val}"
+ ).join('\n')
else
insertText = "#{startChar}#{tag}#{selected}#{if wrap then tag else ' '}"
@@ -51,7 +75,7 @@
textArea.setSelectionRange pos, pos
- gl.text.updateText = (textArea, tag, wrap) ->
+ gl.text.updateText = (textArea, tag, blockTag, wrap) ->
$textArea = $(textArea)
oldVal = $textArea.val()
textArea = $textArea.get(0)
@@ -59,7 +83,7 @@
selected = @selectedText(text, textArea)
$textArea.focus()
- @insertText(textArea, text, tag, selected, wrap)
+ @insertText(textArea, text, tag, blockTag, selected, wrap)
gl.text.init = (form) ->
self = @
@@ -70,6 +94,7 @@
self.updateText(
$this.closest('.md-area').find('textarea'),
$this.data('md-tag'),
+ $this.data('md-block'),
not $this.data('md-prepend')
)
diff --git a/app/views/projects/_md_preview.html.haml b/app/views/projects/_md_preview.html.haml
index ca6714ef42b..58d961d93ca 100644
--- a/app/views/projects/_md_preview.html.haml
+++ b/app/views/projects/_md_preview.html.haml
@@ -12,13 +12,13 @@
%li.confidential-issue-warning
= icon('warning')
%span This is a confidential issue. Your comment will not be visible to the public.
-
+
%li.pull-right
.toolbar-group
= markdown_toolbar_button({icon: "bold fw", data: { "md-tag" => "**" }, title: "Add bold text" })
= markdown_toolbar_button({icon: "italic fw", data: { "md-tag" => "*" }, title: "Add italic text" })
= markdown_toolbar_button({icon: "quote-right fw", data: { "md-tag" => "> ", "md-prepend" => true }, title: "Insert a quote" })
- = markdown_toolbar_button({icon: "code fw", data: { "md-tag" => "`" }, title: "Insert code" })
+ = markdown_toolbar_button({icon: "code fw", data: { "md-tag" => "`", "md-block" => "```" }, title: "Insert code" })
= markdown_toolbar_button({icon: "list-ul fw", data: { "md-tag" => "* ", "md-prepend" => true }, title: "Add a bullet list" })
= markdown_toolbar_button({icon: "list-ol fw", data: { "md-tag" => "1. ", "md-prepend" => true }, title: "Add a numbered list" })
= markdown_toolbar_button({icon: "check-square-o fw", data: { "md-tag" => "* [ ] ", "md-prepend" => true }, title: "Add a task list" })