8
0

blockautoformatengine.js 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. /**
  2. * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. /**
  6. * @module autoformat/blockautoformatengine
  7. */
  8. import Range from '@ckeditor/ckeditor5-engine/src/model/range';
  9. import TextProxy from '@ckeditor/ckeditor5-engine/src/model/textproxy';
  10. /**
  11. * The block autoformatting engine. It allows to format various block patterns. For example,
  12. * it can be configured to turn a paragraph starting with `*` and followed by a space into a list item.
  13. *
  14. * The autoformatting operation is integrated with the undo manager,
  15. * so the autoformatting step can be undone if the user's intention was not to format the text.
  16. *
  17. * See the constructors documentation to learn how to create custom inline autoformatters. You can also use
  18. * the {@link module:autoformat/autoformat~Autoformat} feature which enables a set of default autoformatters
  19. * (lists, headings, bold and italic).
  20. */
  21. export default class BlockAutoformatEngine {
  22. /**
  23. * Creates a listener triggered on `change` event in the document.
  24. * Calls the callback when inserted text matches the regular expression or the command name
  25. * if provided instead of the callback.
  26. *
  27. * Examples of usage:
  28. *
  29. * To convert a paragraph to heading 1 when `- ` is typed, using just the commmand name:
  30. *
  31. * new BlockAutoformatEngine( editor, /^\- $/, 'heading1' );
  32. *
  33. * To convert a paragraph to heading 1 when `- ` is typed, using just the callback:
  34. *
  35. * new BlockAutoformatEngine( editor, /^\- $/, ( context ) => {
  36. * const { batch, match } = context;
  37. * const headingLevel = match[ 1 ].length;
  38. *
  39. * editor.execute( 'heading', {
  40. * batch,
  41. * formatId: `heading${ headingLevel }`
  42. * } );
  43. * } );
  44. *
  45. * @param {module:core/editor/editor~Editor} editor The editor instance.
  46. * @param {RegExp} pattern The regular expression to execute on just inserted text.
  47. * @param {Function|String} callbackOrCommand The callback to execute or the command to run when the text is matched.
  48. * In case of providing the callback, it receives the following parameters:
  49. * * {module:engine/model/batch~Batch} batch Newly created batch for autoformat changes.
  50. * * {Object} match RegExp.exec() result of matching the pattern to inserted text.
  51. */
  52. constructor( editor, pattern, callbackOrCommand ) {
  53. let callback;
  54. if ( typeof callbackOrCommand == 'function' ) {
  55. callback = callbackOrCommand;
  56. } else {
  57. // We assume that the actual command name was provided.
  58. const command = callbackOrCommand;
  59. callback = context => {
  60. const { batch } = context;
  61. // Create new batch for removal and command execution.
  62. editor.execute( command, { batch } );
  63. };
  64. }
  65. editor.document.on( 'change', ( event, type, changes, batch ) => {
  66. if ( batch.type == 'transparent' ) {
  67. return;
  68. }
  69. if ( type != 'insert' ) {
  70. return;
  71. }
  72. // Take the first element. Typing shouldn't add more than one element at once.
  73. // And if it is not typing (e.g. paste), Autoformat should not be fired.
  74. const value = changes.range.getItems().next().value;
  75. if ( !( value instanceof TextProxy ) ) {
  76. return;
  77. }
  78. const textNode = value.textNode;
  79. const text = textNode.data;
  80. // Run matching only on non-empty paragraphs.
  81. if ( textNode.parent.name !== 'paragraph' || !text ) {
  82. return;
  83. }
  84. const match = pattern.exec( text );
  85. if ( !match ) {
  86. return;
  87. }
  88. editor.document.enqueueChanges( () => {
  89. // Create new batch to separate typing batch from the Autoformat changes.
  90. const fixBatch = editor.document.batch();
  91. // Matched range.
  92. const range = Range.createFromParentsAndOffsets( textNode.parent, 0, textNode.parent, match[ 0 ].length );
  93. // Remove matched text.
  94. fixBatch.remove( range );
  95. callback( { fixBatch, match } );
  96. } );
  97. } );
  98. }
  99. }