SodhanaLibrary

import React from 'react'

class ExampleApplication extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      scrollStatus:''
    };
    this._timeout = null;
    this.handleScroll = this.handleScroll.bind(this);
  }

  handleScroll(event) {
     if(this._timeout){ //if there is already a timeout in process cancel it
      clearTimeout(this._timeout);
     }
     this._timeout = setTimeout(() => {
       this._timeout = null;
       this.setState({
         scrollStatus:'scroll stopped'
       });
     },1000);
     if(this.state.scrollStatus !== 'scrolling') {
       this.setState({
         scrollStatus:'scrolling'
       });
     }

  }

  render() {
    return (
      <div>
        <div id="topDiv">Scroll status:  <strong>{this.state.scrollStatus}</strong> </div>
        <div id="mainDiv" onScroll={this.handleScroll}>
          Scroll down and up, observe the scrollStatus
          <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
          <h3>bottom</h3>
        </div>
      </div>
    );
  }

}

ExampleApplication.propTypes = {
}

ExampleApplication.defaultProps = {
}

export default ExampleApplication;