|
@@ -10,6 +10,11 @@ import BoxedEditorUI from '/tests/core/_utils/ui/boxededitorui/boxededitorui.js'
|
|
|
import BoxedEditorUIView from '/tests/core/_utils/ui/boxededitorui/boxededitoruiview.js';
|
|
import BoxedEditorUIView from '/tests/core/_utils/ui/boxededitorui/boxededitoruiview.js';
|
|
|
import FramedEditable from '/tests/core/_utils/ui/editable/framed/framededitable.js';
|
|
import FramedEditable from '/tests/core/_utils/ui/editable/framed/framededitable.js';
|
|
|
import FramedEditableView from '/tests/core/_utils/ui/editable/framed/framededitableview.js';
|
|
import FramedEditableView from '/tests/core/_utils/ui/editable/framed/framededitableview.js';
|
|
|
|
|
+import Model from '/ckeditor5/core/ui/model.js';
|
|
|
|
|
+import Toolbar from '/ckeditor5/ui/toolbar/toolbar.js';
|
|
|
|
|
+import ToolbarView from '/ckeditor5/ui/toolbar/toolbarview.js';
|
|
|
|
|
+import Button from '/ckeditor5/ui/button/button.js';
|
|
|
|
|
+import ButtonView from '/ckeditor5/ui/button/buttonview.js';
|
|
|
|
|
|
|
|
export default class ClassicCreator extends Creator {
|
|
export default class ClassicCreator extends Creator {
|
|
|
constructor( editor ) {
|
|
constructor( editor ) {
|
|
@@ -19,8 +24,11 @@ export default class ClassicCreator extends Creator {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
create() {
|
|
create() {
|
|
|
|
|
+ this._imitateFeatures();
|
|
|
|
|
+
|
|
|
this._replaceElement();
|
|
this._replaceElement();
|
|
|
this._setupEditable();
|
|
this._setupEditable();
|
|
|
|
|
+ this._setupToolbar();
|
|
|
|
|
|
|
|
return super.create()
|
|
return super.create()
|
|
|
.then( () => this.loadDataFromEditorElement() );
|
|
.then( () => this.loadDataFromEditorElement() );
|
|
@@ -39,6 +47,14 @@ export default class ClassicCreator extends Creator {
|
|
|
this.editor.ui.add( 'main', editable );
|
|
this.editor.ui.add( 'main', editable );
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+ _setupToolbar() {
|
|
|
|
|
+ const toolbar = new Toolbar( this.editor, new Model(), new ToolbarView() );
|
|
|
|
|
+
|
|
|
|
|
+ toolbar.addButtons( this.editor.config.toolbar );
|
|
|
|
|
+
|
|
|
|
|
+ this.editor.ui.collections.get( 'top' ).add( toolbar );
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
_createEditable() {
|
|
_createEditable() {
|
|
|
const editable = new FramedEditable( this.editor );
|
|
const editable = new FramedEditable( this.editor );
|
|
|
const editableView = new FramedEditableView( editable.viewModel );
|
|
const editableView = new FramedEditableView( editable.viewModel );
|
|
@@ -56,4 +72,44 @@ export default class ClassicCreator extends Creator {
|
|
|
|
|
|
|
|
return editorUI;
|
|
return editorUI;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
|
|
+ /**
|
|
|
|
|
+ * Immitates that some features were loaded and did their job.
|
|
|
|
|
+ */
|
|
|
|
|
+ _imitateFeatures() {
|
|
|
|
|
+ const editor = this.editor;
|
|
|
|
|
+
|
|
|
|
|
+ const boldModel = new Model( {
|
|
|
|
|
+ isEnabled: true,
|
|
|
|
|
+ isOn: false,
|
|
|
|
|
+ label: 'bold'
|
|
|
|
|
+ } );
|
|
|
|
|
+
|
|
|
|
|
+ boldModel.on( 'executed', () => {
|
|
|
|
|
+ /* global console */
|
|
|
|
|
+ console.log( 'bold executed' );
|
|
|
|
|
+
|
|
|
|
|
+ boldModel.isOn = !boldModel.isOn;
|
|
|
|
|
+ } );
|
|
|
|
|
+
|
|
|
|
|
+ editor.ui.featureComponents.add( 'bold', Button, ButtonView, boldModel );
|
|
|
|
|
+
|
|
|
|
|
+ const italicModel = new Model( {
|
|
|
|
|
+ isEnabled: true,
|
|
|
|
|
+ isOn: false,
|
|
|
|
|
+ label: 'italic'
|
|
|
|
|
+ } );
|
|
|
|
|
+
|
|
|
|
|
+ italicModel.on( 'executed', () => {
|
|
|
|
|
+ /* global console */
|
|
|
|
|
+ console.log( 'italic executed' );
|
|
|
|
|
+
|
|
|
|
|
+ italicModel.isOn = !italicModel.isOn;
|
|
|
|
|
+ } );
|
|
|
|
|
+
|
|
|
|
|
+ editor.ui.featureComponents.add( 'italic', Button, ButtonView, italicModel );
|
|
|
|
|
+
|
|
|
|
|
+ window.boldModel = boldModel;
|
|
|
|
|
+ window.italicModel = italicModel;
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|