diff --git a/src/conversion/conversion.js b/src/conversion/conversion.js index f98d20e56..d69307546 100644 --- a/src/conversion/conversion.js +++ b/src/conversion/conversion.js @@ -224,6 +224,30 @@ export default class Conversion { * } * } ); * + * // Use `config.model.name` to define conversion only from given node type, `$text` in this case. + * // The same attribute on different elements may be then handled by a different converter. + * conversion.attributeToElement( { + * model: { + * key: 'textDecoration', + * values: [ 'underline', 'lineThrough' ], + * name: '$text' + * }, + * view: { + * underline: { + * name: 'span', + * style: { + * 'text-decoration': 'underline' + * } + * }, + * lineThrough: { + * name: 'span', + * style: { + * 'text-decoration': 'line-through' + * } + * } + * } + * } ); + * * // Use `upcastAlso` to define other view elements that should be also converted to `bold` attribute. * conversion.attributeToElement( { * model: 'bold', diff --git a/src/conversion/downcast-converters.js b/src/conversion/downcast-converters.js index 2a6d5cf31..284ed73c2 100644 --- a/src/conversion/downcast-converters.js +++ b/src/conversion/downcast-converters.js @@ -105,6 +105,16 @@ export function downcastElementToElement( config ) { * } * } ); * + * downcastAttributeToElement( { + * model: { + * key: 'color', + * name: '$text' + * }, + * view: ( modelAttributeValue, viewWriter ) => { + * return viewWriter.createAttributeElement( 'span', { style: 'color:' + modelAttributeValue } ); + * } + * } ); + * * See {@link module:engine/conversion/conversion~Conversion#for} to learn how to add converter to conversion process. * * @param {Object} config Conversion configuration. @@ -120,6 +130,11 @@ export function downcastAttributeToElement( config ) { config = cloneDeep( config ); const modelKey = config.model.key ? config.model.key : config.model; + let eventName = 'attribute:' + modelKey; + + if ( config.model.name ) { + eventName += ':' + config.model.name; + } if ( config.model.values ) { for ( const modelValue of config.model.values ) { @@ -132,7 +147,7 @@ export function downcastAttributeToElement( config ) { const elementCreator = _getFromAttributeCreator( config ); return dispatcher => { - dispatcher.on( 'attribute:' + modelKey, wrap( elementCreator ), { priority: config.priority || 'normal' } ); + dispatcher.on( eventName, wrap( elementCreator ), { priority: config.priority || 'normal' } ); }; } diff --git a/tests/conversion/conversion.js b/tests/conversion/conversion.js index 14988fe49..385f86695 100644 --- a/tests/conversion/conversion.js +++ b/tests/conversion/conversion.js @@ -407,6 +407,49 @@ describe( 'Conversion', () => { '
Foo bar
' ); } ); + + it( 'config.model.name is given', () => { + schema.extend( '$text', { + allowAttributes: [ 'textDecoration' ] + } ); + + conversion.attributeToElement( { + model: { + key: 'textDecoration', + values: [ 'underline', 'lineThrough' ], + name: '$text' + }, + view: { + underline: { + name: 'span', + style: { + 'text-decoration': 'underline' + } + }, + lineThrough: { + name: 'span', + style: { + 'text-decoration': 'line-through' + } + } + } + } ); + + test( + 'Foo
', + 'Foo
', + 'Foo
', + '