mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-23 19:02:29 +03:00
e659dcdec7
refs https://github.com/TryGhost/Ghost/issues/9724 - add an overlay to the markdown card for 500ms when entering edit mode to stop extra clicks accidentally triggering toolbar buttons
95 lines
3.6 KiB
Handlebars
95 lines
3.6 KiB
Handlebars
{{#koenig-card
|
|
icon="koenig/card-indicator-markdown"
|
|
class=(concat (kg-style "container-card") " koenig-card-markdown-rendered")
|
|
headerOffset=headerOffset
|
|
toolbar=toolbar
|
|
isSelected=isSelected
|
|
isEditing=isEditing
|
|
onEnterEdit=(action "enterEditMode")
|
|
onLeaveEdit=(action "leaveEditMode")
|
|
selectCard=(action selectCard)
|
|
deselectCard=(action deselectCard)
|
|
editCard=(action editCard)
|
|
editor=editor
|
|
}}
|
|
{{#if isEditing}}
|
|
{{#gh-editor as |editor|}}
|
|
{{gh-scroll-trigger
|
|
triggerOffset=(hash bottom=bottomOffset)
|
|
enter=(action "topEntered")
|
|
exit=(action "topExited")
|
|
registerElement=(action "registerTop")
|
|
}}
|
|
|
|
{{#gh-markdown-editor
|
|
markdown=(readonly payload.markdown)
|
|
onChange=(action "updateMarkdown")
|
|
autofocus=true
|
|
enableSideBySide=false
|
|
enablePreview=false
|
|
enableHemingway=false
|
|
options=(hash status=false)
|
|
uploadedImageUrls=editor.uploadedImageUrls
|
|
onImageFilesSelected=(action editor.uploadImages)
|
|
imageMimeTypes=editor.imageMimeTypes
|
|
as |markdown|
|
|
}}
|
|
{{markdown.editor}}
|
|
{{/gh-markdown-editor}}
|
|
|
|
{{gh-scroll-trigger
|
|
enter=(action "bottomEntered")
|
|
exit=(action "bottomExited")
|
|
registerElement=(action "registerBottom")
|
|
}}
|
|
|
|
{{!-- files are dragged over editor pane --}}
|
|
{{#if editor.isDraggedOver}}
|
|
<div class="drop-target gh-editor-drop-target">
|
|
<div class="drop-target-message">
|
|
<h3>Drop image(s) here to upload</h3>
|
|
</div>
|
|
</div>
|
|
{{/if}}
|
|
|
|
{{!-- files have been dropped ready to be uploaded --}}
|
|
{{#if editor.droppedFiles}}
|
|
{{#gh-uploader
|
|
files=editor.droppedFiles
|
|
accept=editor.imageMimeTypes
|
|
extensions=editor.imageExtensions
|
|
onComplete=(action editor.uploadComplete)
|
|
onCancel=(action editor.uploadCancelled)
|
|
as |upload|
|
|
}}
|
|
<div class="gh-editor-image-upload {{if upload.errors "-error"}}">
|
|
<div class="gh-editor-image-upload-content">
|
|
{{#if upload.errors}}
|
|
<h3>Upload failed</h3>
|
|
|
|
{{#each upload.errors as |error|}}
|
|
<div class="failed">{{error.fileName}} - {{error.message}}</div>
|
|
{{/each}}
|
|
|
|
<button class="gh-btn gh-btn-grey gh-btn-icon" {{action upload.cancel}}>
|
|
<span>{{svg-jar "close"}} Close</span>
|
|
</button>
|
|
{{else}}
|
|
|
|
<h3>Uploading {{pluralize upload.files.length "image"}}...</h3>
|
|
{{upload.progressBar}}
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
{{/gh-uploader}}
|
|
{{/if}}
|
|
{{/gh-editor}}
|
|
|
|
{{#if preventClick}}
|
|
<div class="absolute absolute--fill z-max"></div>
|
|
{{/if}}
|
|
{{else}}
|
|
{{renderedMarkdown}}
|
|
<div class="absolute absolute--fill z-999"></div>
|
|
{{/if}}
|
|
{{/koenig-card}} |