Merge branch 'dev'

appbaseio · May 3, 2017 · 28789a0 · 28789a0
2 parents a5cad18 + 02fa3af
commit 28789a0
Show file tree

Hide file tree

Showing 14 changed files with 94 additions and 79 deletions.
diff --git a/app/actuators/ResultCard.js b/app/actuators/ResultCard.js
@@ -565,19 +565,15 @@ export default class ResultCard extends Component {
 		function setScroll(node) {
 			if (node) {
 				node.addEventListener("scroll", () => {
-					if (this.state.requestOnScroll && $(node).scrollTop() + $(node).innerHeight() >= node.scrollHeight && this.state.resultStats.total > this.state.currentData.length && !this.state.queryStart) {
+					const scrollHeight = node.scrollHeight || node.scrollHeight === 0 ? node.scrollHeight : $(node).height();
+					if (this.state.requestOnScroll && $(node).scrollTop() + $(node).innerHeight() >= scrollHeight && this.state.resultStats.total > this.state.currentData.length && !this.state.queryStart) {
 						this.nextPage();
 					}
 				});
 			}
 		}
-
-		if (this.props.scrollOnWindow) {
-			$(window).on("scroll", () => {
-				if (this.state.requestOnScroll && $(window).scrollTop() + $(window).innerHeight() >= $(window).height() && this.state.resultStats.total > this.state.currentData.length && !this.state.queryStart) {
-					this.nextPage();
-				}
-			});
+		if (this.props.scrollOnTarget) {
+			setScroll.call(this, this.props.scrollOnTarget);
 		} else {
 			setScroll.call(this, this.listParentElement);
 			setScroll.call(this, this.listChildElement);
@@ -668,7 +664,10 @@ export default class ResultCard extends Component {
 ResultCard.propTypes = {
 	componentId: React.PropTypes.string,
 	appbaseField: React.PropTypes.string,
-	title: React.PropTypes.string,
+	title: React.PropTypes.oneOfType([
+		React.PropTypes.string,
+		React.PropTypes.element
+	]),
 	sortBy: React.PropTypes.oneOf(["asc", "desc", "default"]),
 	sortOptions: React.PropTypes.arrayOf(
 		React.PropTypes.shape({
@@ -699,7 +698,7 @@ ResultCard.propTypes = {
 		React.PropTypes.element
 	]),
 	react: React.PropTypes.object,
-	scrollOnWindow: React.PropTypes.bool
+	scrollOnTarget: React.PropTypes.object
 };
 
 ResultCard.defaultProps = {
@@ -736,5 +735,5 @@ ResultCard.types = {
 	showResultStats: TYPES.BOOLEAN,
 	onResultStats: TYPES.FUNCTION,
 	placeholder: TYPES.STRING,
-	scrollOnWindow: TYPES.BOOLEAN
+	scrollOnTarget: TYPES.OBJECT
 };
diff --git a/app/actuators/ResultList.js b/app/actuators/ResultList.js
@@ -568,19 +568,15 @@ export default class ResultList extends Component {
 		function setScroll(node) {
 			if (node) {
 				node.addEventListener("scroll", () => {
-					if (this.state.requestOnScroll && $(node).scrollTop() + $(node).innerHeight() >= node.scrollHeight && this.state.resultStats.total > this.state.currentData.length && !this.state.queryStart) {
+					const scrollHeight = node.scrollHeight || node.scrollHeight === 0 ? node.scrollHeight : $(node).height();
+					if (this.state.requestOnScroll && $(node).scrollTop() + $(node).innerHeight() >= scrollHeight && this.state.resultStats.total > this.state.currentData.length && !this.state.queryStart) {
 						this.nextPage();
 					}
 				});
 			}
 		}
-
-		if (this.props.scrollOnWindow) {
-			$(window).on("scroll", () => {
-				if (this.state.requestOnScroll && $(window).scrollTop() + $(window).innerHeight() >= $(window).height() && this.state.resultStats.total > this.state.currentData.length && !this.state.queryStart) {
-					this.nextPage();
-				}
-			});
+		if (this.props.scrollOnTarget) {
+			setScroll.call(this, this.props.scrollOnTarget);
 		} else {
 			setScroll.call(this, this.listParentElement);
 			setScroll.call(this, this.listChildElement);
@@ -671,7 +667,10 @@ export default class ResultList extends Component {
 ResultList.propTypes = {
 	componentId: React.PropTypes.string,
 	appbaseField: React.PropTypes.string,
-	title: React.PropTypes.string,
+	title: React.PropTypes.oneOfType([
+		React.PropTypes.string,
+		React.PropTypes.element
+	]),
 	sortBy: React.PropTypes.oneOf(["asc", "desc", "default"]),
 	sortOptions: React.PropTypes.arrayOf(
 		React.PropTypes.shape({
@@ -702,7 +701,7 @@ ResultList.propTypes = {
 		React.PropTypes.element
 	]),
 	react: React.PropTypes.object,
-	scrollOnWindow: React.PropTypes.bool
+	scrollOnTarget: React.PropTypes.object
 };
 
 ResultList.defaultProps = {
@@ -739,5 +738,5 @@ ResultList.types = {
 	showResultStats: TYPES.BOOLEAN,
 	onResultStats: TYPES.FUNCTION,
 	placeholder: TYPES.STRING,
-	scrollOnWindow: TYPES.BOOLEAN
+	scrollOnTarget: TYPES.OBJECT
 };
diff --git a/app/actuators/ViewSwitcher.js b/app/actuators/ViewSwitcher.js
@@ -49,11 +49,19 @@ export default class ViewSwitcher extends Component {
 
 	render() {
 		return (
-			<div className="rbc rbc-viewswitcher">
+			<div className="rbc rbc-viewswitcher" style={this.props.componentStyle}>
 				<div className="rbc-list-container">
 					{this.renderItems()}
 				</div>
 			</div>
 		);
 	}
 }
+
+ViewSwitcher.propTypes = {
+	componentStyle: React.PropTypes.object
+};
+
+ViewSwitcher.defaultProps = {
+	componentStyle: {}
+};
diff --git a/app/sensors/CategorySearch.js b/app/sensors/CategorySearch.js
@@ -325,7 +325,7 @@ export default class CategorySearch extends Component {
 		});
 
 		return (
-			<div className={`rbc rbc-categorysearch col s12 col-xs-12 card thumbnail ${cx}`}>
+			<div className={`rbc rbc-categorysearch col s12 col-xs-12 card thumbnail ${cx}`} style={this.props.componentStyle}>
 				{title}
 				<Select
 					isLoading={this.state.isLoadingOptions}
@@ -348,7 +348,10 @@ CategorySearch.propTypes = {
 		React.PropTypes.string,
 		React.PropTypes.arrayOf(React.PropTypes.string)
 	]),
-	title: React.PropTypes.string,
+	title: React.PropTypes.oneOfType([
+		React.PropTypes.string,
+		React.PropTypes.element
+	]),
 	categoryField: React.PropTypes.string,
 	placeholder: React.PropTypes.string,
 	defaultSelected: React.PropTypes.string,
@@ -359,13 +362,15 @@ CategorySearch.propTypes = {
 	highlightFields: React.PropTypes.oneOfType([
 		React.PropTypes.string,
 		React.PropTypes.arrayOf(React.PropTypes.string)
-	])
+	]),
+	componentStyle: React.PropTypes.object
 };
 
 // Default props value
 CategorySearch.defaultProps = {
 	placeholder: "Search",
-	highlight: false
+	highlight: false,
+	componentStyle: {}
 };
 
 // context type

diff --git a/app/sensors/DynamicRangeSlider.js b/app/sensors/DynamicRangeSlider.js
@@ -315,7 +315,7 @@ export default class DynamicRangeSlider extends Component {
 		});
 
 		return (
-			<div className={`rbc rbc-dynamicrangeslider card thumbnail col s12 col-xs-12 ${cx}`}>
+			<div className={`rbc rbc-dynamicrangeslider card thumbnail col s12 col-xs-12 ${cx}`} style={this.props.componentStyle}>
 				{title}
 				{histogram}
 				<div className="rbc-rangeslider-container col s12 col-xs-12">
@@ -338,7 +338,10 @@ export default class DynamicRangeSlider extends Component {
 DynamicRangeSlider.propTypes = {
 	componentId: React.PropTypes.string.isRequired,
 	appbaseField: React.PropTypes.string.isRequired,
-	title: React.PropTypes.string,
+	title: React.PropTypes.oneOfType([
+		React.PropTypes.string,
+		React.PropTypes.element
+	]),
 	stepValue: React.PropTypes.number,
 	showHistogram: React.PropTypes.bool,
 	rangeLabels: React.PropTypes.func,
@@ -351,13 +354,15 @@ DynamicRangeSlider.propTypes = {
 	react: React.PropTypes.object,
 	onValueChange: React.PropTypes.func,
 	interval: React.PropTypes.number,
+	componentStyle: React.PropTypes.object
 };
 
 DynamicRangeSlider.defaultProps = {
 	title: null,
 	stepValue: 1,
 	showHistogram: true,
-	interval: 1
+	interval: 1,
+	componentStyle: {}
 };
 
 // context type

diff --git a/app/sensors/MultiLevelMenu.js b/app/sensors/MultiLevelMenu.js
@@ -370,7 +370,7 @@ export default class MultiLevelMenu extends Component {
 		);
 
 		return (
-			<div className="rbc rbc-multilevelmenu-container card thumbnail col s12 col-xs-12" onMouseLeave={() => this.handleHover(null)}>
+			<div className="rbc rbc-multilevelmenu-container card thumbnail col s12 col-xs-12" style={this.props.componentStyle} onMouseLeave={() => this.handleHover(null)}>
 				<div className="rbc-multilevelmenu col s12 col-xs-12">
 					{listComponent}
 				</div>
@@ -392,14 +392,16 @@ MultiLevelMenu.propTypes = {
 	blacklist: React.PropTypes.arrayOf(React.PropTypes.string),
 	customQuery: React.PropTypes.func,
 	react: React.PropTypes.object,
-	onValueChange: React.PropTypes.func
+	onValueChange: React.PropTypes.func,
+	componentStyle: React.PropTypes.object
 };
 
 // Default props value
 MultiLevelMenu.defaultProps = {
 	blacklist: [],
 	maxCategories: 10,
-	maxItems: 4
+	maxItems: 4,
+	componentStyle: {}
 };
 
 // context type

diff --git a/app/sensors/NestedList.js b/app/sensors/NestedList.js
@@ -449,7 +449,7 @@ export default class NestedList extends Component {
 		});
 
 		return (
-			<div className="rbc rbc-nestedlist-container card thumbnail col s12 col-xs-12">
+			<div className="rbc rbc-nestedlist-container card thumbnail col s12 col-xs-12" style={this.props.componentStyle}>
 				<div className={`rbc rbc-nestedlist col s12 col-xs-12 ${cx}`}>
 					{title}
 					{searchComponent}
@@ -480,7 +480,8 @@ NestedList.propTypes = {
 		React.PropTypes.element
 	]),
 	react: React.PropTypes.object,
-	onValueChange: React.PropTypes.func
+	onValueChange: React.PropTypes.func,
+	componentStyle: React.PropTypes.object
 };
 
 // Default props value
@@ -490,7 +491,8 @@ NestedList.defaultProps = {
 	size: 100,
 	showSearch: false,
 	title: null,
-	placeholder: "Search"
+	placeholder: "Search",
+	componentStyle: {}
 };
 
 // context type

diff --git a/app/sensors/RatingsFilter.js b/app/sensors/RatingsFilter.js
@@ -133,7 +133,7 @@ export default class RatingsFilter extends Component {
 		});
 
 		return (
-			<div className={`rbc rbc-ratingsfilter col s12 col-xs-12 card thumbnail ${cx}`}>
+			<div className={`rbc rbc-ratingsfilter col s12 col-xs-12 card thumbnail ${cx}`} style={this.props.componentStyle}>
 				<div className="row">
 					{title}
 					<div className="col s12 col-xs-12 rbc-list-container">
@@ -148,16 +148,21 @@ export default class RatingsFilter extends Component {
 RatingsFilter.propTypes = {
 	componentId: React.PropTypes.string.isRequired,
 	appbaseField: React.PropTypes.string.isRequired,
-	title: React.PropTypes.string,
+	title: React.PropTypes.oneOfType([
+		React.PropTypes.string,
+		React.PropTypes.element
+	]),
 	data: React.PropTypes.any.isRequired,
 	defaultSelected: React.PropTypes.object,
 	customQuery: React.PropTypes.func,
-	onValueChange: React.PropTypes.func
+	onValueChange: React.PropTypes.func,
+	componentStyle: React.PropTypes.object
 };
 
 // Default props value
 RatingsFilter.defaultProps = {
-	title: null
+	title: null,
+	componentStyle: {}
 };
 
 // context type

diff --git a/app/sensors/TagCloud.js b/app/sensors/TagCloud.js
@@ -309,7 +309,7 @@ export default class TagCloud extends Component {
 		});
 
 		return (
-			<div className={`rbc rbc-tagcloud col s12 col-xs-12 card thumbnail ${cx}`}>
+			<div className={`rbc rbc-tagcloud col s12 col-xs-12 card thumbnail ${cx}`} style={this.props.componentStyle}>
 				{title}
 				<div className="rbc-list-container">
 					{this.renderTags()}
@@ -323,7 +323,10 @@ export default class TagCloud extends Component {
 TagCloud.propTypes = {
 	appbaseField: React.PropTypes.string.isRequired,
 	componentId: React.PropTypes.string.isRequired,
-	title: React.PropTypes.string,
+	title: React.PropTypes.oneOfType([
+		React.PropTypes.string,
+		React.PropTypes.element
+	]),
 	size: React.PropTypes.number,
 	showCount: React.PropTypes.bool,
 	multiSelect: React.PropTypes.bool,
@@ -338,14 +341,16 @@ TagCloud.propTypes = {
 		React.PropTypes.array
 	]),
 	react: React.PropTypes.object,
-	onValueChange: React.PropTypes.func
+	onValueChange: React.PropTypes.func,
+	componentStyle: React.PropTypes.object
 };
 
 TagCloud.defaultProps = {
 	showCount: true,
 	multiSelect: false,
 	size: 100,
-	title: null
+	title: null,
+	componentStyle: {}
 };
 
 TagCloud.contextTypes = {

diff --git a/app/sensors/ToggleList.js b/app/sensors/ToggleList.js
@@ -186,7 +186,7 @@ export default class ToggleList extends Component {
 		});
 
 		return (
-			<div className={`rbc rbc-togglelist col s12 col-xs-12 card thumbnail ${cx}`}>
+			<div className={`rbc rbc-togglelist col s12 col-xs-12 card thumbnail ${cx}`} style={this.props.componentStyle}>
 				<div className="row">
 					{title}
 					<div className="col s12 col-xs-12">
@@ -201,7 +201,10 @@ export default class ToggleList extends Component {
 ToggleList.propTypes = {
 	componentId: React.PropTypes.string.isRequired,
 	appbaseField: React.PropTypes.string.isRequired,
-	title: React.PropTypes.string,
+	title: React.PropTypes.oneOfType([
+		React.PropTypes.string,
+		React.PropTypes.element
+	]),
 	data: React.PropTypes.arrayOf(React.PropTypes.shape({
 		label: React.PropTypes.string.isRequired,
 		value: React.PropTypes.string.isRequired
@@ -212,12 +215,14 @@ ToggleList.propTypes = {
 	]),
 	multiSelect: React.PropTypes.bool,
 	customQuery: React.PropTypes.func,
-	onValueChange: React.PropTypes.func
+	onValueChange: React.PropTypes.func,
+	componentStyle: React.PropTypes.object
 };
 
 // Default props value
 ToggleList.defaultProps = {
-	multiSelect: true
+	multiSelect: true,
+	componentStyle: {}
 };
 
 // context type