removecolumncommand.js 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. /**
  2. * @license Copyright (c) 2003-2020, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  4. */
  5. /**
  6. * @module table/commands/removecolumncommand
  7. */
  8. import Command from '@ckeditor/ckeditor5-core/src/command';
  9. import TableWalker from '../tablewalker';
  10. import { getSelectionAffectedTableCells } from '../utils';
  11. /**
  12. * The remove column command.
  13. *
  14. * The command is registered by {@link module:table/tableediting~TableEditing} as the `'removeTableColumn'` editor command.
  15. *
  16. * To remove the column containing the selected cell, execute the command:
  17. *
  18. * editor.execute( 'removeTableColumn' );
  19. *
  20. * @extends module:core/command~Command
  21. */
  22. export default class RemoveColumnCommand extends Command {
  23. /**
  24. * @inheritDoc
  25. */
  26. refresh() {
  27. const selectedCells = getSelectionAffectedTableCells( this.editor.model.document.selection );
  28. const firstCell = selectedCells[ 0 ];
  29. if ( firstCell ) {
  30. const table = firstCell.parent.parent;
  31. const tableColumnCount = this.editor.plugins.get( 'TableUtils' ).getColumns( table );
  32. const tableMap = [ ...new TableWalker( table ) ];
  33. const columnIndexes = tableMap.filter( entry => selectedCells.includes( entry.cell ) ).map( el => el.column ).sort();
  34. const minColumnIndex = columnIndexes[ 0 ];
  35. const maxColumnIndex = columnIndexes[ columnIndexes.length - 1 ];
  36. this.isEnabled = maxColumnIndex - minColumnIndex < ( tableColumnCount - 1 );
  37. } else {
  38. this.isEnabled = false;
  39. }
  40. }
  41. /**
  42. * @inheritDoc
  43. */
  44. execute() {
  45. const [ firstCell, lastCell ] = getBoundaryCells( this.editor.model.document.selection );
  46. const table = firstCell.parent.parent;
  47. // Cache the table before removing or updating colspans.
  48. const tableMap = [ ...new TableWalker( table ) ];
  49. // Store column indexes of removed columns.
  50. const removedColumnIndexes = {
  51. first: tableMap.find( value => value.cell === firstCell ).column,
  52. last: tableMap.find( value => value.cell === lastCell ).column
  53. };
  54. const cellToFocus = getCellToFocus( tableMap, firstCell, lastCell, removedColumnIndexes );
  55. this.editor.model.change( writer => {
  56. const columnsToRemove = removedColumnIndexes.last - removedColumnIndexes.first + 1;
  57. this.editor.plugins.get( 'TableUtils' ).removeColumns( table, {
  58. at: removedColumnIndexes.first,
  59. columns: columnsToRemove
  60. } );
  61. writer.setSelection( writer.createPositionAt( cellToFocus, 0 ) );
  62. } );
  63. }
  64. }
  65. // Returns a proper table cell to focus after removing a column.
  66. // - selection is on last table cell it will return previous cell.
  67. function getCellToFocus( tableMap, firstCell, lastCell, removedColumnIndexes ) {
  68. const colspan = parseInt( lastCell.getAttribute( 'colspan' ) || 1 );
  69. // If the table cell is spanned over 2+ columns - it will be truncated so the selection should
  70. // stay in that cell.
  71. if ( colspan > 1 ) {
  72. return lastCell;
  73. }
  74. // Normally, look for the cell in the same row that precedes the first cell to put selection there ("column on the left").
  75. // If the deleted column is the first column of the table, there will be no predecessor: use the cell
  76. // from the column that follows then (also in the same row).
  77. else if ( firstCell.previousSibling || lastCell.nextSibling ) {
  78. return lastCell.nextSibling || firstCell.previousSibling;
  79. }
  80. // It can happen that table cells have no siblings in a row, for instance, when there are row spans
  81. // in the table (in the previous row). Then just look for the closest cell that is in a column
  82. // that will not be removed to put the selection there.
  83. else {
  84. // Look for any cell in a column that precedes the first removed column.
  85. if ( removedColumnIndexes.first ) {
  86. return tableMap.reverse().find( ( { column } ) => {
  87. return column < removedColumnIndexes.first;
  88. } ).cell;
  89. }
  90. // If the first removed column is the first column of the table, then
  91. // look for any cell that is in a column that follows the last removed column.
  92. else {
  93. return tableMap.reverse().find( ( { column } ) => {
  94. return column > removedColumnIndexes.last;
  95. } ).cell;
  96. }
  97. }
  98. }
  99. // Returns helper object returning the first and the last cell contained in given selection, based on DOM order.
  100. function getBoundaryCells( selection ) {
  101. const referenceCells = getSelectionAffectedTableCells( selection );
  102. const firstCell = referenceCells[ 0 ];
  103. const lastCell = referenceCells.pop();
  104. const returnValue = [ firstCell, lastCell ];
  105. return firstCell.isBefore( lastCell ) ? returnValue : returnValue.reverse();
  106. }