@seafile/seafile-editor 0.3.76

package/dist/editor/editor-utils/block-element-utils/table-utils.js

@@ -0,0 +1,418 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import { SfEditor } from '../../custom/custom';
+import { Node } from 'slate';
+import { generateTable, generateTableRow, generateTableCell } from '../../element-model/table';
+import getEventTransfer from '../../custom/get-event-transfer';
+import { htmlDeserializer } from '../../../utils/deserialize-html';
+
+var TableUtils = function TableUtils(_editor) {
+  var _this = this;
+
+  _classCallCheck(this, TableUtils);
+
+  this.isInTable = function () {
+    var editor = _this.editor;
+    var selection = editor.selection;
+    if (!selection) return false;
+    var block = SfEditor.match(editor, editor.selection.anchor, 'block');
+    var parent = Node.parent(editor, block[1]);
+    var focusPath = selection.focus.path;
+    var anchorPath = selection.anchor.path;
+
+    if (parent && parent.type && parent.type.includes('table')) {
+      if (focusPath[0] === anchorPath[0]) return true;
+    }
+
+    return false;
+  };
+
+  this.insertTable = function () {
+    var tableElement = generateTable();
+    SfEditor.insertNodes(_this.editor, tableElement); // get the first cell path of the table and move selection to it;
+
+    var table = SfEditor.match(_this.editor, _this.editor.selection, {
+      type: 'table'
+    });
+    var tablePath = table[1];
+    var targetPath = [].concat(_toConsumableArray(tablePath), [0, 0]);
+    SfEditor.select(_this.editor, targetPath);
+  };
+
+  this.getSelectedTableCells = function () {
+    var node = SfEditor.match(_this.editor, _this.editor.selection, {
+      type: 'table'
+    });
+    var tableNode = node[0];
+    var selectedCells = document.querySelectorAll('.selected-cell');
+
+    if (selectedCells.length === 0) {
+      return null;
+    }
+
+    var cellIndexs = [];
+    var rowIndexs = [];
+    selectedCells.forEach(function (cell, index) {
+      var cellIndex = cell.cellIndex;
+      var rowDom = cell.parentNode;
+      var rowIndex = rowDom.rowIndex;
+      cellIndexs.push(cellIndex);
+      rowIndexs.push(rowIndex);
+    });
+    var rowRange = {
+      min: Math.min.apply(null, rowIndexs),
+      max: Math.max.apply(null, rowIndexs)
+    };
+    var columnRange = {
+      min: Math.min.apply(null, cellIndexs),
+      max: Math.max.apply(null, cellIndexs)
+    };
+    var tableRows = tableNode.children;
+    var rowNodes = [];
+    tableRows.forEach(function (row, rowIndex) {
+      var cellNodes = [];
+
+      if (rowIndex >= rowRange.min && rowIndex <= rowRange.max) {
+        row.children.forEach(function (cell, cellIndex) {
+          if (cellIndex >= columnRange.min && cellIndex <= columnRange.max) {
+            cellNodes.push(Object.assign({}, {}, cell));
+          }
+        });
+        rowNodes.push(generateTableRow({
+          children: cellNodes
+        }));
+      }
+    });
+    return [generateTable({
+      children: rowNodes
+    })];
+  };
+
+  this.pasteContentInTable = function (command) {
+    var data = command.data;
+
+    var _getEventTransfer = getEventTransfer(data),
+        fragment = _getEventTransfer.fragment,
+        text = _getEventTransfer.text,
+        type = _getEventTransfer.type,
+        html = _getEventTransfer.html;
+
+    var newtext = text.replace(/\r\n|\n/g, ' ');
+
+    if (!fragment && type === 'text') {
+      SfEditor.insertText(_this.editor, newtext);
+      return;
+    }
+
+    if (type === 'html') {
+      fragment = htmlDeserializer(html);
+    }
+
+    if (fragment.length === 1) {
+      if (fragment[0].type === 'table') {
+        var tableNode = fragment[0];
+
+        var _SfEditor$match = SfEditor.match(_this.editor, _this.editor.selection, {
+          type: 'table_row'
+        }),
+            _SfEditor$match2 = _slicedToArray(_SfEditor$match, 2),
+            row = _SfEditor$match2[0],
+            rowPath = _SfEditor$match2[1];
+
+        var _SfEditor$match3 = SfEditor.match(_this.editor, _this.editor.selection, {
+          type: 'table'
+        }),
+            _SfEditor$match4 = _slicedToArray(_SfEditor$match3, 2),
+            table = _SfEditor$match4[0],
+            tablePath = _SfEditor$match4[1];
+
+        var cellPath = SfEditor.match(_this.editor, _this.editor.selection, {
+          type: 'table_cell'
+        })[1];
+        var currentRowIndex = rowPath[rowPath.length - 1];
+        var currentCellIndex = cellPath[cellPath.length - 1];
+        var tableWidth = row.children.length;
+        var tableHeight = table.children.length;
+        tableNode.children.some(function (row, rowIndex) {
+          var rowPath = [].concat(_toConsumableArray(tablePath), [currentRowIndex + rowIndex]);
+
+          if (currentRowIndex + rowIndex > tableHeight - 1) {
+            return true;
+          }
+
+          row.children.some(function (cell, cellIndex) {
+            if (currentCellIndex + cellIndex > tableWidth - 1) {
+              return true;
+            }
+
+            var currentCellPath = [].concat(_toConsumableArray(rowPath), [currentCellIndex + cellIndex]);
+            SfEditor.removeNodes(_this.editor, {
+              at: [].concat(_toConsumableArray(currentCellPath), [0])
+            });
+
+            if (cell.children.type !== 'paragraph') {
+              var _text = Node.text(cell);
+
+              SfEditor.insertNodes(_this.editor, {
+                type: 'paragraph',
+                children: [{
+                  text: _text
+                }]
+              }, {
+                at: [].concat(_toConsumableArray(currentCellPath), [0])
+              });
+            } else {
+              SfEditor.insertNodes(_this.editor, cell.children, {
+                at: [].concat(_toConsumableArray(currentCellPath), [0])
+              });
+            }
+
+            return false;
+          });
+          return false;
+        });
+      } else if (fragment[0].type === 'paragraph') {
+        SfEditor.insertFragment(_this.editor, fragment);
+      } else {
+        SfEditor.insertText(_this.editor, text.replace(/\r\n|\n/g, ' '));
+      }
+    } else {
+      fragment.forEach(function (node) {
+        if (node.type === 'paragraph') {
+          SfEditor.insertFragment(_this.editor, [node]); // if the element is node a paragraph, insert the text if the node is not 0
+        } else {
+          var nodeText = Node.text(node);
+
+          if (nodeText.length > 0) {
+            SfEditor.insertText(_this.editor, nodeText.replace(/\r\n|\n/g, ' '));
+          }
+        }
+      });
+    }
+  };
+
+  this.removeTable = function () {
+    var tableNode = SfEditor.match(_this.editor, _this.editor.selection, {
+      type: 'table'
+    });
+    var tablePath = tableNode[1];
+    var tableIndex = tablePath[tablePath.length - 1];
+    var tableParentPath = tablePath.slice(0, tablePath.length - 1);
+    var targetNodeIndex = tableIndex >= 1 ? tableIndex - 1 : 1;
+    var targteNodePath = [].concat(_toConsumableArray(tableParentPath), [targetNodeIndex]);
+    SfEditor.removeNodes(_this.editor, {
+      match: {
+        type: 'table'
+      }
+    }); // move selection to previous sibling or next sibling and collapse the selection
+
+    SfEditor.select(_this.editor, targteNodePath);
+    SfEditor.collapse(_this.editor, {
+      edge: 'end'
+    });
+  };
+
+  this.getTablePosition = function () {
+    var currentCell = SfEditor.match(_this.editor, _this.editor.selection, {
+      type: 'table_cell'
+    });
+    var currentCellPath = currentCell[1];
+    var currentTable = SfEditor.match(_this.editor, _this.editor.selection, {
+      type: 'table'
+    });
+    var tablePath = currentTable[1];
+    var rowPath = currentCellPath.slice(0, currentCellPath.length - 1);
+    var row = Node.get(_this.editor, rowPath);
+    var cell = currentCell[0];
+    var table = Node.get(_this.editor, tablePath);
+    return {
+      rowIndex: currentCellPath[currentCellPath.length - 2],
+      cellIndex: currentCellPath[currentCellPath.length - 1],
+      cellPath: currentCellPath,
+      rowPath: rowPath,
+      tablePath: tablePath,
+      row: row,
+      cell: cell,
+      table: table
+    };
+  };
+
+  this.insertRow = function () {
+    var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'after';
+
+    var position = _this.getTablePosition();
+
+    var tablePath = position.tablePath;
+    var rowIndex = position.rowIndex;
+    var targetPath;
+
+    if (type === 'after') {
+      targetPath = [].concat(_toConsumableArray(tablePath), [rowIndex + 1]);
+    }
+
+    if (type === 'before') {
+      targetPath = [].concat(_toConsumableArray(tablePath), [rowIndex]);
+    }
+
+    var rowChildren = position.row.children.map(function (cell) {
+      return generateTableCell({
+        data: {
+          align: cell.data.align
+        }
+      });
+    });
+    SfEditor.insertNodes(_this.editor, generateTableRow({
+      children: rowChildren
+    }), {
+      at: targetPath
+    });
+    var focusPath = [].concat(_toConsumableArray(targetPath), [0]);
+    SfEditor.select(_this.editor, focusPath);
+    SfEditor.collapse(_this.editor, {
+      edge: 'end'
+    });
+  };
+
+  this.removeRow = function () {
+    var position = _this.getTablePosition();
+
+    var rowPath = position.rowPath,
+        table = position.table,
+        rowIndex = position.rowIndex,
+        tablePath = position.tablePath;
+    var targetPath;
+
+    if (table.children.length > 1) {
+      if (rowIndex === table.children.length - 1) {
+        targetPath = [].concat(_toConsumableArray(tablePath), [rowIndex - 1, 0, 0]);
+      } else {
+        targetPath = [].concat(_toConsumableArray(tablePath), [rowIndex, 0, 0]);
+      }
+
+      SfEditor.removeNodes(_this.editor, {
+        at: rowPath
+      });
+      SfEditor.select(_this.editor, targetPath);
+      SfEditor.collapse({
+        at: 'end'
+      });
+    } else {
+      _this.removeTable();
+    }
+  };
+
+  this.insertColumn = function () {
+    var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'after';
+
+    var position = _this.getTablePosition();
+
+    var focusPath;
+    var table = position.table,
+        tablePath = position.tablePath,
+        cellIndex = position.cellIndex;
+
+    if (type === 'after') {
+      for (var index = 0; index < table.children.length; index++) {
+        var newCellPath = [].concat(_toConsumableArray(tablePath), [index, cellIndex + 1]);
+        SfEditor.insertNodes(_this.editor, generateTableCell({
+          data: {
+            align: 'left'
+          }
+        }), {
+          at: newCellPath
+        });
+      }
+
+      focusPath = [].concat(_toConsumableArray(tablePath), [0, cellIndex + 1]);
+    } else {
+      for (var _index = 0; _index < table.children.length; _index++) {
+        var _newCellPath = [].concat(_toConsumableArray(tablePath), [_index, cellIndex]);
+
+        SfEditor.insertNodes(_this.editor, generateTableCell({
+          data: {
+            align: 'left'
+          }
+        }), {
+          at: _newCellPath
+        });
+      }
+
+      focusPath = [].concat(_toConsumableArray(tablePath), [0, cellIndex]);
+    }
+
+    SfEditor.select(_this.editor, focusPath);
+    SfEditor.collapse(_this.editor, {
+      edge: 'end'
+    });
+  };
+
+  this.removeColumn = function () {
+    var position = _this.getTablePosition();
+
+    var table = position.table,
+        tablePath = position.tablePath,
+        cellIndex = position.cellIndex,
+        row = position.row;
+
+    if (row.children.length === 1) {
+      _this.removeTable();
+
+      return;
+    }
+
+    for (var index = 0; index < table.children.length; index++) {
+      var cellPath = [].concat(_toConsumableArray(tablePath), [index, cellIndex]);
+      SfEditor.removeNodes(_this.editor, {
+        at: cellPath
+      });
+    }
+
+    return;
+  };
+
+  this.setAlign = function (align) {
+    var position = _this.getTablePosition();
+
+    var table = position.table,
+        tablePath = position.tablePath,
+        cellIndex = position.cellIndex;
+
+    for (var index = 0; index < table.children.length; index++) {
+      var cellPath = [].concat(_toConsumableArray(tablePath), [index, cellIndex]);
+      SfEditor.setNodes(_this.editor, {
+        data: {
+          align: align
+        }
+      }, {
+        at: cellPath
+      });
+    }
+  };
+
+  this.exitTable = function () {
+    var tableNode = SfEditor.match(_this.editor, _this.editor.selection, {
+      type: 'table'
+    });
+    var tablePath = tableNode[1];
+    var tableIndex = tablePath[tablePath.length - 1];
+    var tableParentPath = tablePath.slice(0, tablePath.length - 1);
+    var newPath = [].concat(_toConsumableArray(tableParentPath), [tableIndex + 1]);
+    SfEditor.insertNodes(_this.editor, {
+      type: 'paragraph',
+      children: [{
+        text: ''
+      }]
+    }, {
+      at: newPath
+    });
+    SfEditor.select(_this.editor, newPath);
+    SfEditor.collapse({
+      at: 'end'
+    });
+  };
+
+  this.editor = _editor;
+};
+
+export default TableUtils;