ソースを参照

Use variable instead of strings. Move upcast and downcast functions to utils.

Mateusz Samsel 6 年 前
コミット
63f2c6c257

+ 2 - 2
packages/ckeditor5-font/src/fontcolor/fontcolorcommand.js

@@ -8,12 +8,12 @@
  */
 
 import FontCommand from '../fontcommand';
-
+import { FONT_COLOR } from './utils';
 export default class FontColorCommand extends FontCommand {
 	/**
 	 * @inheritDoc
 	 */
 	constructor( editor ) {
-		super( editor, 'fontColor' );
+		super( editor, FONT_COLOR );
 	}
 }

+ 6 - 19
packages/ckeditor5-font/src/fontcolor/fontcolorediting.js

@@ -11,7 +11,7 @@ import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 
 import FontColorCommand from './fontcolorcommand';
 
-const FONT_COLOR = 'fontColor';
+import { FONT_COLOR, renderDowncastElement, renderUpcastAttribute } from './utils';
 
 export default class FontColorEditing extends Plugin {
 	/**
@@ -125,18 +125,18 @@ export default class FontColorEditing extends Plugin {
 			view: {
 				name: 'span',
 				styles: {
-					'color': /#\d+/
+					'color': /[\s\S]+/
 				}
 			},
 			model: {
-				key: 'fontColor',
-				value: _renderUpcastAttribute
+				key: FONT_COLOR,
+				value: renderUpcastAttribute
 			}
 		} );
 
 		editor.conversion.for( 'downcast' ).attributeToElement( {
-			model: 'fontColor',
-			view: _renderDowncastElement
+			model: FONT_COLOR,
+			view: renderDowncastElement
 		} );
 
 		editor.commands.add( FONT_COLOR, new FontColorCommand( editor ) );
@@ -152,16 +152,3 @@ export default class FontColorEditing extends Plugin {
 		editor.model.schema.extend( '$text', { allowAttributes: FONT_COLOR } );
 	}
 }
-
-function _renderUpcastAttribute( viewElement ) {
-	const fontColor = viewElement.getStyle( 'color' );
-	const value = fontColor;
-
-	return value;
-}
-
-function _renderDowncastElement( modelAttributeValue, viewWriter ) {
-	return viewWriter.createAttributeElement( 'span', {
-		style: 'color:' + modelAttributeValue
-	} );
-}

+ 5 - 5
packages/ckeditor5-font/src/fontcolor/fontcolorui.js

@@ -11,7 +11,7 @@ import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 
 import fontColorIcon from '../../theme/icons/font-family.svg';
 import { createDropdown } from '@ckeditor/ckeditor5-ui/src/dropdown/utils';
-import { normalizeOptions } from './utils';
+import { normalizeOptions, FONT_COLOR } from './utils';
 import ColorTableView from '../ui/colortableview';
 export default class FontColorUI extends Plugin {
 	/**
@@ -20,12 +20,12 @@ export default class FontColorUI extends Plugin {
 	init() {
 		const editor = this.editor;
 		const t = editor.t;
-		const command = editor.commands.get( 'fontColor' );
+		const command = editor.commands.get( FONT_COLOR );
 
 		const options = this._getLocalizedOptions();
 
 		// Register UI component.
-		editor.ui.componentFactory.add( 'fontColor', locale => {
+		editor.ui.componentFactory.add( FONT_COLOR, locale => {
 			const dropdownView = createDropdown( locale );
 
 			const colorTableView = new ColorTableView( locale, {
@@ -52,7 +52,7 @@ export default class FontColorUI extends Plugin {
 			dropdownView.bind( 'isEnabled' ).to( command );
 
 			dropdownView.on( 'execute', ( evt, val ) => {
-				editor.execute( 'fontColor', val );
+				editor.execute( FONT_COLOR, val );
 			} );
 
 			return dropdownView;
@@ -72,7 +72,7 @@ export default class FontColorUI extends Plugin {
 	 */
 	_getLocalizedOptions() {
 		const editor = this.editor;
-		const options = normalizeOptions( editor.config.get( 'fontColor.options' ) );
+		const options = normalizeOptions( editor.config.get( `${ FONT_COLOR }.options` ) );
 
 		return options;
 	}

+ 15 - 0
packages/ckeditor5-font/src/fontcolor/utils.js

@@ -7,12 +7,27 @@
  * @module font/fontcolor/utils
  */
 
+export const FONT_COLOR = 'fontColor';
+
 export function normalizeOptions( configuredOptions ) {
 	return configuredOptions
 		.map( getOptionDefinition )
 		.filter( option => !!option );
 }
 
+export function renderUpcastAttribute( viewElement ) {
+	const fontColor = viewElement.getStyle( 'color' );
+	const value = fontColor;
+
+	return value;
+}
+
+export function renderDowncastElement( modelAttributeValue, viewWriter ) {
+	return viewWriter.createAttributeElement( 'span', {
+		style: 'color:' + modelAttributeValue
+	} );
+}
+
 function getOptionDefinition( option ) {
 	return {
 		title: option.label,