| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123 |
- /**
- * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
- */
- 'use strict';
- import StandardEditor from '../editor/standardeditor.js';
- import HtmlDataProcessor from '../engine/dataprocessor/htmldataprocessor.js';
- import BoxedEditorUI from '../ui/editorui/boxed/boxededitorui.js';
- import BoxedEditorUIView from '../ui/editorui/boxed/boxededitoruiview.js';
- import EditableUI from '../ui/editableui/editableui.js';
- import InlineEditableUIView from '../ui/editableui/inline/inlineeditableuiview.js';
- import Model from '../ui/model.js';
- import StickyToolbar from '../ui/bindings/stickytoolbar.js';
- import StickyToolbarView from '../ui/stickytoolbar/stickytoolbarview.js';
- import ElementReplacer from '../utils/elementreplacer.js';
- /**
- * Classic editor creator using inline editable and sticky toolbar, all
- * enclosed in a boxed UI.
- *
- * @memberOf editor-classic
- * @extends ckeditor5.editor.StandardEditor
- */
- export default class ClassicEditor extends StandardEditor {
- /**
- * Creates an instance of the classic creator.
- *
- * @param {ckeditor5.Editor} The editor instance.
- */
- constructor( element, config ) {
- super( element, config );
- this.document.createRoot();
- this.editing.createRoot( 'div' );
- this.data.processor = new HtmlDataProcessor();
- this._elementReplacer = new ElementReplacer();
- }
- /**
- * Updates the original editor element with data and destroys
- * the UI.
- *
- * @returns {Promise}
- */
- destroy() {
- this.updateEditorElement();
- this._elementReplacer.restore();
- return this.ui.destroy()
- .then( () => super.destroy() );
- }
- _createUI() {
- const editorUI = new BoxedEditorUI( this );
- const editorUIView = new BoxedEditorUIView( editorUI.viewModel, this.locale );
- editorUI.view = editorUIView;
- this.ui = editorUI;
- this._createToolbar();
- this._createEditableUI();
- this._elementReplacer.replace( this.element, this.ui.view.element );
- return Promise.resolve();
- }
- _initUI() {
- this._toolbar.addButtons( this.config.toolbar );
- return this.ui.init()
- .then( () => this.editing.view.attachDomRoot( this._editableUI.view.element ) );
- }
- static create( element, config ) {
- const editor = new ClassicEditor( element, config );
- return editor._createUI()
- .then( () => editor.initPlugins() )
- .then( () => editor._initUI() )
- .then( () => editor.loadDataFromEditorElement() )
- .then( () => editor );
- }
- /**
- * Creates editor sticky toolbar and fills it with children using the configuration.
- *
- * @protected
- */
- _createToolbar() {
- // Note: StickyToolbar and StickyToolbarView share the same model. It may change in the future.
- const toolbarModel = new Model();
- const toolbarView = new StickyToolbarView( toolbarModel, this.locale );
- const toolbar = new StickyToolbar( toolbarModel, toolbarView, this );
- this.ui.add( 'top', toolbar );
- this._toolbar = toolbar;
- }
- _createEditableUI() {
- const editable = this.editing.view.getRoot();
- const editableUI = new EditableUI( this, editable );
- const editableUIView = new InlineEditableUIView( editableUI.viewModel, this.locale );
- editableUI.view = editableUIView;
- this.ui.add( 'main', editableUI );
- this._editableUI = editableUI;
- }
- }
|