|
|
@@ -23,7 +23,6 @@ export default class IndentBlock extends Plugin {
|
|
|
super( editor );
|
|
|
|
|
|
editor.config.define( 'indentBlock', {
|
|
|
- classes: [],
|
|
|
offset: 1,
|
|
|
unit: 'em'
|
|
|
} );
|
|
|
@@ -43,7 +42,7 @@ export default class IndentBlock extends Plugin {
|
|
|
const editor = this.editor;
|
|
|
const schema = editor.model.schema;
|
|
|
const conversion = editor.conversion;
|
|
|
- const config = editor.config.get( 'indentBlock' );
|
|
|
+ const configuration = editor.config.get( 'indentBlock' );
|
|
|
|
|
|
// TODO: better features inclusion
|
|
|
// CKE4: context: { div: 1, dl: 1, h1: 1, h2: 1, h3: 1, h4: 1, h5: 1, h6: 1, ul: 1, ol: 1, p: 1, pre: 1, table: 1 },
|
|
|
@@ -52,58 +51,16 @@ export default class IndentBlock extends Plugin {
|
|
|
schema.extend( 'heading2', { allowAttributes: 'indent' } );
|
|
|
schema.extend( 'heading3', { allowAttributes: 'indent' } );
|
|
|
|
|
|
- const classes = config.classes;
|
|
|
+ const useOffsetConfig = !configuration.classes || !configuration.classes.length;
|
|
|
|
|
|
- const usingClasses = !!classes.length;
|
|
|
-
|
|
|
- if ( usingClasses ) {
|
|
|
- const definition = {
|
|
|
- model: {
|
|
|
- key: 'indent',
|
|
|
- values: []
|
|
|
- },
|
|
|
- view: {}
|
|
|
- };
|
|
|
-
|
|
|
- for ( const className of classes ) {
|
|
|
- definition.model.values.push( className );
|
|
|
- definition.view[ className ] = {
|
|
|
- key: 'class',
|
|
|
- value: [ className ]
|
|
|
- };
|
|
|
- }
|
|
|
-
|
|
|
- editor.conversion.attributeToAttribute( definition );
|
|
|
+ if ( useOffsetConfig ) {
|
|
|
+ this._setupConversionUsingOffset( conversion );
|
|
|
} else {
|
|
|
- conversion.for( 'upcast' ).attributeToAttribute( {
|
|
|
- view: {
|
|
|
- styles: {
|
|
|
- 'margin-left': /[\s\S]+/
|
|
|
- }
|
|
|
- },
|
|
|
- model: {
|
|
|
- key: 'indent',
|
|
|
- value: viewElement => {
|
|
|
- return viewElement.getStyle( 'margin-left' );
|
|
|
- }
|
|
|
- }
|
|
|
- } );
|
|
|
-
|
|
|
- conversion.for( 'downcast' ).attributeToAttribute( {
|
|
|
- model: 'indent',
|
|
|
- view: modelAttributeValue => {
|
|
|
- return {
|
|
|
- key: 'style',
|
|
|
- value: {
|
|
|
- 'margin-left': modelAttributeValue
|
|
|
- }
|
|
|
- };
|
|
|
- }
|
|
|
- } );
|
|
|
+ this._setupConversionUsingClasses( configuration.classes, editor );
|
|
|
}
|
|
|
|
|
|
- editor.commands.add( 'indentBlock', new IndentBlockCommand( editor, Object.assign( { direction: 'forward' }, config ) ) );
|
|
|
- editor.commands.add( 'outdentBlock', new IndentBlockCommand( editor, Object.assign( { direction: 'backward' }, config ) ) );
|
|
|
+ editor.commands.add( 'indentBlock', new IndentBlockCommand( editor, Object.assign( { direction: 'forward' }, configuration ) ) );
|
|
|
+ editor.commands.add( 'outdentBlock', new IndentBlockCommand( editor, Object.assign( { direction: 'backward' }, configuration ) ) );
|
|
|
|
|
|
const getCommandExecuter = commandName => {
|
|
|
return ( data, cancel ) => {
|
|
|
@@ -120,6 +77,9 @@ export default class IndentBlock extends Plugin {
|
|
|
editor.keystrokes.set( 'Shift+Tab', getCommandExecuter( 'outdentBlock' ) );
|
|
|
}
|
|
|
|
|
|
+ /**
|
|
|
+ * @inheritDoc
|
|
|
+ */
|
|
|
afterInit() {
|
|
|
const editor = this.editor;
|
|
|
const indentCommand = editor.commands.get( 'indent' );
|
|
|
@@ -128,4 +88,52 @@ export default class IndentBlock extends Plugin {
|
|
|
indentCommand.registerChildCommand( editor.commands.get( 'indentBlock' ) );
|
|
|
outdentCommand.registerChildCommand( editor.commands.get( 'outdentBlock' ) );
|
|
|
}
|
|
|
+
|
|
|
+ _setupConversionUsingOffset( conversion ) {
|
|
|
+ conversion.for( 'upcast' ).attributeToAttribute( {
|
|
|
+ view: {
|
|
|
+ styles: {
|
|
|
+ 'margin-left': /[\s\S]+/
|
|
|
+ }
|
|
|
+ },
|
|
|
+ model: {
|
|
|
+ key: 'indent',
|
|
|
+ value: viewElement => {
|
|
|
+ return viewElement.getStyle( 'margin-left' );
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } );
|
|
|
+
|
|
|
+ conversion.for( 'downcast' ).attributeToAttribute( {
|
|
|
+ model: 'indent',
|
|
|
+ view: modelAttributeValue => {
|
|
|
+ return {
|
|
|
+ key: 'style',
|
|
|
+ value: {
|
|
|
+ 'margin-left': modelAttributeValue
|
|
|
+ }
|
|
|
+ };
|
|
|
+ }
|
|
|
+ } );
|
|
|
+ }
|
|
|
+
|
|
|
+ _setupConversionUsingClasses( classes, editor ) {
|
|
|
+ const definition = {
|
|
|
+ model: {
|
|
|
+ key: 'indent',
|
|
|
+ values: []
|
|
|
+ },
|
|
|
+ view: {}
|
|
|
+ };
|
|
|
+
|
|
|
+ for ( const className of classes ) {
|
|
|
+ definition.model.values.push( className );
|
|
|
+ definition.view[ className ] = {
|
|
|
+ key: 'class',
|
|
|
+ value: [ className ]
|
|
|
+ };
|
|
|
+ }
|
|
|
+
|
|
|
+ editor.conversion.attributeToAttribute( definition );
|
|
|
+ }
|
|
|
}
|