mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-01 13:54:35 +03:00
350e3d1481
closes https://github.com/TryGhost/Ghost/issues/8859, requires https://github.com/TryGhost/Ghost/pull/8895 - adds Unsplash app to app settings - enable/disable toggle - validation and testing of Unsplash App ID - Unsplash App ID field hidden if provided via Ghost config - adds `fetchPrivate` method to `config` service to pull config that requires authentication and updates authentication routines to fetch private config - adds Unsplash buttons to editor toolbar and `{{gh-image-uploader}}` - only present when Unsplash app is enabled - opens Unsplash image selector when clicked - `{{gh-image-uploader}}` has a new `allowUnsplash` attribute to control display of the unsplash button on a per-uploader basis - adds Unsplash image selector (`{{gh-unsplash}}`) - uses new `unsplash` service to handle API requests and maintain state - search - infinite scroll - zoom image - insert image - download image - adds `{{gh-scroll-trigger}}` that will fire an event when the component is rendered into or enters the visible screen area via scrolling - updates `ui` service - adds `isFullscreen` property and updates `gh-editor` so that it gets set/unset when toggling editor fullscreen mode - adds `hasSideNav` and `isSideNavHidden` properties - updates `media-queries` service so that it fires an event each time a breakpoint is entered/exited - removes the need for observers in certain circumstances
108 lines
2.8 KiB
JavaScript
108 lines
2.8 KiB
JavaScript
/* global SimpleMDE */
|
|
import Ember from 'ember';
|
|
import TextArea from 'ember-components/text-area';
|
|
import computed from 'ember-computed';
|
|
import {assign} from 'ember-platform';
|
|
import {isEmpty} from 'ember-utils';
|
|
|
|
// ember-cli-shims doesn't export Ember.testing
|
|
const {testing} = Ember;
|
|
|
|
export default TextArea.extend({
|
|
|
|
// Public attributes
|
|
autofocus: false,
|
|
options: null,
|
|
value: null,
|
|
placeholder: '',
|
|
|
|
// Closure actions
|
|
onChange() {},
|
|
onEditorInit() {},
|
|
onEditorDestroy() {},
|
|
|
|
// Private
|
|
_editor: null,
|
|
|
|
// default SimpleMDE options, see docs for available config:
|
|
// https://github.com/NextStepWebs/simplemde-markdown-editor#configuration
|
|
defaultOptions: computed(function () {
|
|
return {
|
|
autofocus: this.get('autofocus'),
|
|
indentWithTabs: false,
|
|
placeholder: this.get('placeholder'),
|
|
tabSize: 4
|
|
};
|
|
}),
|
|
|
|
init() {
|
|
this._super(...arguments);
|
|
|
|
if (isEmpty(this.get('options'))) {
|
|
this.set('options', {});
|
|
}
|
|
},
|
|
|
|
// instantiate the editor with the contents of value
|
|
didInsertElement() {
|
|
this._super(...arguments);
|
|
|
|
let editorOptions = assign(
|
|
{element: document.getElementById(this.elementId)},
|
|
this.get('defaultOptions'),
|
|
this.get('options')
|
|
);
|
|
|
|
// disable spellchecker when testing so that the exterally loaded plugin
|
|
// doesn't fail
|
|
if (testing) {
|
|
editorOptions.spellChecker = false;
|
|
}
|
|
|
|
this._editor = new SimpleMDE(editorOptions);
|
|
this._editor.value(this.get('value') || '');
|
|
|
|
this._editor.codemirror.on('change', () => {
|
|
this.onChange(this._editor.value());
|
|
});
|
|
|
|
this._editor.codemirror.on('focus', () => {
|
|
this.onFocus();
|
|
});
|
|
|
|
this._editor.codemirror.on('blur', () => {
|
|
this.onBlur();
|
|
});
|
|
|
|
if (this.get('autofocus')) {
|
|
this._editor.codemirror.execCommand('goDocEnd');
|
|
}
|
|
|
|
this.onEditorInit(this._editor);
|
|
},
|
|
|
|
// update the editor when the value property changes from the outside
|
|
didReceiveAttrs() {
|
|
this._super(...arguments);
|
|
|
|
if (isEmpty(this._editor)) {
|
|
return;
|
|
}
|
|
|
|
// compare values before forcing a content reset to avoid clobbering
|
|
// the undo behaviour
|
|
if (this.get('value') !== this._editor.value()) {
|
|
let cursor = this._editor.codemirror.getDoc().getCursor();
|
|
this._editor.value(this.get('value'));
|
|
this._editor.codemirror.getDoc().setCursor(cursor);
|
|
}
|
|
},
|
|
|
|
willDestroyElement() {
|
|
this.onEditorDestroy();
|
|
this._editor.toTextArea();
|
|
delete this._editor;
|
|
this._super(...arguments);
|
|
}
|
|
});
|