Merge pull request #390 from mewtaylor/issue/356-project-count

Fix GH-356: Use `formatNumber` to localize project count
This commit is contained in:
Matthew Taylor 2016-03-22 12:14:42 -04:00
commit faf3549509
3 changed files with 16 additions and 12 deletions

View file

@ -13,9 +13,6 @@ Modal.setAppElement(document.getElementById('view'));
var Intro = React.createClass({
type: 'Intro',
propTypes: {
projectCount: React.PropTypes.number
},
getDefaultProps: function () {
return {
messages: {
@ -25,9 +22,10 @@ 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,
session: {}
};
},
@ -113,11 +111,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']}

View file

@ -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",

View file

@ -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">