Commit 4914ba6d authored by Matthew Taylor's avatar Matthew Taylor

Use `formatNumber` to localize project count

`toLocaleString()` is not supported in Safari, but react-intl has a polyfill, and so it is. This also localized the intro description string, which wasn't previously. This also fixes #366 by doing as @rschamp suggested and checking if the count is the default count before setting the value.
parent 3c307e17
......@@ -25,9 +25,11 @@ var Intro = React.createClass({
'intro.joinScratch': 'JOIN SCRATCH',
'intro.seeExamples': 'SEE EXAMPLES',
'intro.tagLine': 'Create stories, games, and animations<br /> Share with others around the world',
'intro.tryItOut': 'TRY IT OUT'
'intro.tryItOut': 'TRY IT OUT',
'intro.description': 'A creative learning community with <span class="project-count"> ' +
'over 13 million </span>projects shared'
},
projectCount: 10569070,
projectCount: 13000000,
session: {}
};
},
......@@ -113,11 +115,8 @@ var Intro = React.createClass({
onRequestClose={this.closeRegistration}
onRegistrationDone={this.completeRegistration} />
</div>
<div className="description">
A creative learning community with
<span className="project-count"> {this.props.projectCount.toLocaleString()} </span>
projects shared
</div>
<div className="description"
dangerouslySetInnerHTML={{__html: this.props.messages['intro.description']}}></div>
<div className="links">
<a href="/about/">
{this.props.messages['intro.aboutScratch']}
......
......@@ -18,6 +18,8 @@
"intro.seeExamples": "SEE EXAMPLES",
"intro.tagLine": "Create stories, games, and animations<br /> Share with others around the world",
"intro.tryItOut": "TRY IT OUT",
"intro.description": "A creative learning community with <span class=\"project-count\"> {value} </span>projects shared",
"intro.defaultDescription": "A creative learning community with <span class=\"project-count\"> over 13 million </span>projects shared",
"news.scratchNews": "Scratch News",
......
......@@ -29,7 +29,7 @@ var Splash = injectIntl(React.createClass({
],
getInitialState: function () {
return {
projectCount: 'over 13 million', // gets the shared project count
projectCount: 13000000, // gets the shared project count
activity: [], // recent social actions taken by users someone is following
news: [], // gets news posts from the scratch Tumblr
featuredCustom: {}, // custom homepage rows, such as "Projects by Scratchers I'm Following"
......@@ -326,8 +326,9 @@ var Splash = injectIntl(React.createClass({
var emailConfirmationStyle = {width: 500, height: 330, padding: 1};
var homepageCacheState = this.getHomepageRefreshStatus();
var formatMessage = this.props.intl.formatMessage;
var formatHTMLMessage = this.props.intl.formatHTMLMessage;
var formatNumber = this.props.intl.formatNumber;
var formatMessage = this.props.intl.formatMessage;
var messages = {
'general.viewAll': formatMessage({id: 'general.viewAll'}),
'news.scratchNews': formatMessage({id: 'news.scratchNews'}),
......@@ -343,6 +344,12 @@ var Splash = injectIntl(React.createClass({
'intro.tagLine': formatHTMLMessage({id: 'intro.tagLine'}),
'intro.tryItOut': formatMessage({id: 'intro.tryItOut'})
};
if (this.state.projectCount === this.getInitialState().projectCount) {
messages['intro.description'] = formatHTMLMessage({id: 'intro.defaultDescription'});
} else {
var count = formatNumber(this.state.projectCount);
messages['intro.description'] = formatHTMLMessage({id: 'intro.description'}, {value: count});
}
return (
<div className="splash">
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment