|
|
@@ -64,16 +64,16 @@ export default class DecoupledEditorUI extends EditorUI {
|
|
|
const editable = view.editable;
|
|
|
const editingRoot = editingView.document.getRoot();
|
|
|
|
|
|
+ // The editable UI and editing root should share the same name. Then name is used
|
|
|
+ // to recognize the particular editable, for instance in ARIA attributes.
|
|
|
+ view.editable.name = editingRoot.rootName;
|
|
|
+
|
|
|
view.render();
|
|
|
|
|
|
// The editable UI element in DOM is available for sure only after the editor UI view has been rendered.
|
|
|
// But it can be available earlier if a DOM element has been passed to DecoupledEditor.create().
|
|
|
const editableElement = editable.element;
|
|
|
|
|
|
- // The editable UI and editing root should share the same name. Then name is used
|
|
|
- // to recognize the particular editable, for instance in ARIA attributes.
|
|
|
- view.editable.name = editingRoot.rootName;
|
|
|
-
|
|
|
// Register the editable UI view in the editor. A single editor instance can aggregate multiple
|
|
|
// editable areas (roots) but the decoupled editor has only one.
|
|
|
this._editableElements.set( editable.name, editableElement );
|
|
|
@@ -96,23 +96,7 @@ export default class DecoupledEditorUI extends EditorUI {
|
|
|
// of the editor's engine. This is where the engine meets the UI.
|
|
|
editingView.attachDomRoot( editableElement );
|
|
|
|
|
|
- // The UI must wait until the data is ready to attach certain actions that operate
|
|
|
- // on the editing view–level. They use the view writer to set attributes on the editable
|
|
|
- // element and doing so before data is loaded into the model (ready) would destroy the
|
|
|
- // original content.
|
|
|
- editor.on( 'dataReady', () => {
|
|
|
- view.editable.enableEditingRootListeners();
|
|
|
-
|
|
|
- const placeholderText = editor.config.get( 'placeholder' ) ||
|
|
|
- editor.sourceElement && editor.sourceElement.getAttribute( 'placeholder' );
|
|
|
-
|
|
|
- if ( placeholderText ) {
|
|
|
- const placeholderElement = getRootPlaceholderElement( editingRoot );
|
|
|
-
|
|
|
- addPlaceholder( editingView, placeholderElement, placeholderText );
|
|
|
- }
|
|
|
- } );
|
|
|
-
|
|
|
+ this._initPlaceholder();
|
|
|
this._initToolbar();
|
|
|
this.fire( 'ready' );
|
|
|
}
|
|
|
@@ -124,7 +108,6 @@ export default class DecoupledEditorUI extends EditorUI {
|
|
|
const view = this._view;
|
|
|
const editingView = this.editor.editing.view;
|
|
|
|
|
|
- view.editable.disableEditingRootListeners();
|
|
|
editingView.detachDomRoot( view.editable.name );
|
|
|
view.destroy();
|
|
|
|
|
|
@@ -150,4 +133,24 @@ export default class DecoupledEditorUI extends EditorUI {
|
|
|
toolbar
|
|
|
} );
|
|
|
}
|
|
|
+
|
|
|
+ /**
|
|
|
+ * Enable the placeholder text on the editing root, if any was configured.
|
|
|
+ *
|
|
|
+ * @private
|
|
|
+ */
|
|
|
+ _initPlaceholder() {
|
|
|
+ const editor = this.editor;
|
|
|
+ const editingView = editor.editing.view;
|
|
|
+ const editingRoot = editingView.document.getRoot();
|
|
|
+
|
|
|
+ const placeholderText = editor.config.get( 'placeholder' ) ||
|
|
|
+ editor.sourceElement && editor.sourceElement.getAttribute( 'placeholder' );
|
|
|
+
|
|
|
+ if ( placeholderText ) {
|
|
|
+ const placeholderElement = getRootPlaceholderElement( editingRoot );
|
|
|
+
|
|
|
+ addPlaceholder( editingView, placeholderElement, placeholderText );
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|