2018-02-22 23:41:40 +03:00
|
|
|
{{#koenig-card
|
|
|
|
tagName="figure"
|
2018-04-20 17:43:20 +03:00
|
|
|
class=(concat (kg-style "media-card") " flex flex-column")
|
2018-02-22 23:41:40 +03:00
|
|
|
isSelected=isSelected
|
|
|
|
isEditing=isEditing
|
|
|
|
selectCard=(action selectCard)
|
2018-05-23 13:38:30 +03:00
|
|
|
deselectCard=(action deselectCard)
|
2018-02-22 23:41:40 +03:00
|
|
|
editCard=(action editCard)
|
|
|
|
toolbar=toolbar
|
|
|
|
hasEditMode=false
|
2018-06-12 20:08:27 +03:00
|
|
|
addParagraphAfterCard=addParagraphAfterCard
|
|
|
|
moveCursorToPrevSection=moveCursorToPrevSection
|
|
|
|
moveCursorToNextSection=moveCursorToNextSection
|
2018-06-14 14:21:22 +03:00
|
|
|
editor=editor
|
2018-06-12 20:08:27 +03:00
|
|
|
as |card|
|
2018-02-22 23:41:40 +03:00
|
|
|
}}
|
|
|
|
{{#gh-uploader
|
2018-05-29 17:23:50 +03:00
|
|
|
files=files
|
2018-02-22 23:41:40 +03:00
|
|
|
accept=imageMimeTypes
|
|
|
|
extensions=imageExtensions
|
|
|
|
onStart=(action "setPreviewSrc")
|
|
|
|
onComplete=(action "updateSrc")
|
|
|
|
onFailed=(action "resetSrcs")
|
|
|
|
as |uploader|
|
|
|
|
}}
|
2018-06-11 14:28:37 +03:00
|
|
|
<div class="relative bg-whitegrey-l2">
|
2018-02-22 23:41:40 +03:00
|
|
|
{{#if (or previewSrc payload.src)}}
|
2018-05-08 12:26:46 +03:00
|
|
|
<img src={{or previewSrc payload.src}} class="{{kg-style kgImgStyle sidebar=ui.hasSideNav}}" alt={{payload.alt}}>
|
2018-02-22 23:41:40 +03:00
|
|
|
{{/if}}
|
|
|
|
|
|
|
|
{{#if (or uploader.errors uploader.isUploading (not payload.src))}}
|
|
|
|
<div class="relative miw-100 flex items-center {{if (not previewSrc payload.src) "kg-media-placeholder ba b--whitegrey" "absolute absolute--fill bg-white-50"}}">
|
|
|
|
{{#if uploader.errors}}
|
|
|
|
<span class="db absolute top-0 right-0 left-0 pl2 pr2 bg-red white sans-serif f7">
|
|
|
|
{{uploader.errors.firstObject.message}}
|
|
|
|
</span>
|
|
|
|
{{/if}}
|
|
|
|
|
|
|
|
{{#if uploader.isUploading}}
|
|
|
|
{{uploader.progressBar}}
|
|
|
|
{{else if (not previewSrc payload.src)}}
|
2018-06-11 14:28:37 +03:00
|
|
|
<button class="flex flex-column items-center center btn-base sans-serif fw4 f7 middarkgrey" onclick={{action "triggerFileDialog"}}>
|
|
|
|
{{svg-jar "summer" class="nudge-right--10"}}
|
|
|
|
<span class="mt2 midgrey">Click to select an image</span>
|
2018-02-22 23:41:40 +03:00
|
|
|
</button>
|
|
|
|
{{/if}}
|
|
|
|
</div>
|
|
|
|
{{/if}}
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div style="display:none">
|
|
|
|
{{gh-file-input multiple=false action=uploader.setFiles accept=imageMimeTypes}}
|
|
|
|
</div>
|
|
|
|
{{/gh-uploader}}
|
|
|
|
|
|
|
|
{{#if (or isSelected payload.caption)}}
|
2018-06-12 20:08:27 +03:00
|
|
|
{{card.captionInput
|
|
|
|
caption=payload.caption
|
|
|
|
update=(action "updateCaption")
|
|
|
|
placeholder="Type caption for image (optional)"
|
|
|
|
}}
|
2018-02-22 23:41:40 +03:00
|
|
|
{{/if}}
|
2018-06-06 15:32:41 +03:00
|
|
|
{{/koenig-card}}
|