|
|
@@ -63,16 +63,16 @@ export default class BalloonEditorUI 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.
|
|
|
+ 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 BalloonEditor.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.
|
|
|
- editable.name = editingRoot.rootName;
|
|
|
-
|
|
|
// Register the editable UI view in the editor. A single editor instance can aggregate multiple
|
|
|
// editable areas (roots) but the balloon editor has only one.
|
|
|
this._editableElements.set( editable.name, editableElement );
|
|
|
@@ -95,22 +95,6 @@ export default class BalloonEditorUI 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', () => {
|
|
|
- editable.enableEditingRootListeners();
|
|
|
-
|
|
|
- const placeholderText = editor.config.get( 'placeholder' ) || editor.sourceElement.getAttribute( 'placeholder' );
|
|
|
-
|
|
|
- if ( placeholderText ) {
|
|
|
- const placeholderElement = getRootPlaceholderElement( editingRoot );
|
|
|
-
|
|
|
- addPlaceholder( editingView, placeholderElement, placeholderText );
|
|
|
- }
|
|
|
- } );
|
|
|
-
|
|
|
enableToolbarKeyboardFocus( {
|
|
|
origin: editingView,
|
|
|
originFocusTracker: this.focusTracker,
|
|
|
@@ -124,6 +108,7 @@ export default class BalloonEditorUI extends EditorUI {
|
|
|
}
|
|
|
} );
|
|
|
|
|
|
+ this._initPlaceholder();
|
|
|
this.fire( 'ready' );
|
|
|
}
|
|
|
|
|
|
@@ -134,10 +119,28 @@ export default class BalloonEditorUI extends EditorUI {
|
|
|
const view = this.view;
|
|
|
const editingView = this.editor.editing.view;
|
|
|
|
|
|
- view.editable.disableEditingRootListeners();
|
|
|
editingView.detachDomRoot( view.editable.name );
|
|
|
view.destroy();
|
|
|
|
|
|
super.destroy();
|
|
|
}
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 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.getAttribute( 'placeholder' );
|
|
|
+
|
|
|
+ if ( placeholderText ) {
|
|
|
+ const placeholderElement = getRootPlaceholderElement( editingRoot );
|
|
|
+
|
|
|
+ addPlaceholder( editingView, placeholderElement, placeholderText );
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|