diff --git a/src/components/carousel/carousel.jsx b/src/components/carousel/carousel.jsx index 3ee6e9968..07e4ed417 100644 --- a/src/components/carousel/carousel.jsx +++ b/src/components/carousel/carousel.jsx @@ -1,5 +1,7 @@ +var defaults = require('lodash.defaults'); var React = require('react'); var Slider = require('react-slick'); + var Thumbnail = require('../thumbnail/thumbnail.jsx'); require('slick-carousel/slick/slick.scss'); @@ -15,21 +17,23 @@ var Carousel = React.createClass({ return { items: require('./carousel.json'), showRemixes: false, - showLoves: false, - settings: { - arrows: true, - dots: false, - infinite: false, - lazyLoad: true, - slidesToShow: 5, - slidesToScroll: 5, - variableWidth: true - } + showLoves: false }; }, render: function () { + var settings = this.props.settings || {}; + defaults(settings, { + arrows: this.props.items.length > settings.slidesToShow, + dots: false, + infinite: false, + lazyLoad: true, + slidesToShow: 5, + slidesToScroll: 5, + variableWidth: true + }); + return ( - + {this.props.items.map(function (item) { var href = ''; switch (item.type) { diff --git a/src/views/splash/splash.jsx b/src/views/splash/splash.jsx index 1f2e69ed6..1157e1d4e 100644 --- a/src/views/splash/splash.jsx +++ b/src/views/splash/splash.jsx @@ -22,11 +22,6 @@ var Splash = injectIntl(React.createClass({ Api, Session ], - getDefaultProps: function () { - return { - slidesToShow: 5 - }; - }, getInitialState: function () { return { projectCount: 10569070, @@ -106,7 +101,7 @@ var Splash = injectIntl(React.createClass({ }, renderHomepageRows: function () { var formatMessage = this.props.intl.formatMessage; - var showArrows = true; + var rows = [ - + ]; if (this.state.featuredGlobal.curator_top_projects && this.state.featuredGlobal.curator_top_projects.length > 4) { - showArrows = this.state.featuredGlobal.curator_top_projects.length > this.props.slidesToShow; rows.push( + items={this.state.featuredGlobal.curator_top_projects} /> ); } @@ -146,7 +140,6 @@ var Splash = injectIntl(React.createClass({ if (this.state.featuredGlobal.scratch_design_studio && this.state.featuredGlobal.scratch_design_studio.length > 4) { - showArrows = this.state.featuredGlobal.scratch_design_studio.length > this.props.slidesToShow; rows.push( + items={this.state.featuredGlobal.scratch_design_studio} /> ); } @@ -168,7 +160,6 @@ var Splash = injectIntl(React.createClass({ this.state.featuredGlobal.community_newest_projects && this.state.featuredGlobal.community_newest_projects.length > 0) { - showArrows = this.state.featuredGlobal.community_newest_projects.length > this.props.slidesToShow; rows.push( + items={this.state.featuredGlobal.community_newest_projects} /> ); } @@ -186,7 +176,6 @@ var Splash = injectIntl(React.createClass({ if (this.state.featuredCustom.custom_projects_by_following && this.state.featuredCustom.custom_projects_by_following.length > 0) { - showArrows = this.state.featuredCustom.custom_projects_by_following.length > this.props.slidesToShow; rows.push( - + ); } if (this.state.featuredCustom.custom_projects_loved_by_following && this.state.featuredCustom.custom_projects_loved_by_following.length > 0) { - showArrows = this.state.featuredCustom.custom_projects_loved_by_following.length > this.props.slidesToShow; rows.push( - + ); } @@ -219,8 +205,6 @@ var Splash = injectIntl(React.createClass({ if (this.state.featuredCustom.custom_projects_in_studios_following && this.state.featuredCustom.custom_projects_in_studios_following.length > 0) { - showArrows = - this.state.featuredCustom.custom_projects_in_studios_following.length > this.props.slidesToShow; rows.push( - + ); }