/**
 * @jsx React.DOM
 *
 * Based off https://github.com/guillaumervls/react-infinite-scroll
 */

var React = require('react');

var PropTypes = React.PropTypes;

var InfiniteScroll = React.createClass({
  propTypes: {
    // Whether or not to listen for scroll and resize events. Set this to `true`
    // when you have loaded all the data already.
    hasMore: PropTypes.bool.isRequired,

    // If true, treat this element as the scroll container, and style it with
    // `overflow: auto`.
    // If false, `window` will be treated as the scroll container.
    isScrollContainer: PropTypes.bool,

    // Called when page is within `threshold` of the bottom.
    onRequestMoreItems: PropTypes.func.isRequired,
    threshold: PropTypes.number,
  },

  getDefaultProps() {
    return {
      hasMore: false,
      isScrollContainer: false,
      onRequestMoreItems: null,
      threshold: 250,
    };
  },

  componentDidMount() {
    this._attachListeners();
  },

  componentWillReceiveProps(nextProps) {
    if (!nextProps.hasMore) {
      this._detachListeners();
    }
  },

  componentWillUnmount() {
    this._detachListeners();
  },

  _getScrollNode() {
    return this.props.isScrollContainer ? this.getDOMNode() : window;
  },

  _attachListeners() {
    var scrollNode = this._getScrollNode();
    scrollNode.addEventListener('scroll', this._onScroll);
    window.addEventListener('resize', this._onScroll);
    this._onScroll();
  },

  _detachListeners() {
    var scrollNode = this._getScrollNode();
    scrollNode.removeEventListener('scroll', this._onScroll);
    window.removeEventListener('resize', this._onScroll);
  },

  render() {
    var style = this.props.isScrollContainer ? {overflow: 'auto'} : null;
    return (
      <div
        className={this.props.className}
        style={style}>
        {this.props.children}
      </div>
    );
  },

  _onScroll() {
    var el = this.getDOMNode();
    var isPastThreshold = false;
    var height = null;

    if (this.props.isScrollContainer) {
      height = el.scrollHeight;
      // ScrollTop + offsetHeight is within threshold of scrollHeight
      isPastThreshold = (el.scrollHeight -
        el.offsetHeight -
        el.scrollTop
      ) < Number(this.props.threshold);
    } else {
      height = el.offsetHeight;
      isPastThreshold = (
        getAbsoluteOffsetTop(el) +
        el.offsetHeight -
        getWindowScrollTop() -
        window.innerHeight
      ) < Number(this.props.threshold);
    }

    if ((!this.lastHeight || this.lastHeight < height) && isPastThreshold) {
      // call loadMore after _detachListeners to allow
      // for non-async loadMore functions
      this.props.onRequestMoreItems && this.props.onRequestMoreItems();
      this.lastHeight = height;
    }
  },
});

function getAbsoluteOffsetTop(element) {
  if (!element) {
    return 0;
  }
  return element.offsetTop + getAbsoluteOffsetTop(element.offsetParent);
}

function getWindowScrollTop() {
  return (window.pageYOffset !== undefined) ?
    window.pageYOffset :
    (document.documentElement ||
      document.body.parentNode ||
      document.body).scrollTop;
}

module.exports = InfiniteScroll;

@@ -388,218 +388,8 @@
 d,%0A%0A
-    // If true, treat this element as the scroll container, and style it with%0A    // %60overflow: auto%60.%0A    // If false, %60window%60 will be treated as the scroll container.%0A    isScrollContainer: PropTypes.bool,%0A%0A
     
@@ -496,16 +496,46 @@
 quired,%0A
+    onScroll: PropTypes.func,%0A
     thre
@@ -963,227 +963,27 @@
 %0A  _
-getScrollNode() %7B%0A    return this.props.isScrollContainer ? this.getDOMNode() : window;%0A  %7D,%0A%0A  _attachListeners() %7B%0A    var scrollNode = this._getScrollNode();%0A    scrollNode.addEventListener('scroll', this._onScroll);
+attachListeners() %7B
 %0A   
@@ -1019,32 +1019,30 @@
 ize', this._
-onScroll
+update
 );%0A    this.
@@ -1042,24 +1042,22 @@
   this._
-onScroll
+update
 ();%0A  %7D,
@@ -1085,114 +1085,8 @@
 ) %7B%0A
-    var scrollNode = this._getScrollNode();%0A    scrollNode.removeEventListener('scroll', this._onScroll);%0A
     
@@ -1128,24 +1128,22 @@
 , this._
-onScroll
+update
 );%0A  %7D,%0A
@@ -1149,228 +1149,100 @@
 %0A%0A  
-render() %7B%0A    var style = this.props.isScrollContainer ? %7Boverflow: 'auto'%7D : null;%0A    return (%0A      %3Cdiv%0A        className=%7Bthis.props.className%7D%0A        style=%7Bstyle%7D%3E%0A        %7Bthis.props.children%7D%0A      %3C/div%3E%0A    
+_onScroll(event) %7B%0A    this.props.onScroll && this.props.onScroll(event);%0A%0A    this._update(
 );%0A 
@@ -1249,24 +1249,22 @@
  %7D,%0A%0A  _
-onScroll
+update
 () %7B%0A   
@@ -1304,103 +1304,8 @@
 var 
-isPastThreshold = false;%0A    var height = null;%0A%0A    if (this.props.isScrollContainer) %7B%0A      
 heig
@@ -1322,26 +1322,24 @@
 rollHeight;%0A
-  
     // Scrol
@@ -1394,25 +1394,27 @@
 lHeight%0A    
- 
+var
  isPastThres
@@ -1441,26 +1441,24 @@
 ght -%0A      
-  
 el.offsetHei
@@ -1459,26 +1459,24 @@
 setHeight -%0A
-  
       el.scr
@@ -1482,26 +1482,24 @@
 rollTop%0A    
-  
 ) %3C Number(t
@@ -1523,244 +1523,8 @@
 ld);
-%0A    %7D else %7B%0A      height = el.offsetHeight;%0A      isPastThreshold = (%0A        getAbsoluteOffsetTop(el) +%0A        el.offsetHeight -%0A        getWindowScrollTop() -%0A        window.innerHeight%0A      ) %3C Number(this.props.threshold);%0A    %7D
 %0A%0A  
@@ -1809,16 +1809,281 @@
   %7D%0A  %7D,
+%0A%0A  render() %7B%0A    var style = this.props.isScrollContainer ? %7Boverflow: 'auto'%7D : null;%0A    return (%0A      %3Cdiv%0A        className=%7Bthis.props.className%7D%0A        onScroll=%7Bthis._onScroll%7D%0A        style=%7Bstyle%7D%3E%0A        %7Bthis.props.children%7D%0A      %3C/div%3E%0A    );%0A  %7D,
 %0A%7D);%0A%0Afu

Remove InfiniteScroll.isScrollContainer