1+ 'use strict' ;
2+
3+ var _createClass = 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 ) ; } } return function ( Constructor , protoProps , staticProps ) { if ( protoProps ) defineProperties ( Constructor . prototype , protoProps ) ; if ( staticProps ) defineProperties ( Constructor , staticProps ) ; return Constructor ; } ; } ( ) ;
4+
5+ Object . defineProperty ( exports , "__esModule" , {
6+ value : true
7+ } ) ;
8+
9+ var _react = require ( 'react' ) ;
10+
11+ var _react2 = _interopRequireDefault ( _react ) ;
12+
13+ var _reactDom = require ( 'react-dom' ) ;
14+
15+ var _reactDom2 = _interopRequireDefault ( _reactDom ) ;
16+
17+ var _DOMPositionUtils = require ( './Utilities/DOMPositionUtils' ) ;
18+
19+ function _interopRequireDefault ( obj ) { return obj && obj . __esModule ? obj : { default : obj } ; }
20+
21+ function _classCallCheck ( instance , Constructor ) { if ( ! ( instance instanceof Constructor ) ) { throw new TypeError ( "Cannot call a class as a function" ) ; } }
22+
23+ function _possibleConstructorReturn ( self , call ) { if ( ! self ) { throw new ReferenceError ( "this hasn't been initialised - super() hasn't been called" ) ; } return call && ( typeof call === "object" || typeof call === "function" ) ? call : self ; }
24+
25+ function _inherits ( subClass , superClass ) { if ( typeof superClass !== "function" && superClass !== null ) { throw new TypeError ( "Super expression must either be null or a function, not " + typeof superClass ) ; } subClass . prototype = Object . create ( superClass && superClass . prototype , { constructor : { value : subClass , enumerable : false , writable : true , configurable : true } } ) ; if ( superClass ) Object . setPrototypeOf ? Object . setPrototypeOf ( subClass , superClass ) : subClass . __proto__ = superClass ; }
26+
27+ var ReduxInfiniteScroll = function ( _Component ) {
28+ _inherits ( ReduxInfiniteScroll , _Component ) ;
29+
30+ function ReduxInfiniteScroll ( props ) {
31+ _classCallCheck ( this , ReduxInfiniteScroll ) ;
32+
33+ var _this = _possibleConstructorReturn ( this , Object . getPrototypeOf ( ReduxInfiniteScroll ) . call ( this , props ) ) ;
34+
35+ _this . scrollFunction = _this . scrollListener . bind ( _this ) ;
36+ return _this ;
37+ }
38+
39+ _createClass ( ReduxInfiniteScroll , [ {
40+ key : 'componentDidMount' ,
41+ value : function componentDidMount ( ) {
42+ this . attachScrollListener ( ) ;
43+ }
44+ } , {
45+ key : 'componentDidUpdate' ,
46+ value : function componentDidUpdate ( ) {
47+ this . attachScrollListener ( ) ;
48+ }
49+ } , {
50+ key : '_findElement' ,
51+ value : function _findElement ( ) {
52+ return this . props . elementIsScrollable ? _reactDom2 . default . findDOMNode ( this ) : window ;
53+ }
54+ } , {
55+ key : 'attachScrollListener' ,
56+ value : function attachScrollListener ( ) {
57+ if ( ! this . props . hasMore || this . props . loadingMore ) return ;
58+ var el = this . _findElement ( ) ;
59+ el . addEventListener ( 'scroll' , this . scrollFunction , true ) ;
60+ el . addEventListener ( 'resize' , this . scrollFunction , true ) ;
61+ this . scrollListener ( ) ;
62+ }
63+ } , {
64+ key : '_elScrollListener' ,
65+ value : function _elScrollListener ( ) {
66+ var el = _reactDom2 . default . findDOMNode ( this ) ;
67+ var topScrollPos = el . scrollTop ;
68+ var totalContainerHeight = el . scrollHeight ;
69+ var containerFixedHeight = el . offsetHeight ;
70+ var bottomScrollPos = topScrollPos + containerFixedHeight ;
71+
72+ return totalContainerHeight - bottomScrollPos ;
73+ }
74+ } , {
75+ key : '_windowScrollListener' ,
76+ value : function _windowScrollListener ( ) {
77+ var el = _reactDom2 . default . findDOMNode ( this ) ;
78+ var windowScrollTop = window . pageYOffset !== undefined ? window . pageYOffset : ( document . documentElement || document . body . parentNode || document . body ) . scrollTop ;
79+ var elTotalHeight = ( 0 , _DOMPositionUtils . topPosition ) ( el ) + el . offsetHeight ;
80+ var currentBottomPosition = elTotalHeight - windowScrollTop - window . innerHeight ;
81+
82+ return currentBottomPosition ;
83+ }
84+ } , {
85+ key : 'scrollListener' ,
86+ value : function scrollListener ( ) {
87+ var _this2 = this ;
88+
89+ // This is to prevent the upcoming logic from toggling a load more before
90+ // redux has passed any data to the component
91+ if ( this . props . items <= 0 ) return ;
92+
93+ setTimeout ( function ( ) {
94+ var bottomPosition = _this2 . props . elementIsScrollable ? _this2 . _elScrollListener ( ) : _this2 . _windowScrollListener ( ) ;
95+
96+ if ( bottomPosition < Number ( _this2 . props . threshold ) ) {
97+ _this2 . detachScrollListener ( ) ;
98+ _this2 . props . loadMore ( ) ;
99+ }
100+ } , 0 ) ;
101+ }
102+ } , {
103+ key : 'detachScrollListener' ,
104+ value : function detachScrollListener ( ) {
105+ var el = this . _findElement ( ) ;
106+ el . removeEventListener ( 'scroll' , this . scrollFunction , true ) ;
107+ el . removeEventListener ( 'resize' , this . scrollFunction , true ) ;
108+ }
109+ } , {
110+ key : 'componentWillUnmount' ,
111+ value : function componentWillUnmount ( ) {
112+ this . detachScrollListener ( ) ;
113+ }
114+ } , {
115+ key : 'renderLoader' ,
116+ value : function renderLoader ( ) {
117+ return this . props . loadingMore && this . props . showLoader ? this . props . loader : undefined ;
118+ }
119+ } , {
120+ key : 'render' ,
121+ value : function render ( ) {
122+ return _react2 . default . createElement (
123+ 'div' ,
124+ { className : 'rs-infinite-scroll' , style : { height : this . props . containerHeight } } ,
125+ this . props . items . map ( function ( item , i ) {
126+ return item ;
127+ } ) ,
128+ this . renderLoader ( )
129+ ) ;
130+ }
131+ } ] ) ;
132+
133+ return ReduxInfiniteScroll ;
134+ } ( _react . Component ) ;
135+
136+ exports . default = ReduxInfiniteScroll ;
137+
138+ ReduxInfiniteScroll . propTypes = {
139+ elementIsScrollable : _react2 . default . PropTypes . bool ,
140+ containerHeight : _react2 . default . PropTypes . oneOfType ( [ _react2 . default . PropTypes . number , _react2 . default . PropTypes . string ] ) ,
141+ threshold : _react2 . default . PropTypes . number ,
142+ hasMore : _react2 . default . PropTypes . bool ,
143+ loadingMore : _react2 . default . PropTypes . bool ,
144+ loader : _react2 . default . PropTypes . any ,
145+ showLoader : _react2 . default . PropTypes . bool ,
146+ loadMore : _react2 . default . PropTypes . func . isRequired ,
147+ items : _react2 . default . PropTypes . array . isRequired
148+ } ;
149+
150+ ReduxInfiniteScroll . defaultProps = {
151+ elementIsScrollable : true ,
152+ containerHeight : '100%' ,
153+ threshold : 100 ,
154+ hasMore : true ,
155+ loadingMore : false ,
156+ loader : _react2 . default . createElement (
157+ 'div' ,
158+ { style : { 'text-align' : 'center' } } ,
159+ 'Loading...'
160+ ) ,
161+ showLoader : true
162+ } ;
0 commit comments