mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-27 12:53:13 +03:00
05a3a11855
refs https://github.com/TryGhost/Ghost/issues/5168 - adds a `tour` service that handles syncing and management of tour throbbers & content - adds a `gh-tour-item` component that handles the display of a throbber and it's associated popover when clicked - uses settings API endpoint to populate viewed tour items on app boot/signin - adds `liquid-tether@2.0.3` dependency for attaching throbbers and popups - adds initial tour contents
159 lines
5.6 KiB
Handlebars
159 lines
5.6 KiB
Handlebars
{{#gh-editor
|
|
tagName="section"
|
|
class="gh-editor gh-view"
|
|
navIsClosed=navIsClosed
|
|
as |editor|
|
|
}}
|
|
<header class="gh-editor-header {{editor.headerClass}}">
|
|
<div class="gh-editor-status">
|
|
{{gh-editor-post-status
|
|
post=model
|
|
isSaving=autosave.isRunning
|
|
}}
|
|
</div>
|
|
{{#if scheduleCountdown}}
|
|
<time datetime="{{post.publishedAtUTC}}" class="gh-notification gh-notification-schedule" data-test-schedule-countdown>
|
|
Post will be published {{scheduleCountdown}}.
|
|
</time>
|
|
{{/if}}
|
|
<section class="view-actions">
|
|
{{gh-publishmenu
|
|
post=model
|
|
saveTask=save
|
|
setSaveType=(action "setSaveType")
|
|
onOpen=(action "cancelAutosave")}}
|
|
|
|
<button type="button" class="post-settings" title="Settings" {{action "openSettingsMenu"}} data-test-psm-trigger>
|
|
{{inline-svg "settings"}}
|
|
</button>
|
|
</section>
|
|
</header>
|
|
|
|
{{!--
|
|
NOTE: title is part of the markdown editor container so that it has
|
|
access to the markdown editor's "focus" action
|
|
--}}
|
|
{{#gh-markdown-editor
|
|
tabindex="2"
|
|
placeholder="Click here to start..."
|
|
autofocus=shouldFocusEditor
|
|
uploadedImageUrls=editor.uploadedImageUrls
|
|
mobiledoc=(readonly model.scratch)
|
|
isFullScreen=editor.isFullScreen
|
|
onChange=(action "updateScratch")
|
|
onFullScreenToggle=(action editor.toggleFullScreen)
|
|
onPreviewToggle=(action editor.togglePreview)
|
|
onSplitScreenToggle=(action editor.toggleSplitScreen)
|
|
onImageFilesSelected=(action editor.uploadImages)
|
|
showMarkdownHelp=(route-action "toggleMarkdownHelpModal")
|
|
imageMimeTypes=editor.imageMimeTypes
|
|
as |markdown|
|
|
}}
|
|
<div class="gh-markdown-editor-pane">
|
|
{{gh-textarea model.titleScratch
|
|
class="gh-editor-title"
|
|
placeholder="Your Post Title"
|
|
tabindex="1"
|
|
shouldFocus=shouldFocusTitle
|
|
autoExpand=".gh-markdown-editor-pane"
|
|
focusOut=(action "saveTitle")
|
|
update=(action (perform updateTitle))
|
|
keyEvents=(hash
|
|
9=(action markdown.focus 'bottom')
|
|
13=(action markdown.focus 'top')
|
|
)
|
|
data-test-editor-title-input=true
|
|
}}
|
|
{{markdown.editor}}
|
|
</div>
|
|
|
|
{{#if markdown.isSplitScreen}}
|
|
<div class="gh-markdown-editor-preview">
|
|
<h1 class="gh-markdown-editor-preview-title">{{model.titleScratch}}</h1>
|
|
<div class="gh-markdown-editor-preview-content"></div>
|
|
</div>
|
|
{{/if}}
|
|
|
|
{{gh-tour-item "using-the-editor"
|
|
target=".gh-editor-footer"
|
|
throbberAttachment="top left"
|
|
throbberOffset="0 20%"
|
|
popoverTriangleClass="bottom"
|
|
}}
|
|
{{/gh-markdown-editor}}
|
|
|
|
{{!-- TODO: put tool/status bar in here so that scroll area can be fixed --}}
|
|
<footer class="gh-editor-footer"></footer>
|
|
|
|
{{!-- 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>{{inline-svg "close"}} Close</span>
|
|
</button>
|
|
{{else}}
|
|
|
|
<h3>Uploading {{pluralize upload.files.length "image"}}...</h3>
|
|
{{upload.progressBar}}
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
{{/gh-uploader}}
|
|
{{/if}}
|
|
{{/gh-editor}}
|
|
|
|
{{#if showDeletePostModal}}
|
|
{{gh-fullscreen-modal "delete-post"
|
|
model=(hash post=model onSuccess=(route-action 'redirectToContentScreen'))
|
|
close=(action "toggleDeletePostModal")
|
|
modifier="action wide"}}
|
|
{{/if}}
|
|
|
|
{{#if showLeaveEditorModal}}
|
|
{{gh-fullscreen-modal "leave-editor"
|
|
confirm=(action "leaveEditor")
|
|
close=(action "toggleLeaveEditorModal")
|
|
modifier="action wide"}}
|
|
{{/if}}
|
|
|
|
{{#if showReAuthenticateModal}}
|
|
{{gh-fullscreen-modal "re-authenticate"
|
|
close=(action "toggleReAuthenticateModal")
|
|
modifier="action wide"}}
|
|
{{/if}}
|
|
|
|
{{#liquid-wormhole}}
|
|
{{gh-post-settings-menu
|
|
model=model
|
|
showSettingsMenu=application.showSettingsMenu
|
|
closeNavMenu=(action "closeNavMenu")
|
|
closeMenus=(action "closeMenus")
|
|
deletePost=(action "toggleDeletePostModal")
|
|
}}
|
|
{{/liquid-wormhole}}
|