react-flexigrid/lib/FlexiGridColumnBuffer.js

A React table component designed to allow presenting millions of rows of data.

import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import IntegerBufferSet from './struct/IntegerBufferSet';

var FlexiGridColumnBuffer = function () {
  function FlexiGridColumnBuffer(columnCount, viewportWidth, getColumnWidth, bufferColumnCount) {
    _classCallCheck(this, FlexiGridColumnBuffer);

    this.bufferSet = new IntegerBufferSet();
    this.columnCount = columnCount;
    this.viewportWidth = viewportWidth;
    this.getColumnWidth = getColumnWidth;
    this.bufferColumnCount = bufferColumnCount > 0 ? bufferColumnCount : 2;
    this.viewportStartIndex = 0;
    this.viewportEndIndex = 0;

    this.columns = [];
  }

  FlexiGridColumnBuffer.prototype.getColumnsWithUpdatedBuffer = function getColumnsWithUpdatedBuffer() {
    var remainingBufferColumns = 2 * this.bufferColumnCount;
    var bufferColumnIndex = Math.max(this.viewportStartIndex - this.bufferColumnCount, 0);

    while (bufferColumnIndex < this.viewportStartIndex) {
      this.addColumnToBuffer(bufferColumnIndex, this.viewportStartIndex, this.viewportEndIndex - 1);
      bufferColumnIndex += 1;
      remainingBufferColumns -= 1;
    }

    bufferColumnIndex = this.viewportEndIndex;
    while (bufferColumnIndex < this.columnCount && remainingBufferColumns > 0) {
      this.addColumnToBuffer(bufferColumnIndex, this.viewportStartIndex, this.viewportEndIndex - 1);
      bufferColumnIndex += 1;
      remainingBufferColumns -= 1;
    }

    return this.columns;
  };

  FlexiGridColumnBuffer.prototype.getLastVisibleColumnIndex = function getLastVisibleColumnIndex(firstColumnIndex, firstColumnOffset) {
    var endIndex = firstColumnIndex;
    var totalWidth = firstColumnOffset;

    while (totalWidth < this.viewportWidth && endIndex < this.columnCount) {
      totalWidth += this.getColumnWidth(endIndex);
      endIndex += 1;
    }

    return Math.min(endIndex, this.columnCount);
  };

  FlexiGridColumnBuffer.prototype.getColumns = function getColumns(firstColumnIndex, firstColumnOffset) {
    var columnIndex = firstColumnIndex;
    var totalWidth = firstColumnOffset;
    var endIndex = this.getLastVisibleColumnIndex(firstColumnIndex, firstColumnOffset);

    this.viewportStartIndex = firstColumnIndex;

    while (columnIndex < endIndex || totalWidth < this.viewportWidth && columnIndex < this.columnCount) {
      this.addColumnToBuffer(columnIndex, firstColumnIndex, endIndex - 1);
      totalWidth += this.getColumnWidth(columnIndex);
      columnIndex += 1;
    }

    // Store index after the last viewport column as end, to be able to
    // distinguish when there are no columns rendered in viewport
    this.viewportEndIndex = columnIndex;

    return this.columns.slice().sort(function (a, b) {
      return a - b;
    });
  };

  FlexiGridColumnBuffer.prototype.addColumnToBuffer = function addColumnToBuffer(columnIndex, startColumnIndex, endColumnIndex) {
    var columnPosition = this.bufferSet.getPositionForValue(columnIndex);
    var viewportColumnCount = endColumnIndex - startColumnIndex;
    var allowedColumnCount = viewportColumnCount + this.bufferColumnCount * 2;

    if (columnPosition === null && this.bufferSet.getSize() >= allowedColumnCount) {
      columnPosition = this.bufferSet.replaceFurthestValuePosition(startColumnIndex, endColumnIndex, columnIndex);
    }

    if (columnPosition === null) {
      columnPosition = this.bufferSet.getNewPositionForValue(columnIndex);
      this.columns[columnPosition] = columnIndex;
    } else {
      this.columns[columnPosition] = columnIndex;
    }
  };

  return FlexiGridColumnBuffer;
}();

export default FlexiGridColumnBuffer;