All files / store PositionStoreProvider.js

0% Statements 0/11
0% Branches 0/2
0% Functions 0/1
0% Lines 0/11
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108                                                                                                                                                                                                                       
/**
* Copyright 2018, Plotly, Inc.
* All rights reserved.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
 
import PropTypes from 'prop-types';
import React, { PureComponent } from 'react';
import positionStoreMixin from './positionStoreMixin';
 
class PositionStoreProvider extends PureComponent {
 
  constructor(props) {
  }
 
  updateFromPositionStore = () => {
    const state = this.context.positionMSAStore.getState();
    this.position = this.position || {};
    if (this.props.withPosition) {
      this.position.xPos = state.position.xPos;
      this.position.yPos = state.position.yPos;
    }
    if (this.props.withX) {
      this.position.xPosOffset = state.xPosOffset;
      this.position.currentViewSequencePosition = state.currentViewSequencePosition;
    }
    if (this.props.withY) {
      this.position.yPosOffset = state.yPosOffset;
      this.position.currentViewSequence = state.currentViewSequence;
    }
    if (this.shouldRerender()) {
      // this will always force a rerender as position is a new object
      this.setState({
        position: {
          ...this.position,
        }
      });
    }
  }
 
 componentWillMount(){
    this.updateFromPositionStore();
    this.context.positionMSAStore.subscribe(this.updateFromPositionStore);
  }
 
  componentDidUpdate(){
    if (oldComponentDidUpdate) {
      oldComponentDidUpdate.call(this);
    }
    this.updateScrollPosition();
  }
 
  // inject the store via contexts
  dispatch = (payload) => {
    this.context.positionMSAStore.dispatch(payload);
  };
 
  shouldRerender = () => {
    if (withY) {
      if (Math.abs(this.position.currentViewSequence - this.position.lastCurrentViewSequence) >= this.props.cacheElements) {
        return true;
      }
    }
    if (withX) {
      if (Math.abs(this.position.currentViewSequencePosition - this.position.lastCurrentViewSequencePosition) >= this.props.cacheElements) {
        return true;
      }
    }
    return this.updateScrollPosition() || false;
  }
 
  updateScrollPosition = () => {
    if (this.el && this.el.current) {
      if (withX) {
        let offsetX = -this.position.xPosOffset;
        offsetX += (this.position.lastCurrentViewSequencePosition - this.position.lastStartXTile) * this.props.tileWidth;
        if (this.position.currentViewSequencePosition !== this.position.lastCurrentViewSequencePosition) {
          offsetX += (this.position.currentViewSequencePosition - this.position.lastCurrentViewSequencePosition) * this.props.tileWidth;
        }
        this.el.current.scrollLeft = offsetX;
      }
      if (withY) {
        let offsetY = -this.position.yPosOffset;
        offsetY += (this.position.lastCurrentViewSequence - this.position.lastStartYTile) * this.props.tileHeight;
        if (this.position.currentViewSequence !== this.position.lastCurrentViewSequence) {
          offsetY += (this.position.currentViewSequence - this.position.lastCurrentViewSequence) * this.props.tileHeight;
        }
        this.el.current.scrollTop = offsetY;
      }
    }
    return false;
  };
}
 
PositionStoreProvider.defaultProps = {
  withX: false,
  withY: false,
  withPosition: false,
};
 
PositionStoreProvider.contextTypes = {
  positionMSAStore: PropTypes.object,
}
 
export default PositionStoreProvider;