Ghost/ghost/admin/app/templates/editor.hbs

{{#if post}}
    {{#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=post
                    isSaving=(or autosave.isRunning saveTasks.isRunning)
                }}
            </div>
            {{#gh-scheduled-post-countdown post=post as |post countdown|}}
                <time datetime="{{post.publishedAtUTC}}" class="gh-notification gh-notification-schedule" data-test-schedule-countdown>
                    Post will be published {{countdown}}.
                </time>
            {{/gh-scheduled-post-countdown}}
            <section class="view-actions">
                {{#unless post.isNew}}
                    {{gh-publishmenu
                        post=post
                        saveTask=save
                        setSaveType=(action "setSaveType")
                        onOpen=(action "cancelAutosave")}}
                {{/unless}}

                <button type="button" class="post-settings" title="Settings" {{action "openSettingsMenu" target=ui}} 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="Begin writing your story..."
            autofocus=shouldFocusEditor
            uploadedImageUrls=editor.uploadedImageUrls
            mobiledoc=(readonly post.scratch)
            isFullScreen=editor.isFullScreen
            onChange=(action "updateScratch")
            onFullScreenToggle=(action editor.toggleFullScreen)
            onPreviewToggle=(action editor.togglePreview)
            onSplitScreenToggle=(action editor.toggleSplitScreen)
            onImageFilesSelected=(action editor.uploadImages)
            imageMimeTypes=editor.imageMimeTypes
            as |markdown|
        }}
            <div class="gh-markdown-editor-pane">
                {{gh-textarea post.titleScratch
                    class="gh-editor-title"
                    placeholder="Post Title"
                    tabindex="1"
                    autoExpand=".gh-markdown-editor-pane"
                    update=(action "updateTitleScratch")
                    focusOut=(action (perform saveTitle))
                    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">{{post.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=post 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
            post=post
            showSettingsMenu=ui.showSettingsMenu
            deletePost=(action "toggleDeletePostModal")
            updateSlug=updateSlug
            savePost=savePost
        }}
    {{/liquid-wormhole}}
{{/if}}

{{outlet}}