Skip to content

Commit e577349

Browse files
author
Chris Conley
committed
Adds transpiled lib folder
1 parent 74d2c2d commit e577349

14 files changed

+419
-12
lines changed

.babelrc

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"presets": ["react", "es2015"]
3+
}

.gitignore

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
# Logs
2+
logs
3+
*.log
4+
5+
# Runtime data
6+
pids
7+
*.pid
8+
*.seed
9+
10+
# Coverage tools
11+
lib-cov
12+
coverage
13+
14+
# Dependency directory
15+
node_modules
16+
bower_components
17+
18+
# Publish directory
19+
.publish
20+
21+
# Other
22+
.DS_Store

dist/redux-infinite-scroll.js

Lines changed: 22 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/redux-infinite-scroll.min.js

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
/******/ (function(modules) { // webpackBootstrap
2+
/******/ // The module cache
3+
/******/ var installedModules = {};
4+
5+
/******/ // The require function
6+
/******/ function __webpack_require__(moduleId) {
7+
8+
/******/ // Check if module is in cache
9+
/******/ if(installedModules[moduleId])
10+
/******/ return installedModules[moduleId].exports;
11+
12+
/******/ // Create a new module (and put it into the cache)
13+
/******/ var module = installedModules[moduleId] = {
14+
/******/ exports: {},
15+
/******/ id: moduleId,
16+
/******/ loaded: false
17+
/******/ };
18+
19+
/******/ // Execute the module function
20+
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
21+
22+
/******/ // Flag the module as loaded
23+
/******/ module.loaded = true;
24+
25+
/******/ // Return the exports of the module
26+
/******/ return module.exports;
27+
/******/ }
28+
29+
30+
/******/ // expose the modules object (__webpack_modules__)
31+
/******/ __webpack_require__.m = modules;
32+
33+
/******/ // expose the module cache
34+
/******/ __webpack_require__.c = installedModules;
35+
36+
/******/ // __webpack_public_path__
37+
/******/ __webpack_require__.p = "";
38+
39+
/******/ // Load entry module and return exports
40+
/******/ return __webpack_require__(0);
41+
/******/ })
42+
/************************************************************************/
43+
/******/ ([
44+
/* 0 */
45+
/***/ function(module, exports, __webpack_require__) {
46+
47+
(function webpackMissingModule() { throw new Error("Cannot find module \"./src/ReduxInfiniteScroll.jsx\""); }());
48+
49+
50+
/***/ }
51+
/******/ ]);

karma.conf.js

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
module.exports = function(config) {
2+
config.set({
3+
browsers: ['PhantomJS'],
4+
files: [
5+
{ pattern: 'testing.webpack.js', watched: false }
6+
],
7+
frameworks: ['jasmine'],
8+
preprocessors: {
9+
'testing.webpack.js': ['webpack', 'sourcemap']
10+
},
11+
reporters: ['dots'],
12+
singleRun: true,
13+
webpack: {
14+
devtool: 'inline-source-map',
15+
module: {
16+
loaders: [
17+
{
18+
test: /\.jsx?$/,
19+
exclude: /node_modules/,
20+
loader: 'babel'
21+
}
22+
]
23+
},
24+
resolve: {
25+
extensions: ['', '.js', '.jsx']
26+
},
27+
watch: true
28+
},
29+
webpackServer: {
30+
noInfo: true
31+
},
32+
webpackMiddleware: {
33+
noInfo: true
34+
}
35+
});
36+
};

lib/ReduxInfiniteScroll.js

Lines changed: 162 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,162 @@
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+
};

lib/Utilities/DOMPositionUtils.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
"use strict";
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
exports.topPosition = topPosition;
7+
function topPosition(domElt) {
8+
if (!domElt) {
9+
return 0;
10+
}
11+
return domElt.offsetTop + topPosition(domElt.offsetParent);
12+
}

main.webpack.js

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
var path = require('path');
2+
var webpack = require('webpack');
3+
4+
var config = module.exports = {
5+
context: __dirname,
6+
entry: ['./src/ReduxInfiniteScroll.jsx']
7+
};
8+
9+
config.output = {
10+
path: path.join(__dirname, 'dist'),
11+
12+
filename: 'redux-infinite-scroll.js'
13+
};
14+
15+
config.module = {
16+
loaders: []
17+
};
18+
19+
config.plugins = [];
20+
21+
config.resolve = {
22+
// tell webpack which extensions to auto search when it resolves modules. With this,
23+
// you'll be able to do `require('./utils')` instead of `require('./utils.js')`
24+
extensions: ['', '.js', '.jsx'],
25+
// by default, webpack will search in `web_modules` and `node_modules`. Because we're using
26+
// Bower, we want it to look in there too
27+
modulesDirectories: [ 'node_modules']
28+
};

package.json

Lines changed: 34 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,15 @@
11
{
22
"name": "redux-infinite-scroll",
3-
"version": "1.0.0",
3+
"version": "1.0.2",
44
"description": "React infinite scroll component designed for a Redux data-flow.",
5-
"main": "index.js",
5+
"main": "lib/ReduxInfiniteScroll.js",
66
"scripts": {
7-
"test": "test"
7+
"test": "karma start karma.conf.js",
8+
"test-watch": "karma start karma.conf.js --single-run=false",
9+
"test-single": "karma start karma.conf.js",
10+
"transpile": "babel src --out-dir lib",
11+
"build": "webpack --config production.webpack.js",
12+
"build-prod": "webpack --config lib.webpack.js"
813
},
914
"repository": {
1015
"type": "git",
@@ -21,5 +26,30 @@
2126
"bugs": {
2227
"url": "https://github.com/RealScout/redux-infinite-scroll/issues"
2328
},
24-
"homepage": "https://github.com/RealScout/redux-infinite-scroll#readme"
29+
"homepage": "https://github.com/RealScout/redux-infinite-scroll#readme",
30+
"devDependencies": {
31+
"react": "^0.14.6",
32+
"react-addons-test-utils": "^0.14.6",
33+
"react-dom": "^0.14.6",
34+
"babel": "^6.3.26",
35+
"babel-core": "^6.3.15",
36+
"babel-loader": "^6.2.0",
37+
"babel-plugin-react-transform": "^2.0.0-beta1",
38+
"babel-preset-es2015": "^6.3.13",
39+
"babel-preset-react": "^6.3.13",
40+
"lodash": "~3.1.0",
41+
"webpack": "^1.12.9",
42+
"jasmine": "^2.3.2",
43+
"jasmine-core": "^2.3.4",
44+
"karma": "^0.13.10",
45+
"karma-cli": "^0.1.1",
46+
"karma-jasmine": "^0.3.6",
47+
"karma-phantomjs-launcher": "^0.2.1",
48+
"karma-sourcemap-loader": "^0.3.6",
49+
"karma-webpack": "^1.7.0",
50+
"phantomjs": "^1.9.18",
51+
"webpack-dev-middleware": "^1.4.0",
52+
"webpack-dev-server": "^1.10.1",
53+
"webpack-hot-middleware": "^2.6.0"
54+
}
2555
}

production.webpack.js

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
var webpack = require('webpack');
2+
var _ = require('lodash');
3+
var path = require('path');
4+
var config = module.exports = require('./main.webpack.js');
5+
6+
config.output = _.merge(config.output, {
7+
filename: 'redux-infinite-scroll.min.js'
8+
});
9+
10+
config.module.loaders.push(
11+
{
12+
test: /\.jsx?$/,
13+
exclude: /node_modules/,
14+
loaders: ['babel-loader']
15+
}
16+
);
17+
18+
config.plugins.push(
19+
//new webpack.optimize.UglifyJsPlugin({minimize: true}),
20+
new webpack.optimize.OccurenceOrderPlugin()
21+
);

0 commit comments

Comments
 (0)