Moved getItemsFromConfig util to ToolbarView#fillFromConfig.

ckeditor · Feb 28, 2017 · 761eb5b · 761eb5b
1 parent a0365d9
commit 761eb5b
Show file tree

Hide file tree

Showing 6 changed files with 64 additions and 90 deletions.
diff --git a/src/toolbar/getitemsfromconfig.js b/src/toolbar/getitemsfromconfig.js
diff --git a/src/toolbar/toolbarview.js b/src/toolbar/toolbarview.js
@@ -12,6 +12,7 @@ import Template from '../template';
 import FocusTracker from '@ckeditor/ckeditor5-utils/src/focustracker';
 import FocusCycler from '../focuscycler';
 import KeystrokeHandler from '@ckeditor/ckeditor5-utils/src/keystrokehandler';
+import ToolbarSeparatorView from './toolbarseparatorview';
 
 /**
  * The toolbar view class.
@@ -105,5 +106,25 @@ export default class ToolbarView extends View {
 	focus() {
 		this._focusCycler.focusFirst();
 	}
+
+	/**
+	 * A utility which expands a plain toolbar configuration into a collection
+	 * of {@link module:ui/view~View views} using a given factory.
+	 *
+	 * @param {Array} config The toolbar config.
+	 * @param {module:ui/componentfactory~ComponentFactory} factory A factory producing toolbar items.
+	 * @returns {Promise} A promise resolved when all new toolbar items are initialized.
+	 */
+	fillFromConfig( config, factory ) {
+		if ( !config ) {
+			return Promise.resolve();
+		}
+
+		return Promise.all( config.map( name => {
+			const component = name == '|' ? new ToolbarSeparatorView() : factory.create( name );
+
+			return this.items.add( component );
+		} ) );
+	}
 }
 
diff --git a/tests/manual/contextualtoolbar/contextualtoolbar.js b/tests/manual/contextualtoolbar/contextualtoolbar.js
@@ -13,7 +13,6 @@ import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
 import Undo from '@ckeditor/ckeditor5-undo/src/undo';
 import Bold from '@ckeditor/ckeditor5-basic-styles/src/bold';
 import Italic from '@ckeditor/ckeditor5-basic-styles/src/italic';
-import getItemsFromConfig from '@ckeditor/ckeditor5-ui/src/toolbar/getitemsfromconfig';
 
 import Template from '../../../src/template';
 import ToolbarView from '../../../src/toolbar/toolbarview';
@@ -78,7 +77,7 @@ function createContextualToolbar( editor ) {
 		const editingView = editor.editing.view;
 
 		// Fill the toolbar with some buttons. Simply copy default editor toolbar.
-		getItemsFromConfig( editor.config.get( 'toolbar' ), toolbar.items, editor.ui.componentFactory );
+		toolbar.fillFromConfig( editor.config.get( 'toolbar' ), editor.ui.componentFactory );
 
 		// Let the focusTracker know about new focusable UI element.
 		editor.ui.focusTracker.add( panel.element );

diff --git a/tests/manual/imagetoolbar/imagetoolbar.js b/tests/manual/imagetoolbar/imagetoolbar.js
@@ -14,7 +14,6 @@ import Undo from '@ckeditor/ckeditor5-undo/src/undo';
 import Image from '@ckeditor/ckeditor5-image/src/image';
 import Bold from '@ckeditor/ckeditor5-basic-styles/src/bold';
 import Italic from '@ckeditor/ckeditor5-basic-styles/src/italic';
-import getItemsFromConfig from '@ckeditor/ckeditor5-ui/src/toolbar/getitemsfromconfig';
 
 import Template from '../../../src/template';
 import ToolbarView from '../../../src/toolbar/toolbarview';
@@ -80,7 +79,7 @@ function createImageToolbar( editor ) {
 		const editingView = editor.editing.view;
 
 		// Fill the toolbar with some buttons. Simply copy default editor toolbar.
-		getItemsFromConfig( editor.config.get( 'toolbar' ), toolbar.items, editor.ui.componentFactory );
+		toolbar.fillFromConfig( editor.config.get( 'toolbar' ), editor.ui.componentFactory );
 
 		// Let the focusTracker know about new focusable UI element.
 		editor.ui.focusTracker.add( panel.element );

diff --git a/tests/toolbar/getitemsfromconfig.js b/tests/toolbar/getitemsfromconfig.js
diff --git a/tests/toolbar/toolbarview.js b/tests/toolbar/toolbarview.js
@@ -6,7 +6,9 @@
 /* global document */
 
 import ToolbarView from '../../src/toolbar/toolbarview';
+import ToolbarSeparatorView from '../../src/toolbar/toolbarseparatorview';
 import KeystrokeHandler from '@ckeditor/ckeditor5-utils/src/keystrokehandler';
+import ComponentFactory from '../../src/componentfactory';
 import FocusTracker from '@ckeditor/ckeditor5-utils/src/focustracker';
 import FocusCycler from '../../src/focuscycler';
 import { keyCodes } from '@ckeditor/ckeditor5-utils/src/keyboard';
@@ -209,6 +211,34 @@ describe( 'ToolbarView', () => {
 			sinon.assert.calledOnce( spy );
 		} );
 	} );
+
+	describe( 'fillFromConfig()', () => {
+		let factory;
+
+		beforeEach( () => {
+			factory = new ComponentFactory( {} );
+
+			factory.add( 'foo', namedFactory( 'foo' ) );
+			factory.add( 'bar', namedFactory( 'bar' ) );
+		} );
+
+		it( 'returns a promise', () => {
+			expect( view.fillFromConfig() ).to.be.instanceOf( Promise );
+		} );
+
+		it( 'expands the config into collection', () => {
+			return view.fillFromConfig( [ 'foo', 'bar', '|', 'foo' ], factory )
+				.then( () => {
+					const items = view.items;
+
+					expect( items ).to.have.length( 4 );
+					expect( items.get( 0 ).name ).to.equal( 'foo' );
+					expect( items.get( 1 ).name ).to.equal( 'bar' );
+					expect( items.get( 2 ) ).to.be.instanceOf( ToolbarSeparatorView );
+					expect( items.get( 3 ).name ).to.equal( 'foo' );
+				} );
+		} );
+	} );
 } );
 
 function focusable() {
@@ -225,3 +255,14 @@ function nonFocusable() {
 
 	return view;
 }
+
+function namedFactory( name ) {
+	return ( locale ) => {
+		const view = new View( locale );
+
+		view.name = name;
+		view.element = document.createElement( 'a' );
+
+		return view;
+	};
+}