var connect = require('react-redux').connect;
var injectIntl = require('react-intl').injectIntl;
var React = require('react');
var api = require('../../lib/api');
var log = require('../../lib/log');
var render = require('../../lib/render.jsx');
var sessionActions = require('../../redux/session.js');
var Page = require('../../components/page/www/page.jsx');
var SplashPresentation = require('./presentation.jsx');
var Splash = injectIntl(React.createClass({
type: 'Splash',
getInitialState: function () {
return {
projectCount: 20000000, // gets the shared project count
activity: [], // recent social actions taken by users someone is following
news: [], // gets news posts from the scratch Tumblr
sharedByFollowing: [], // "Projects by Scratchers I'm Following"
lovedByFollowing: [], // "Projects Loved by Scratchers I'm Following"
inStudiosFollowing: [], // "Projects in Studios I'm Following"
featuredGlobal: {}, // global homepage rows, such as "Featured Projects"
emailConfirmationModalOpen: false, // flag that determines whether to show banner to request email conf.
refreshCacheStatus: 'notrequested'
};
},
getDefaultProps: function () {
return {
sessionStatus: sessionActions.Status.NOT_FETCHED,
user: {},
flags: {},
isEducator: false,
isAdmin: false
};
},
componentDidUpdate: function (prevProps) {
if (this.props.user != prevProps.user) {
if (this.props.user.username) {
this.getActivity(this.props.user.username);
this.getSharedByFollowing(this.props.user.token);
this.getInStudiosFollowing(this.props.user.token);
this.getLovedByFollowing(this.props.user.token);
this.getNews();
} else {
this.setState({sharedByFollowing: []});
this.setState({lovedByFollowing: []});
this.setState({inStudiosFollowing: []});
this.setState({activity: []});
this.setState({news: []});
this.getProjectCount();
}
if (this.shouldShowEmailConfirmation()) {
window.addEventListener('message', this.onMessage);
} else {
window.removeEventListener('message', this.onMessage);
}
}
},
componentDidMount: function () {
this.getFeaturedGlobal();
if (this.props.user.username) {
this.getActivity(this.props.user.username);
this.getSharedByFollowing(this.props.user.token);
this.getInStudiosFollowing(this.props.user.token);
this.getLovedByFollowing(this.props.user.token);
this.getNews();
} else {
this.getProjectCount();
}
},
getActivity: function (username) {
api({
uri: '/proxy/users/' + username + '/activity?limit=5'
}, function (err, body) {
if (!body) return log.error('No response body');
if (!err) return this.setState({activity: body});
}.bind(this));
},
getFeaturedGlobal: function () {
api({
uri: '/proxy/featured'
}, function (err, body) {
if (!body) return log.error('No response body');
if (!err) return this.setState({featuredGlobal: body});
}.bind(this));
},
getSharedByFollowing: function (token) {
api({
uri: '/projects/following/users',
authentication: token
}, function (err, body) {
if (!body) return log.error('No response body');
if (!err) return this.setState({sharedByFollowing: body});
}.bind(this));
},
getInStudiosFollowing: function (token) {
api({
uri: '/projects/following/studios',
authentication: token
}, function (err, body) {
if (!body) return log.error('No response body');
if (!err) return this.setState({inStudiosFollowing: body});
}.bind(this));
},
getLovedByFollowing: function (token) {
api({
uri: '/projects/following/loves',
authentication: token
}, function (err, body) {
if (!body) return log.error('No response body');
if (!err) return this.setState({lovedByFollowing: body});
}.bind(this));
},
getNews: function () {
api({
uri: '/news?limit=3'
}, function (err, body) {
if (!body) return log.error('No response body');
if (!err) return this.setState({news: body});
}.bind(this));
},
getProjectCount: function () {
api({
uri: '/projects/count/all'
}, function (err, body) {
if (!body) return log.error('No response body');
if (!err) return this.setState({projectCount: body.count});
}.bind(this));
},
refreshHomepageCache: function () {
api({
host: '',
uri: '/scratch_admin/homepage/clear-cache/',
method: 'post',
useCsrf: true
}, function (err, body) {
if (err) return this.setState({refreshCacheStatus: 'fail'});
if (!body) return log.error('No response body');
if (!body.success) return this.setState({refreshCacheStatus: 'inprogress'});
return this.setState({refreshCacheStatus: 'pass'});
}.bind(this));
},
getHomepageRefreshStatus: function () {
var status = {
status: this.state.refreshCacheStatus,
disabled: false,
content: 'Refresh'
};
if (this.state.refreshCacheStatus === 'inprogress') {
status.disabled = true;
status.content = 'In Progress';
} else if (this.state.refreshCacheStatus === 'pass') {
status.disabled = true;
status.content = 'Requested';
} else if (this.state.refreshCacheStatus == 'fail') {
status.disabled = false;
status.content = 'Error';
}
return status;
},
showEmailConfirmationModal: function () {
this.setState({emailConfirmationModalOpen: true});
},
hideEmailConfirmationModal: function () {
this.setState({emailConfirmationModalOpen: false});
},
handleDismiss: function (cue) {
api({
host: '',
uri: '/site-api/users/set-template-cue/',
method: 'post',
useCsrf: true,
json: {cue: cue, value: false}
}, function (err) {
if (!err) this.props.dispatch(sessionActions.refreshSession());
}.bind(this));
},
shouldShowWelcome: function () {
if (!this.props.user || !this.props.flags.show_welcome) return false;
return (
new Date(this.props.user.dateJoined) >
new Date(new Date - 2*7*24*60*60*1000) // Two weeks ago
);
},
shouldShowEmailConfirmation: function () {
return (
this.props.user && this.props.flags.has_outstanding_email_confirmation &&
this.props.flags.confirm_email_banner);
},
render: function () {
var showEmailConfirmation = this.shouldShowEmailConfirmation() || false;
var showWelcome = this.shouldShowWelcome();
var homepageRefreshStatus = this.getHomepageRefreshStatus();
return (
);
}
}));
var mapStateToProps = function (state) {
return {
sessionStatus: state.session.status,
user: state.session.session.user,
flags: state.session.session.flags,
isEducator: state.permissions.educator,
isAdmin: state.permissions.admin
};
};
var ConnectedSplash = connect(mapStateToProps)(Splash);
render(, document.getElementById('app'));