Ver código fonte

Added view.roots -> model.roots binding to EditingController.

Oskar Wróbel 8 anos atrás
pai
commit
617fd2693e

+ 16 - 24
packages/ckeditor5-engine/src/controller/editingcontroller.js

@@ -7,6 +7,7 @@
  * @module engine/controller/editingcontroller
  */
 
+import RootEditableElement from '../view/rooteditableelement';
 import ModelDiffer from '../model/differ';
 import ViewDocument from '../view/document';
 import Mapper from '../conversion/mapper';
@@ -31,6 +32,8 @@ import mix from '@ckeditor/ckeditor5-utils/src/mix';
  * including selection handling. It also creates {@link ~EditingController#view view document} which build a
  * browser-independent virtualization over the DOM elements. Editing controller also attach default converters.
  *
+ * Editing controller binds {@link model:engine/}
+ *
  * @mixes module:utils/observablemixin~ObservableMixin
  */
 export default class EditingController {
@@ -141,33 +144,22 @@ export default class EditingController {
 		this.modelToView.on( 'selection', clearFakeSelection(), { priority: 'low' } );
 		this.modelToView.on( 'selection', convertRangeSelection(), { priority: 'low' } );
 		this.modelToView.on( 'selection', convertCollapsedSelection(), { priority: 'low' } );
-	}
 
-	/**
-	 * {@link module:engine/view/document~Document#createRoot Creates} a view root
-	 * and {@link module:engine/conversion/mapper~Mapper#bindElements binds}
-	 * the model root with view root and and view root with DOM element:
-	 *
-	 *		editing.createRoot( document.querySelector( div#editor ) );
-	 *
-	 * If the DOM element is not available at the time you want to create a view root, for instance it is iframe body
-	 * element, it is possible to create view element and bind the DOM element later:
-	 *
-	 *		editing.createRoot( 'body' );
-	 *		editing.view.attachDomRoot( iframe.contentDocument.body );
-	 *
-	 * @param {Element|String} domRoot DOM root element or the name of view root element if the DOM element will be
-	 * attached later.
-	 * @param {String} [name='main'] Root name.
-	 * @returns {module:engine/view/containerelement~ContainerElement} View root element.
-	 */
-	createRoot( domRoot, name = 'main' ) {
-		const viewRoot = this.view.createRoot( domRoot, name );
-		const modelRoot = this.model.document.getRoot( name );
+		// Bind model and view roots.
+		this.view.roots.bindTo( this.model.document.roots ).using( root => {
+			// $graveyard is a special root that has no reflection in the view.
+			if ( root.rootName == '$graveyard' ) {
+				return null;
+			}
 
-		this.mapper.bindElements( modelRoot, viewRoot );
+			const viewRoot = new RootEditableElement( root.name );
 
-		return viewRoot;
+			viewRoot.rootName = root.rootName;
+			viewRoot.document = this;
+			this.mapper.bindElements( root, viewRoot );
+
+			return viewRoot;
+		} );
 	}
 
 	/**

+ 10 - 64
packages/ckeditor5-engine/tests/controller/editingcontroller.js

@@ -20,8 +20,6 @@ import ModelPosition from '../../src/model/position';
 import ModelRange from '../../src/model/range';
 import ModelDocumentFragment from '../../src/model/documentfragment';
 
-import createElement from '@ckeditor/ckeditor5-utils/src/dom/createelement';
-
 import { parse, getData as getModelData } from '../../src/dev-utils/model';
 import { getData as getViewData } from '../../src/dev-utils/view';
 
@@ -55,71 +53,17 @@ describe( 'EditingController', () => {
 
 			sinon.assert.calledOnce( spy );
 		} );
-	} );
-
-	describe( 'createRoot()', () => {
-		let model, modelRoot, editing;
-
-		beforeEach( () => {
-			model = new Model();
-			modelRoot = model.document.createRoot();
-			model.document.createRoot( '$root', 'header' );
-
-			editing = new EditingController( model );
-		} );
-
-		afterEach( () => {
-			editing.destroy();
-			model.markers.destroy();
-		} );
-
-		it( 'should create root', () => {
-			const domRoot = createElement( document, 'div', null, createElement( document, 'p' ) );
-
-			const viewRoot = editing.createRoot( domRoot );
-
-			expect( viewRoot ).to.equal( editing.view.getRoot() );
-			expect( domRoot ).to.equal( editing.view.getDomRoot() );
-
-			expect( editing.view.domConverter.mapViewToDom( viewRoot ) ).to.equal( domRoot );
-			expect( editing.view.renderer.markedChildren.has( viewRoot ) ).to.be.true;
-
-			expect( editing.mapper.toModelElement( viewRoot ) ).to.equal( modelRoot );
-			expect( editing.mapper.toViewElement( modelRoot ) ).to.equal( viewRoot );
-		} );
-
-		it( 'should create root with given name', () => {
-			const domRoot = createElement( document, 'div', null, createElement( document, 'p' ) );
-
-			const viewRoot = editing.createRoot( domRoot, 'header' );
-
-			expect( viewRoot ).to.equal( editing.view.getRoot( 'header' ) );
-			expect( domRoot ).to.equal( editing.view.getDomRoot( 'header' ) );
-
-			expect( editing.view.domConverter.mapViewToDom( viewRoot ) ).to.equal( domRoot );
-			expect( editing.view.renderer.markedChildren.has( viewRoot ) ).to.be.true;
-
-			expect( editing.mapper.toModelElement( viewRoot ) ).to.equal( model.document.getRoot( 'header' ) );
-			expect( editing.mapper.toViewElement( model.document.getRoot( 'header' ) ) ).to.equal( viewRoot );
-		} );
-
-		it( 'should be possible to attach DOM element later', () => {
-			const domRoot = createElement( document, 'div', null, createElement( document, 'p' ) );
-
-			const viewRoot = editing.createRoot( 'div' );
 
-			expect( viewRoot ).to.equal( editing.view.getRoot() );
-			expect( editing.view.getDomRoot() ).to.be.undefined;
+		it( 'should bind view roots to model roots', () => {
+			expect( model.document.roots ).to.length( 1 ); // $graveyard
+			expect( editing.view.roots ).to.length( 0 );
 
-			editing.view.attachDomRoot( domRoot );
-
-			expect( domRoot ).to.equal( editing.view.getDomRoot() );
+			const modelRoot = model.document.createRoot();
 
-			expect( editing.view.domConverter.mapViewToDom( viewRoot ) ).to.equal( domRoot );
-			expect( editing.view.renderer.markedChildren.has( viewRoot ) ).to.be.true;
+			expect( model.document.roots ).to.length( 2 );
+			expect( editing.view.roots ).to.length( 1 );
 
-			expect( editing.mapper.toModelElement( viewRoot ) ).to.equal( modelRoot );
-			expect( editing.mapper.toViewElement( modelRoot ) ).to.equal( viewRoot );
+			expect( editing.view.getRoot().name ).to.equal( modelRoot.name ).to.equal( '$root' );
 		} );
 	} );
 
@@ -138,7 +82,9 @@ describe( 'EditingController', () => {
 			domRoot.contentEditable = true;
 
 			document.body.appendChild( domRoot );
-			viewRoot = editing.createRoot( domRoot );
+
+			viewRoot = editing.view.getRoot();
+			editing.view.attachDomRoot( domRoot );
 
 			model.schema.register( 'paragraph', { inheritAllFrom: '$block' } );
 			model.schema.register( 'div', { inheritAllFrom: '$block' } );