Merge branch 'markdown_preview_shortcut' into 'master'
Add shortcut to toggle markdown preview Allow to toggle markdown preview with shortcut `ctrl+shift+p` (`cmd+shift+p` on OSX). - If the user is focused on a md textarea, `ctrl-shift-p` will show the preview, otherwise native browser event is fired - The textarea is re-focused after disabling the preview tab - Results of markdown render is cached for fast toggles I'm on linux, so if someone can test it on OS X, it would be great! Closes #14038 See merge request !3111
This commit is contained in:
commit
60d0a20b3a
|
@ -20,6 +20,7 @@ v 8.6.0 (unreleased)
|
||||||
- Fix bug where Bitbucket `closed` issues were imported as `opened` (Iuri de Silvio)
|
- Fix bug where Bitbucket `closed` issues were imported as `opened` (Iuri de Silvio)
|
||||||
- Don't show Issues/MRs from archived projects in Groups view
|
- Don't show Issues/MRs from archived projects in Groups view
|
||||||
- Increase the notes polling timeout over time (Roberto Dip)
|
- Increase the notes polling timeout over time (Roberto Dip)
|
||||||
|
- Add shortcut to toggle markdown preview (Florent Baldino)
|
||||||
- Show labels in dashboard and group milestone views
|
- Show labels in dashboard and group milestone views
|
||||||
- Add main language of a project in the list of projects (Tiago Botelho)
|
- Add main language of a project in the list of projects (Tiago Botelho)
|
||||||
- Add ability to show archived projects on dashboard, explore and group pages
|
- Add ability to show archived projects on dashboard, explore and group pages
|
||||||
|
|
|
@ -6,6 +6,7 @@
|
||||||
class @MarkdownPreview
|
class @MarkdownPreview
|
||||||
# Minimum number of users referenced before triggering a warning
|
# Minimum number of users referenced before triggering a warning
|
||||||
referenceThreshold: 10
|
referenceThreshold: 10
|
||||||
|
ajaxCache: {}
|
||||||
|
|
||||||
showPreview: (form) ->
|
showPreview: (form) ->
|
||||||
preview = form.find('.js-md-preview')
|
preview = form.find('.js-md-preview')
|
||||||
|
@ -24,12 +25,16 @@ class @MarkdownPreview
|
||||||
renderMarkdown: (text, success) ->
|
renderMarkdown: (text, success) ->
|
||||||
return unless window.markdown_preview_path
|
return unless window.markdown_preview_path
|
||||||
|
|
||||||
|
return success(@ajaxCache.response) if text == @ajaxCache.text
|
||||||
|
|
||||||
$.ajax
|
$.ajax
|
||||||
type: 'POST'
|
type: 'POST'
|
||||||
url: window.markdown_preview_path
|
url: window.markdown_preview_path
|
||||||
data: { text: text }
|
data: { text: text }
|
||||||
dataType: 'json'
|
dataType: 'json'
|
||||||
success: success
|
success: (response) =>
|
||||||
|
@ajaxCache = text: text, response: response
|
||||||
|
success(response)
|
||||||
|
|
||||||
hideReferencedUsers: (form) ->
|
hideReferencedUsers: (form) ->
|
||||||
referencedUsers = form.find('.referenced-users')
|
referencedUsers = form.find('.referenced-users')
|
||||||
|
@ -49,6 +54,7 @@ markdownPreview = new MarkdownPreview()
|
||||||
|
|
||||||
previewButtonSelector = '.js-md-preview-button'
|
previewButtonSelector = '.js-md-preview-button'
|
||||||
writeButtonSelector = '.js-md-write-button'
|
writeButtonSelector = '.js-md-write-button'
|
||||||
|
lastTextareaPreviewed = null
|
||||||
|
|
||||||
$.fn.setupMarkdownPreview = ->
|
$.fn.setupMarkdownPreview = ->
|
||||||
$form = $(this)
|
$form = $(this)
|
||||||
|
@ -58,10 +64,10 @@ $.fn.setupMarkdownPreview = ->
|
||||||
form_textarea.on 'input', -> markdownPreview.hideReferencedUsers($form)
|
form_textarea.on 'input', -> markdownPreview.hideReferencedUsers($form)
|
||||||
form_textarea.on 'blur', -> markdownPreview.showPreview($form)
|
form_textarea.on 'blur', -> markdownPreview.showPreview($form)
|
||||||
|
|
||||||
$(document).on 'click', previewButtonSelector, (e) ->
|
$(document).on 'markdown-preview:show', (e, $form) ->
|
||||||
e.preventDefault()
|
return unless $form
|
||||||
|
|
||||||
$form = $(this).closest('form')
|
lastTextareaPreviewed = $form.find('textarea.markdown-area')
|
||||||
|
|
||||||
# toggle tabs
|
# toggle tabs
|
||||||
$form.find(writeButtonSelector).parent().removeClass('active')
|
$form.find(writeButtonSelector).parent().removeClass('active')
|
||||||
|
@ -73,10 +79,10 @@ $(document).on 'click', previewButtonSelector, (e) ->
|
||||||
|
|
||||||
markdownPreview.showPreview($form)
|
markdownPreview.showPreview($form)
|
||||||
|
|
||||||
$(document).on 'click', writeButtonSelector, (e) ->
|
$(document).on 'markdown-preview:hide', (e, $form) ->
|
||||||
e.preventDefault()
|
return unless $form
|
||||||
|
|
||||||
$form = $(this).closest('form')
|
lastTextareaPreviewed = null
|
||||||
|
|
||||||
# toggle tabs
|
# toggle tabs
|
||||||
$form.find(writeButtonSelector).parent().addClass('active')
|
$form.find(writeButtonSelector).parent().addClass('active')
|
||||||
|
@ -84,4 +90,30 @@ $(document).on 'click', writeButtonSelector, (e) ->
|
||||||
|
|
||||||
# toggle content
|
# toggle content
|
||||||
$form.find('.md-write-holder').show()
|
$form.find('.md-write-holder').show()
|
||||||
|
$form.find('textarea.markdown-area').focus()
|
||||||
$form.find('.md-preview-holder').hide()
|
$form.find('.md-preview-holder').hide()
|
||||||
|
|
||||||
|
$(document).on 'markdown-preview:toggle', (e, keyboardEvent) ->
|
||||||
|
$target = $(keyboardEvent.target)
|
||||||
|
|
||||||
|
if $target.is('textarea.markdown-area')
|
||||||
|
$(document).triggerHandler('markdown-preview:show', [$target.closest('form')])
|
||||||
|
keyboardEvent.preventDefault()
|
||||||
|
else if lastTextareaPreviewed
|
||||||
|
$target = lastTextareaPreviewed
|
||||||
|
$(document).triggerHandler('markdown-preview:hide', [$target.closest('form')])
|
||||||
|
keyboardEvent.preventDefault()
|
||||||
|
|
||||||
|
$(document).on 'click', previewButtonSelector, (e) ->
|
||||||
|
e.preventDefault()
|
||||||
|
|
||||||
|
$form = $(this).closest('form')
|
||||||
|
|
||||||
|
$(document).triggerHandler('markdown-preview:show', [$form])
|
||||||
|
|
||||||
|
$(document).on 'click', writeButtonSelector, (e) ->
|
||||||
|
e.preventDefault()
|
||||||
|
|
||||||
|
$form = $(this).closest('form')
|
||||||
|
|
||||||
|
$(document).triggerHandler('markdown-preview:hide', [$form])
|
||||||
|
|
|
@ -4,11 +4,15 @@ class @Shortcuts
|
||||||
Mousetrap.reset()
|
Mousetrap.reset()
|
||||||
Mousetrap.bind('?', @selectiveHelp)
|
Mousetrap.bind('?', @selectiveHelp)
|
||||||
Mousetrap.bind('s', Shortcuts.focusSearch)
|
Mousetrap.bind('s', Shortcuts.focusSearch)
|
||||||
|
Mousetrap.bind(['ctrl+shift+p', 'command+shift+p'], @toggleMarkdownPreview)
|
||||||
Mousetrap.bind('t', -> Turbolinks.visit(findFileURL)) if findFileURL?
|
Mousetrap.bind('t', -> Turbolinks.visit(findFileURL)) if findFileURL?
|
||||||
|
|
||||||
selectiveHelp: (e) =>
|
selectiveHelp: (e) =>
|
||||||
Shortcuts.showHelp(e, @enabledHelp)
|
Shortcuts.showHelp(e, @enabledHelp)
|
||||||
|
|
||||||
|
toggleMarkdownPreview: (e) =>
|
||||||
|
$(document).triggerHandler('markdown-preview:toggle', [e])
|
||||||
|
|
||||||
@showHelp: (e, location) ->
|
@showHelp: (e, location) ->
|
||||||
if $('#modal-shortcuts').length > 0
|
if $('#modal-shortcuts').length > 0
|
||||||
$('#modal-shortcuts').modal('show')
|
$('#modal-shortcuts').modal('show')
|
||||||
|
@ -35,3 +39,14 @@ $(document).on 'click.more_help', '.js-more-help-button', (e) ->
|
||||||
$(@).remove()
|
$(@).remove()
|
||||||
$('.hidden-shortcut').show()
|
$('.hidden-shortcut').show()
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
|
|
||||||
|
Mousetrap.stopCallback = (->
|
||||||
|
defaultStopCallback = Mousetrap.stopCallback
|
||||||
|
|
||||||
|
return (e, element, combo) ->
|
||||||
|
# allowed shortcuts if textarea, input, contenteditable are focused
|
||||||
|
if ['ctrl+shift+p', 'command+shift+p'].indexOf(combo) != -1
|
||||||
|
return false
|
||||||
|
else
|
||||||
|
return defaultStopCallback.apply(@, arguments)
|
||||||
|
)()
|
||||||
|
|
|
@ -22,6 +22,14 @@
|
||||||
%td.shortcut
|
%td.shortcut
|
||||||
.key ?
|
.key ?
|
||||||
%td Show this dialog
|
%td Show this dialog
|
||||||
|
%tr
|
||||||
|
%td.shortcut
|
||||||
|
- if browser.mac?
|
||||||
|
.key ⌘ shift p
|
||||||
|
- else
|
||||||
|
.key ctrl shift p
|
||||||
|
|
||||||
|
%td Toggle Markdown preview
|
||||||
%tbody
|
%tbody
|
||||||
%tr
|
%tr
|
||||||
%th
|
%th
|
||||||
|
|
Loading…
Reference in New Issue