handsontable 11.1.0 → 12.1.0

package/3rdparty/walkontable/src/viewport.js

@@ -3,16 +3,12 @@
 exports.__esModule = true;
 exports.default = void 0;
 
-var _element = require("./../../../helpers/dom/element");
+var _element = require("../../../helpers/dom/element");
 
-var _object = require("./../../../helpers/object");
-
-var _eventManager = _interopRequireDefault(require("./../../../eventManager"));
+var _object = require("../../../helpers/object");
 
 var _calculator = require("./calculator");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -24,16 +20,24 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
  */
 var Viewport = /*#__PURE__*/function () {
   /**
-   * @param {Walkontable} wotInstance The Walkontable instance.
+   * @param {ViewportDao} dataAccessObject The Walkontable instance.
+   * @param {DomBindings} domBindings Bindings into DOM.
+   * @param {Settings} wtSettings The Walkontable settings.
+   * @param {EventManager} eventManager The instance event manager.
+   * @param {Table} wtTable The table.
    */
-  function Viewport(wotInstance) {
+  function Viewport(dataAccessObject, domBindings, wtSettings, eventManager, wtTable) {
     var _this = this;
 
     _classCallCheck(this, Viewport);
 
-    this.wot = wotInstance; // legacy support
+    this.dataAccessObject = dataAccessObject; // legacy support
 
+    this.wot = dataAccessObject.wot;
     this.instance = this.wot;
+    this.domBindings = domBindings;
+    this.wtSettings = wtSettings;
+    this.wtTable = wtTable;
     this.oversizedRows = [];
     this.oversizedColumnHeaders = [];
     this.hasOversizedColumnHeadersMarked = {};
@@ -42,8 +46,8 @@ var Viewport = /*#__PURE__*/function () {
     this.rowHeaderWidth = NaN;
     this.rowsVisibleCalculator = null;
     this.columnsVisibleCalculator = null;
-    this.eventManager = new _eventManager.default(this.wot);
-    this.eventManager.addEventListener(this.wot.rootWindow, 'resize', function () {
+    this.eventManager = eventManager;
+    this.eventManager.addEventListener(this.domBindings.rootWindow, 'resize', function () {
       _this.clientHeight = _this.getWorkspaceHeight();
     });
   }
@@ -55,11 +59,11 @@ var Viewport = /*#__PURE__*/function () {
   _createClass(Viewport, [{
     key: "getWorkspaceHeight",
     value: function getWorkspaceHeight() {
-      var currentDocument = this.wot.rootDocument;
-      var trimmingContainer = this.instance.wtOverlays.topOverlay.trimmingContainer;
+      var currentDocument = this.domBindings.rootDocument;
+      var trimmingContainer = this.dataAccessObject.topOverlayTrimmingContainer;
       var height = 0;
 
-      if (trimmingContainer === this.wot.rootWindow) {
+      if (trimmingContainer === this.domBindings.rootWindow) {
         height = currentDocument.documentElement.clientHeight;
       } else {
         var elemHeight = (0, _element.outerHeight)(trimmingContainer); // returns height without DIV scrollbar
@@ -72,24 +76,29 @@ var Viewport = /*#__PURE__*/function () {
   }, {
     key: "getWorkspaceWidth",
     value: function getWorkspaceWidth() {
-      var wot = this.wot;
-      var rootDocument = wot.rootDocument,
-          rootWindow = wot.rootWindow;
-      var trimmingContainer = this.instance.wtOverlays.leftOverlay.trimmingContainer;
+      var wtSettings = this.wtSettings;
+      var _this$domBindings = this.domBindings,
+          rootDocument = _this$domBindings.rootDocument,
+          rootWindow = _this$domBindings.rootWindow;
+      var trimmingContainer = this.dataAccessObject.inlineStartOverlayTrimmingContainer;
       var docOffsetWidth = rootDocument.documentElement.offsetWidth;
-      var totalColumns = wot.getSetting('totalColumns');
-      var preventOverflow = wot.getSetting('preventOverflow');
+      var totalColumns = wtSettings.getSetting('totalColumns');
+      var preventOverflow = wtSettings.getSetting('preventOverflow');
+      var isRtl = wtSettings.getSetting('rtlMode');
+      var tableRect = this.wtTable.TABLE.getBoundingClientRect();
+      var inlineStart = isRtl ? tableRect.right - docOffsetWidth : tableRect.left;
+      var tableOffset = docOffsetWidth - inlineStart;
       var width;
       var overflow;
 
       if (preventOverflow) {
-        return (0, _element.outerWidth)(this.instance.wtTable.wtRootElement);
+        return (0, _element.outerWidth)(this.wtTable.wtRootElement);
       }
 
-      if (wot.getSetting('freezeOverlays')) {
-        width = Math.min(docOffsetWidth - this.getWorkspaceOffset().left, docOffsetWidth);
+      if (wtSettings.getSetting('freezeOverlays')) {
+        width = Math.min(tableOffset, docOffsetWidth);
       } else {
-        width = Math.min(this.getContainerFillWidth(), docOffsetWidth - this.getWorkspaceOffset().left, docOffsetWidth);
+        width = Math.min(this.getContainerFillWidth(), tableOffset, docOffsetWidth);
       }
 
       if (trimmingContainer === rootWindow && totalColumns > 0 && this.sumColumnWidths(0, totalColumns - 1) > width) {
@@ -101,7 +110,7 @@ var Viewport = /*#__PURE__*/function () {
       }
 
       if (trimmingContainer !== rootWindow) {
-        overflow = (0, _element.getStyle)(this.instance.wtOverlays.leftOverlay.trimmingContainer, 'overflow', rootWindow);
+        overflow = (0, _element.getStyle)(this.dataAccessObject.inlineStartOverlayTrimmingContainer, 'overflow', rootWindow);
 
         if (overflow === 'scroll' || overflow === 'hidden' || overflow === 'auto') {
           // this is used in `scroll.html`
@@ -110,11 +119,11 @@ var Viewport = /*#__PURE__*/function () {
         }
       }
 
-      var stretchSetting = wot.getSetting('stretchH');
+      var stretchSetting = wtSettings.getSetting('stretchH');
 
       if (stretchSetting === 'none' || !stretchSetting) {
         // if no stretching is used, return the maximum used workspace width
-        return Math.max(width, (0, _element.outerWidth)(this.instance.wtTable.TABLE));
+        return Math.max(width, (0, _element.outerWidth)(this.wtTable.TABLE));
       } // if stretching is used, return the actual container width, so the columns can fit inside it
 
 
@@ -129,7 +138,7 @@ var Viewport = /*#__PURE__*/function () {
   }, {
     key: "hasVerticalScroll",
     value: function hasVerticalScroll() {
-      return this.getWorkspaceActualHeight() > this.getWorkspaceHeight();
+      return this.wtTable.hider.offsetHeight > this.getWorkspaceHeight();
     }
     /**
      * Checks if viewport has horizontal scroll.
@@ -140,7 +149,7 @@ var Viewport = /*#__PURE__*/function () {
   }, {
     key: "hasHorizontalScroll",
     value: function hasHorizontalScroll() {
-      return this.getWorkspaceActualWidth() > this.getWorkspaceWidth();
+      return this.wtTable.hider.offsetWidth > this.getWorkspaceWidth();
     }
     /**
      * @param {number} from The visual column index from the width sum is start calculated.
@@ -151,12 +160,11 @@ var Viewport = /*#__PURE__*/function () {
   }, {
     key: "sumColumnWidths",
     value: function sumColumnWidths(from, length) {
-      var wtTable = this.wot.wtTable;
       var sum = 0;
       var column = from;
 
       while (column < length) {
-        sum += wtTable.getColumnWidth(column);
+        sum += this.wtTable.getColumnWidth(column);
         column += 1;
       }
 
@@ -173,8 +181,8 @@ var Viewport = /*#__PURE__*/function () {
         return this.containerWidth;
       }
 
-      var mainContainer = this.instance.wtTable.holder;
-      var dummyElement = this.wot.rootDocument.createElement('div');
+      var mainContainer = this.wtTable.holder;
+      var dummyElement = this.domBindings.rootDocument.createElement('div');
       dummyElement.style.width = '100%';
       dummyElement.style.height = '1px';
       mainContainer.appendChild(dummyElement);
@@ -190,26 +198,7 @@ var Viewport = /*#__PURE__*/function () {
   }, {
     key: "getWorkspaceOffset",
     value: function getWorkspaceOffset() {
-      return (0, _element.offset)(this.wot.wtTable.TABLE);
-    }
-    /**
-     * @returns {number}
-     */
-
-  }, {
-    key: "getWorkspaceActualHeight",
-    value: function getWorkspaceActualHeight() {
-      return (0, _element.outerHeight)(this.wot.wtTable.TABLE);
-    }
-    /**
-     * @returns {number}
-     */
-
-  }, {
-    key: "getWorkspaceActualWidth",
-    value: function getWorkspaceActualWidth() {
-      var wtTable = this.wot.wtTable;
-      return (0, _element.outerWidth)(wtTable.TABLE) || (0, _element.outerWidth)(wtTable.TBODY) || (0, _element.outerWidth)(wtTable.THEAD); // IE8 reports 0 as <table> offsetWidth;
+      return (0, _element.offset)(this.wtTable.TABLE);
     }
     /**
      * @returns {number}
@@ -218,12 +207,12 @@ var Viewport = /*#__PURE__*/function () {
   }, {
     key: "getColumnHeaderHeight",
     value: function getColumnHeaderHeight() {
-      var columnHeaders = this.instance.getSetting('columnHeaders');
+      var columnHeaders = this.wtSettings.getSetting('columnHeaders');
 
       if (!columnHeaders.length) {
         this.columnHeaderHeight = 0;
       } else if (isNaN(this.columnHeaderHeight)) {
-        this.columnHeaderHeight = (0, _element.outerHeight)(this.wot.wtTable.THEAD);
+        this.columnHeaderHeight = (0, _element.outerHeight)(this.wtTable.THEAD);
       }
 
       return this.columnHeaderHeight;
@@ -256,8 +245,8 @@ var Viewport = /*#__PURE__*/function () {
   }, {
     key: "getRowHeaderWidth",
     value: function getRowHeaderWidth() {
-      var rowHeadersWidthSetting = this.instance.getSetting('rowHeaderWidth');
-      var rowHeaders = this.instance.getSetting('rowHeaders');
+      var rowHeadersWidthSetting = this.wtSettings.getSetting('rowHeaderWidth');
+      var rowHeaders = this.wtSettings.getSetting('rowHeaders');
 
       if (rowHeadersWidthSetting) {
         this.rowHeaderWidth = 0;
@@ -267,13 +256,9 @@ var Viewport = /*#__PURE__*/function () {
         }
       }
 
-      if (this.wot.cloneSource) {
-        return this.wot.cloneSource.wtViewport.getRowHeaderWidth();
-      }
-
       if (isNaN(this.rowHeaderWidth)) {
         if (rowHeaders.length) {
-          var TH = this.instance.wtTable.TABLE.querySelector('TH');
+          var TH = this.wtTable.TABLE.querySelector('TH');
           this.rowHeaderWidth = 0;
 
           for (var _i = 0, _len = rowHeaders.length; _i < _len; _i++) {
@@ -291,7 +276,7 @@ var Viewport = /*#__PURE__*/function () {
         }
       }
 
-      this.rowHeaderWidth = this.instance.getSetting('onModifyRowHeaderWidth', this.rowHeaderWidth) || this.rowHeaderWidth;
+      this.rowHeaderWidth = this.wtSettings.getSetting('onModifyRowHeaderWidth', this.rowHeaderWidth) || this.rowHeaderWidth;
       return this.rowHeaderWidth;
     }
     /**
@@ -329,57 +314,54 @@ var Viewport = /*#__PURE__*/function () {
     key: "createRowsCalculator",
     value: function createRowsCalculator() {
       var calculationType = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _calculator.RENDER_TYPE;
-      var wot = this.wot;
-      var wtSettings = wot.wtSettings,
-          wtOverlays = wot.wtOverlays,
-          wtTable = wot.wtTable,
-          rootDocument = wot.rootDocument;
+      var wtSettings = this.wtSettings,
+          wtTable = this.wtTable;
       var height;
       var scrollbarHeight;
       var fixedRowsHeight;
       this.rowHeaderWidth = NaN;
 
-      if (wtSettings.settings.renderAllRows && calculationType === _calculator.RENDER_TYPE) {
+      if (wtSettings.getSetting('renderAllRows') && calculationType === _calculator.RENDER_TYPE) {
         height = Infinity;
       } else {
         height = this.getViewportHeight();
       }
 
-      var pos = wtOverlays.topOverlay.getScrollPosition() - wtOverlays.topOverlay.getTableParentOffset();
+      var pos = this.dataAccessObject.topScrollPosition - this.dataAccessObject.topParentOffset;
 
       if (pos < 0) {
         pos = 0;
       }
 
-      var fixedRowsTop = wot.getSetting('fixedRowsTop');
-      var fixedRowsBottom = wot.getSetting('fixedRowsBottom');
-      var totalRows = wot.getSetting('totalRows');
+      var fixedRowsTop = wtSettings.getSetting('fixedRowsTop');
+      var fixedRowsBottom = wtSettings.getSetting('fixedRowsBottom');
+      var totalRows = wtSettings.getSetting('totalRows');
 
       if (fixedRowsTop) {
-        fixedRowsHeight = wtOverlays.topOverlay.sumCellSizes(0, fixedRowsTop);
+        fixedRowsHeight = this.dataAccessObject.topOverlay.sumCellSizes(0, fixedRowsTop);
         pos += fixedRowsHeight;
         height -= fixedRowsHeight;
       }
 
-      if (fixedRowsBottom && wtOverlays.bottomOverlay.clone) {
-        fixedRowsHeight = wtOverlays.bottomOverlay.sumCellSizes(totalRows - fixedRowsBottom, totalRows);
+      if (fixedRowsBottom && this.dataAccessObject.bottomOverlay.clone) {
+        fixedRowsHeight = this.dataAccessObject.bottomOverlay.sumCellSizes(totalRows - fixedRowsBottom, totalRows);
         height -= fixedRowsHeight;
       }
 
       if (wtTable.holder.clientHeight === wtTable.holder.offsetHeight) {
         scrollbarHeight = 0;
       } else {
-        scrollbarHeight = (0, _element.getScrollbarWidth)(rootDocument);
+        scrollbarHeight = (0, _element.getScrollbarWidth)(this.domBindings.rootDocument);
       }
 
       return new _calculator.ViewportRowsCalculator({
         viewportSize: height,
         scrollOffset: pos,
-        totalItems: wot.getSetting('totalRows'),
+        totalItems: wtSettings.getSetting('totalRows'),
         itemSizeFn: function itemSizeFn(sourceRow) {
           return wtTable.getRowHeight(sourceRow);
         },
-        overrideFn: wtSettings.settings.viewportRowCalculatorOverride,
+        overrideFn: wtSettings.getSettingPure('viewportRowCalculatorOverride'),
         calculationType: calculationType,
         scrollbarHeight: scrollbarHeight
       });
@@ -391,50 +373,47 @@ var Viewport = /*#__PURE__*/function () {
      *
      * @param {number} calculationType The render type ID, which determines for what type of
      *                                 calculation calculator is created.
-     * @returns {ViewportRowsCalculator}
+     * @returns {ViewportColumnsCalculator}
      */
 
   }, {
     key: "createColumnsCalculator",
     value: function createColumnsCalculator() {
       var calculationType = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _calculator.RENDER_TYPE;
-      var wot = this.wot;
-      var wtSettings = wot.wtSettings,
-          wtOverlays = wot.wtOverlays,
-          wtTable = wot.wtTable,
-          rootDocument = wot.rootDocument;
+      var wtSettings = this.wtSettings,
+          wtTable = this.wtTable;
       var width = this.getViewportWidth();
-      var pos = wtOverlays.leftOverlay.getScrollPosition() - wtOverlays.leftOverlay.getTableParentOffset();
+      var pos = Math.abs(this.dataAccessObject.inlineStartScrollPosition) - this.dataAccessObject.inlineStartParentOffset;
       this.columnHeaderHeight = NaN;
 
       if (pos < 0) {
         pos = 0;
       }
 
-      var fixedColumnsLeft = wot.getSetting('fixedColumnsLeft');
+      var fixedColumnsStart = wtSettings.getSetting('fixedColumnsStart');
 
-      if (fixedColumnsLeft) {
-        var fixedColumnsWidth = wtOverlays.leftOverlay.sumCellSizes(0, fixedColumnsLeft);
+      if (fixedColumnsStart) {
+        var fixedColumnsWidth = this.dataAccessObject.inlineStartOverlay.sumCellSizes(0, fixedColumnsStart);
         pos += fixedColumnsWidth;
         width -= fixedColumnsWidth;
       }
 
       if (wtTable.holder.clientWidth !== wtTable.holder.offsetWidth) {
-        width -= (0, _element.getScrollbarWidth)(rootDocument);
+        width -= (0, _element.getScrollbarWidth)(this.domBindings.rootDocument);
       }
 
       return new _calculator.ViewportColumnsCalculator({
         viewportSize: width,
-        scrollOffset: pos,
-        totalItems: wot.getSetting('totalColumns'),
+        scrollOffset: Math.abs(pos),
+        totalItems: wtSettings.getSetting('totalColumns'),
         itemSizeFn: function itemSizeFn(sourceCol) {
-          return wot.wtTable.getColumnWidth(sourceCol);
+          return wtTable.getColumnWidth(sourceCol);
         },
-        overrideFn: wtSettings.settings.viewportColumnCalculatorOverride,
+        overrideFn: wtSettings.getSettingPure('viewportColumnCalculatorOverride'),
         calculationType: calculationType,
-        stretchMode: wot.getSetting('stretchH'),
+        stretchMode: wtSettings.getSetting('stretchH'),
         stretchingItemWidthFn: function stretchingItemWidthFn(stretchedWidth, column) {
-          return wot.getSetting('onBeforeStretchingColumnWidth', stretchedWidth, column);
+          return wtSettings.getSetting('onBeforeStretchingColumnWidth', stretchedWidth, column);
         }
       });
     }
@@ -500,14 +479,19 @@ var Viewport = /*#__PURE__*/function () {
       }
 
       var startRow = proposedRowsVisibleCalculator.startRow,
-          endRow = proposedRowsVisibleCalculator.endRow;
+          endRow = proposedRowsVisibleCalculator.endRow; // if there are no fully visible rows at all, return false
+
+      if (startRow === null && endRow === null) {
+        return false;
+      }
+
       var _this$rowsRenderCalcu = this.rowsRenderCalculator,
           renderedStartRow = _this$rowsRenderCalcu.startRow,
           renderedEndRow = _this$rowsRenderCalcu.endRow;
 
       if (startRow < renderedStartRow || startRow === renderedStartRow && startRow > 0) {
         return false;
-      } else if (endRow > renderedEndRow || endRow === renderedEndRow && endRow < this.wot.getSetting('totalRows') - 1) {
+      } else if (endRow > renderedEndRow || endRow === renderedEndRow && endRow < this.wtSettings.getSetting('totalRows') - 1) {
         return false;
       }
 
@@ -530,14 +514,19 @@ var Viewport = /*#__PURE__*/function () {
       }
 
       var startColumn = proposedColumnsVisibleCalculator.startColumn,
-          endColumn = proposedColumnsVisibleCalculator.endColumn;
+          endColumn = proposedColumnsVisibleCalculator.endColumn; // if there are no fully visible columns at all, return false
+
+      if (startColumn === null && endColumn === null) {
+        return false;
+      }
+
       var _this$columnsRenderCa = this.columnsRenderCalculator,
           renderedStartColumn = _this$columnsRenderCa.startColumn,
           renderedEndColumn = _this$columnsRenderCa.endColumn;
 
       if (startColumn < renderedStartColumn || startColumn === renderedStartColumn && startColumn > 0) {
         return false;
-      } else if (endColumn > renderedEndColumn || endColumn === renderedEndColumn && endColumn < this.wot.getSetting('totalColumns') - 1) {
+      } else if (endColumn > renderedEndColumn || endColumn === renderedEndColumn && endColumn < this.wtSettings.getSetting('totalColumns') - 1) {
         return false;
       }