Merge pull request #65 from ckeditor/t/ckeditor5/488

Other: Align feature class naming to a new scheme.

src/bold.js

@@ -8,14 +8,14 @@
  */
 
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
-import BoldEngine from './boldengine';
-import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
-import boldIcon from '../theme/icons/bold.svg';
+import BoldEditing from './bold/boldediting';
+import BoldUI from './bold/boldui';
 
 /**
- * The bold feature. It introduces the Bold button and the <kbd>Ctrl+B</kbd> keystroke.
+ * The bold feature.
  *
- * It uses the {@link module:basic-styles/boldengine~BoldEngine bold engine feature}.
+ * It loads the {@link module:basic-styles/bold/boldediting~BoldEditing bold editing feature}
+ * and {@link module:basic-styles/bold/boldui~BoldUI bold UI feature}.
  *
  * @extends module:core/plugin~Plugin
  */
@@ -24,7 +24,7 @@ export default class Bold extends Plugin {
 	 * @inheritDoc
 	 */
 	static get requires() {
-		return [ BoldEngine ];
+		return [ BoldEditing, BoldUI ];
 	}
 
 	/**
@@ -33,36 +33,4 @@ export default class Bold extends Plugin {
 	static get pluginName() {
 		return 'Bold';
 	}
-
-	/**
-	 * @inheritDoc
-	 */
-	init() {
-		const editor = this.editor;
-		const t = editor.t;
-		const command = editor.commands.get( 'bold' );
-		const keystroke = 'CTRL+B';
-
-		// Add bold button to feature components.
-		editor.ui.componentFactory.add( 'bold', locale => {
-			const view = new ButtonView( locale );
-
-			view.set( {
-				label: t( 'Bold' ),
-				icon: boldIcon,
-				keystroke,
-				tooltip: true
-			} );
-
-			view.bind( 'isOn', 'isEnabled' ).to( command, 'value', 'isEnabled' );
-
-			// Execute command.
-			this.listenTo( view, 'execute', () => editor.execute( 'bold' ) );
-
-			return view;
-		} );
-
-		// Set the Ctrl+B keystroke.
-		editor.keystrokes.set( keystroke, 'bold' );
-	}
 }

src/boldengine.js → src/bold/boldediting.js

@@ -4,29 +4,28 @@
  */
 
 /**
- * @module basic-styles/boldengine
+ * @module basic-styles/bold/boldediting
  */
 
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
-import AttributeCommand from './attributecommand';
+import AttributeCommand from '../attributecommand';
 
 const BOLD = 'bold';
 
 /**
- * The bold engine feature.
+ * The bold editing feature.
  *
  * It registers the `bold` command and introduces the `bold` attribute in the model which renders to the view
  * as a `<strong>` element.
  *
  * @extends module:core/plugin~Plugin
  */
-export default class BoldEngine extends Plugin {
+export default class BoldEditing extends Plugin {
 	/**
 	 * @inheritDoc
 	 */
 	init() {
 		const editor = this.editor;
-
 		// Allow bold attribute on text nodes.
 		editor.model.schema.extend( '$text', { allowAttributes: BOLD } );
 
@@ -47,5 +46,8 @@ export default class BoldEngine extends Plugin {
 
 		// Create bold command.
 		editor.commands.add( BOLD, new AttributeCommand( editor, BOLD ) );
+
+		// Set the Ctrl+B keystroke.
+		editor.keystrokes.set( 'CTRL+B', BOLD );
 	}
 }

src/bold/boldui.js

@@ -0,0 +1,50 @@
+/**
+ * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/**
+ * @module basic-styles/bold/boldui
+ */
+
+import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
+import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
+
+import boldIcon from '../../theme/icons/bold.svg';
+
+const BOLD = 'bold';
+
+/**
+ * The bold UI feature. It introduces the Bold button.
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class BoldUI extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	init() {
+		const editor = this.editor;
+		const t = editor.t;
+
+		// Add bold button to feature components.
+		editor.ui.componentFactory.add( BOLD, locale => {
+			const command = editor.commands.get( BOLD );
+			const view = new ButtonView( locale );
+
+			view.set( {
+				label: t( 'Bold' ),
+				icon: boldIcon,
+				keystroke: 'CTRL+B',
+				tooltip: true
+			} );
+
+			view.bind( 'isOn', 'isEnabled' ).to( command, 'value', 'isEnabled' );
+
+			// Execute command.
+			this.listenTo( view, 'execute', () => editor.execute( BOLD ) );
+
+			return view;
+		} );
+	}
+}

src/code.js

@@ -8,16 +8,16 @@
  */
 
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
-import CodeEngine from './codeengine';
-import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
-import codeIcon from '../theme/icons/code.svg';
+import CodeEditing from './code/codeediting';
+import CodeUI from './code/codeui';
 
 import '../theme/code.css';
 
 /**
- * The code feature. It introduces the Code button.
+ * The code feature.
  *
- * It uses the {@link module:basic-styles/codeengine~CodeEngine code engine feature}.
+ * It loads the {@link module:basic-styles/code/codeediting~CodeEditing code editing feature}
+ * and {@link module:basic-styles/code/codeui~CodeUI code UI feature}.
  *
  * @extends module:core/plugin~Plugin
  */
@@ -26,7 +26,7 @@ export default class Code extends Plugin {
 	 * @inheritDoc
 	 */
 	static get requires() {
-		return [ CodeEngine ];
+		return [ CodeEditing, CodeUI ];
 	}
 
 	/**
@@ -35,31 +35,4 @@ export default class Code extends Plugin {
 	static get pluginName() {
 		return 'Code';
 	}
-
-	/**
-	 * @inheritDoc
-	 */
-	init() {
-		const editor = this.editor;
-		const t = editor.t;
-		const command = editor.commands.get( 'code' );
-
-		// Add code button to feature components.
-		editor.ui.componentFactory.add( 'code', locale => {
-			const view = new ButtonView( locale );
-
-			view.set( {
-				label: t( 'Code' ),
-				icon: codeIcon,
-				tooltip: true
-			} );
-
-			view.bind( 'isOn', 'isEnabled' ).to( command, 'value', 'isEnabled' );
-
-			// Execute command.
-			this.listenTo( view, 'execute', () => editor.execute( 'code' ) );
-
-			return view;
-		} );
-	}
 }

src/codeengine.js → src/code/codeediting.js

@@ -4,23 +4,23 @@
  */
 
 /**
- * @module basic-styles/codeengine
+ * @module basic-styles/code/codeediting
  */
 
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
-import AttributeCommand from './attributecommand';
+import AttributeCommand from '../attributecommand';
 
 const CODE = 'code';
 
 /**
- * The code engine feature.
+ * The code editing feature.
  *
  * It registers the `code` command and introduces the `code` attribute in the model which renders to the view
  * as a `<code>` element.
  *
  * @extends module:core/plugin~Plugin
  */
-export default class CodeEngine extends Plugin {
+export default class CodeEditing extends Plugin {
 	/**
 	 * @inheritDoc
 	 */

src/code/codeui.js

@@ -0,0 +1,51 @@
+/**
+ * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/**
+ * @module basic-styles/code/codeui
+ */
+
+import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
+import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
+
+import codeIcon from '../../theme/icons/code.svg';
+
+import '../../theme/code.css';
+
+const CODE = 'code';
+
+/**
+ * The code UI feature. It introduces the Code button.
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class CodeUI extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	init() {
+		const editor = this.editor;
+		const t = editor.t;
+
+		// Add code button to feature components.
+		editor.ui.componentFactory.add( CODE, locale => {
+			const command = editor.commands.get( CODE );
+			const view = new ButtonView( locale );
+
+			view.set( {
+				label: t( 'Code' ),
+				icon: codeIcon,
+				tooltip: true
+			} );
+
+			view.bind( 'isOn', 'isEnabled' ).to( command, 'value', 'isEnabled' );
+
+			// Execute command.
+			this.listenTo( view, 'execute', () => editor.execute( CODE ) );
+
+			return view;
+		} );
+	}
+}

src/italic.js

@@ -8,14 +8,14 @@
  */
 
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
-import ItalicEngine from './italicengine';
-import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
-import italicIcon from '../theme/icons/italic.svg';
+import ItalicEditing from './italic/italicediting';
+import ItalicUI from './italic/italicui';
 
 /**
- * The italic feature. It introduces the Italic button and the <kbd>Ctrl+I</kbd> keystroke.
+ * The italic feature.
  *
- * It uses the {@link module:basic-styles/italicengine~ItalicEngine italic engine feature}.
+ * It loads the {@link module:basic-styles/italic/italicediting~ItalicEditing} and
+ * {@link module:basic-styles/italic/italicui~ItalicUI} plugins.
  *
  * @extends module:core/plugin~Plugin
  */
@@ -24,7 +24,7 @@ export default class Italic extends Plugin {
 	 * @inheritDoc
 	 */
 	static get requires() {
-		return [ ItalicEngine ];
+		return [ ItalicEditing, ItalicUI ];
 	}
 
 	/**
@@ -33,36 +33,4 @@ export default class Italic extends Plugin {
 	static get pluginName() {
 		return 'Italic';
 	}
-
-	/**
-	 * @inheritDoc
-	 */
-	init() {
-		const editor = this.editor;
-		const t = editor.t;
-		const command = editor.commands.get( 'italic' );
-		const keystroke = 'CTRL+I';
-
-		// Add bold button to feature components.
-		editor.ui.componentFactory.add( 'italic', locale => {
-			const view = new ButtonView( locale );
-
-			view.set( {
-				label: t( 'Italic' ),
-				icon: italicIcon,
-				keystroke,
-				tooltip: true
-			} );
-
-			view.bind( 'isOn', 'isEnabled' ).to( command, 'value', 'isEnabled' );
-
-			// Execute command.
-			this.listenTo( view, 'execute', () => editor.execute( 'italic' ) );
-
-			return view;
-		} );
-
-		// Set the Ctrl+I keystroke.
-		editor.keystrokes.set( keystroke, 'italic' );
-	}
 }