|
@@ -58,12 +58,8 @@ export default class AlignmentEditing extends Plugin {
|
|
|
// Allow alignment attribute on all blocks.
|
|
// Allow alignment attribute on all blocks.
|
|
|
schema.allow( { name: '$block', attributes: 'alignment' } );
|
|
schema.allow( { name: '$block', attributes: 'alignment' } );
|
|
|
|
|
|
|
|
- attributeToStyleConverter(
|
|
|
|
|
- [ data.modelToView, editing.modelToView ],
|
|
|
|
|
- 'alignment',
|
|
|
|
|
- attribute => ( { 'text-align': attribute } ),
|
|
|
|
|
- () => [ 'text-align' ]
|
|
|
|
|
- );
|
|
|
|
|
|
|
+ data.modelToView.on( 'attribute:alignment', convertStyle() );
|
|
|
|
|
+ editing.modelToView.on( 'attribute:alignment', convertStyle() );
|
|
|
|
|
|
|
|
// Convert `text-align` style property from element to model attribute alignment.
|
|
// Convert `text-align` style property from element to model attribute alignment.
|
|
|
buildViewConverter()
|
|
buildViewConverter()
|
|
@@ -122,32 +118,18 @@ export function isSupported( style ) {
|
|
|
return AlignmentEditing.supportedStyles.includes( style );
|
|
return AlignmentEditing.supportedStyles.includes( style );
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-// Defines attribute to style converters.
|
|
|
|
|
-// @private
|
|
|
|
|
-function attributeToStyleConverter( dispatchers, modelAttributeName, setStyleFn, removeStyleFn ) {
|
|
|
|
|
- for ( const dispatcher of dispatchers ) {
|
|
|
|
|
- dispatcher.on( `attribute:${ modelAttributeName }`, style( setStyleFn, removeStyleFn ) );
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
// Dispatcher handler responsible for setting style to a view element.
|
|
// Dispatcher handler responsible for setting style to a view element.
|
|
|
// @private
|
|
// @private
|
|
|
-function style( setStyleFn, removeStyleFn ) {
|
|
|
|
|
|
|
+function convertStyle() {
|
|
|
return ( evt, data, consumable, conversionApi ) => {
|
|
return ( evt, data, consumable, conversionApi ) => {
|
|
|
if ( !consumable.consume( data.item, eventNameToConsumableType( evt.name ) ) ) {
|
|
if ( !consumable.consume( data.item, eventNameToConsumableType( evt.name ) ) ) {
|
|
|
return;
|
|
return;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- if ( data.attributeNewValue ) {
|
|
|
|
|
- // Set style.
|
|
|
|
|
- const styles = setStyleFn( data.attributeNewValue );
|
|
|
|
|
-
|
|
|
|
|
- conversionApi.mapper.toViewElement( data.item ).setStyle( styles );
|
|
|
|
|
- } else {
|
|
|
|
|
- // Remove style.
|
|
|
|
|
- const styles = removeStyleFn();
|
|
|
|
|
-
|
|
|
|
|
- conversionApi.mapper.toViewElement( data.item ).removeStyle( ...styles );
|
|
|
|
|
|
|
+ if ( data.attributeNewValue ) { // Set style.
|
|
|
|
|
+ conversionApi.mapper.toViewElement( data.item ).setStyle( { 'text-align': data.attributeNewValue } );
|
|
|
|
|
+ } else { // Remove style.
|
|
|
|
|
+ conversionApi.mapper.toViewElement( data.item ).removeStyle( 'text-align' );
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
}
|
|
}
|