Move mobiledoc knowledge out of {{gh-markdown-editor}}

no issue
- pre-requisite for using `{{gh-markdown-editor}}` inside a Koenig card
- switch to passing markdown into `{{gh-markdown-editor}}`
- move markdown->mobiledoc logic into the `editor` controller
This commit is contained in:
Kevin Ansfield 2018-04-18 15:52:45 +01:00
parent 555758a372
commit a0f33bad06
4 changed files with 43 additions and 37 deletions

View File

@ -4,27 +4,11 @@ import ctrlOrCmd from 'ghost-admin/utils/ctrl-or-cmd';
import formatMarkdown from 'ghost-admin/utils/format-markdown';
import {assign} from '@ember/polyfills';
import {computed} from '@ember/object';
import {copy} from '@ember/object/internals';
import {htmlSafe} from '@ember/string';
import {isEmpty, typeOf} from '@ember/utils';
import {run} from '@ember/runloop';
import {inject as service} from '@ember/service';
const MOBILEDOC_VERSION = '0.3.1';
export const BLANK_DOC = {
version: MOBILEDOC_VERSION,
markups: [],
atoms: [],
cards: [
['card-markdown', {
cardName: 'card-markdown',
markdown: ''
}]
],
sections: [[10, 0]]
};
export default Component.extend(ShortcutsMixin, {
config: service(),
@ -41,7 +25,7 @@ export default Component.extend(ShortcutsMixin, {
autofocus: false,
imageMimeTypes: null,
isFullScreen: false,
mobiledoc: null,
markdown: null,
options: null,
placeholder: '',
showMarkdownHelp: false,
@ -49,9 +33,6 @@ export default Component.extend(ShortcutsMixin, {
shortcuts: null,
// Internal attributes
markdown: null,
// Private
_editor: null,
_editorFocused: false,
@ -187,7 +168,6 @@ export default Component.extend(ShortcutsMixin, {
// extract markdown content from single markdown card
didReceiveAttrs() {
this._super(...arguments);
let mobiledoc = this.get('mobiledoc') || copy(BLANK_DOC, true);
let uploadedImageUrls = this.get('uploadedImageUrls');
if (!isEmpty(uploadedImageUrls) && uploadedImageUrls !== this._uploadedImageUrls) {
@ -200,14 +180,10 @@ export default Component.extend(ShortcutsMixin, {
});
}
// eslint-disable-next-line ember-suave/prefer-destructuring
let markdown = mobiledoc.cards[0][1].markdown;
this.set('markdown', markdown);
// focus the editor when the markdown value changes, this is necessary
// because both the autofocus and markdown values can change without a
// re-render, eg. navigating from edit->new
if (this._editor && markdown !== this._editor.value() && this.get('autofocus')) {
if (this.get('autofocus') && this._editor && this.get('markdown') !== this._editor.value()) {
this.send('focusEditor');
}
@ -255,11 +231,9 @@ export default Component.extend(ShortcutsMixin, {
},
actions: {
// put the markdown into a new mobiledoc card, trigger external update
// trigger external update, any mobiledoc updates are handled there
updateMarkdown(markdown) {
let mobiledoc = copy(BLANK_DOC, true);
mobiledoc.cards[0][1].markdown = markdown;
this.onChange(mobiledoc);
this.onChange(markdown);
},
// store a reference to the simplemde editor so that we can handle

View File

@ -3,9 +3,11 @@ import Ember from 'ember';
import PostModel from 'ghost-admin/models/post';
import boundOneWay from 'ghost-admin/utils/bound-one-way';
import isNumber from 'ghost-admin/utils/isNumber';
import {BLANK_MARKDOWN} from 'ghost-admin/models/post';
import {alias, mapBy, reads} from '@ember/object/computed';
import {computed} from '@ember/object';
import {inject as controller} from '@ember/controller';
import {copy} from '@ember/object/internals';
import {htmlSafe} from '@ember/string';
import {isBlank} from '@ember/utils';
import {isArray as isEmberArray} from '@ember/array';
@ -122,6 +124,14 @@ export default Controller.extend({
_tagNames: mapBy('post.tags', 'name'),
markdown: computed('post.mobiledoc', function () {
if (this.get('post').isCompatibleWithMarkdownEditor()) {
let mobiledoc = this.get('post.mobiledoc');
let markdown = mobiledoc.cards[0][1].markdown;
return markdown;
}
}),
// computed.apply is a bit of an ugly hack, but necessary to watch all the
// post's attributes and more without having to be explicit and remember
// to update the watched props list every time we add a new post attr
@ -157,6 +167,14 @@ export default Controller.extend({
this.get('_timedSave').perform();
},
// TODO: Only used by the markdown editor, ensure it's removed when
// we switch to Koenig
updateMarkdown(markdown) {
let mobiledoc = copy(BLANK_MARKDOWN, true);
mobiledoc.cards[0][1].markdown = markdown;
this.send('updateScratch', mobiledoc);
},
updateTitleScratch(title) {
this.set('post.titleScratch', title);
},

View File

@ -4,19 +4,33 @@ import ValidationEngine from 'ghost-admin/mixins/validation-engine';
import attr from 'ember-data/attr';
import boundOneWay from 'ghost-admin/utils/bound-one-way';
import moment from 'moment';
import {BLANK_DOC as BLANK_MARKDOWN} from 'ghost-admin/components/gh-markdown-editor';
import {BLANK_DOC as BLANK_MOBILEDOC} from 'koenig-editor/components/koenig-editor';
import {belongsTo, hasMany} from 'ember-data/relationships';
import {compare} from '@ember/utils';
import {computed} from '@ember/object';
import {computed, observer} from '@ember/object';
import {copy} from '@ember/object/internals';
import {equal, filterBy} from '@ember/object/computed';
import {isBlank} from '@ember/utils';
import {observer} from '@ember/object';
import {inject as service} from '@ember/service';
// ember-cli-shims doesn't export these so we must get them manually
const {Comparable} = Ember;
// for our markdown-only editor we need to build a blank mobiledoc
const MOBILEDOC_VERSION = '0.3.1';
export const BLANK_MARKDOWN = {
version: MOBILEDOC_VERSION,
markups: [],
atoms: [],
cards: [
['card-markdown', {
cardName: 'card-markdown',
markdown: ''
}]
],
sections: [[10, 0]]
};
function statusCompare(postA, postB) {
let status1 = postA.get('status');
let status2 = postB.get('status');
@ -129,9 +143,9 @@ export default Model.extend(Comparable, ValidationEngine, {
let defaultValue;
if (this.get('feature.koenigEditor')) {
defaultValue = BLANK_MOBILEDOC;
defaultValue = copy(BLANK_MOBILEDOC, true);
} else {
defaultValue = BLANK_MARKDOWN;
defaultValue = copy(BLANK_MARKDOWN, true);
}
// using this.set() adds the property to the changedAttributes list

View File

@ -68,9 +68,9 @@
placeholder="Begin writing your story..."
autofocus=shouldFocusEditor
uploadedImageUrls=editor.uploadedImageUrls
mobiledoc=(readonly post.scratch)
markdown=(readonly markdown)
isFullScreen=editor.isFullScreen
onChange=(action "updateScratch")
onChange=(action "updateMarkdown")
onFullScreenToggle=(action editor.toggleFullScreen)
onPreviewToggle=(action editor.togglePreview)
onSplitScreenToggle=(action editor.toggleSplitScreen)