mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-22 18:31:57 +03:00
0d08c639fe
refs https://github.com/TryGhost/Ghost/issues/10049 - update `{{koenig-card}}` component to compare payload values and create a snapshot when exiting edit mode for container cards (markdown, html, code) - update image card to trigger snapshots on image upload/selection and width change
97 lines
3.6 KiB
Handlebars
97 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
|
|
payload=payload
|
|
isSelected=isSelected
|
|
isEditing=isEditing
|
|
onEnterEdit=(action "enterEditMode")
|
|
onLeaveEdit=(action "leaveEditMode")
|
|
selectCard=(action selectCard)
|
|
deselectCard=(action deselectCard)
|
|
editCard=(action editCard)
|
|
saveCard=(action saveCard)
|
|
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}} |