Merge pull request #7 from MyEtherWallet/more_translations

More translations
This commit is contained in:
Daniel Kaspo 2017-05-31 00:37:46 -04:00 committed by GitHub
commit 083b7c5caa
5 changed files with 46 additions and 52 deletions

View File

@ -1,14 +1,12 @@
import React, {Component} from 'react' import React, {Component} from 'react';
import translate from 'translations';
export default class Footer extends Component { export default class Footer extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
} }
shouldComponentUpdate() {
return false
}
render() { render() {
return ( return (
<footer role="contentinfo" aria-label="footer"> <footer role="contentinfo" aria-label="footer">
@ -23,11 +21,12 @@ export default class Footer extends Component {
height="55px" width="auto" alt="Ether Wallet"/> height="55px" width="auto" alt="Ether Wallet"/>
</a> </a>
</p> </p>
<p><span>Open-Source, client-side tool for easily & securely interacting with the Ethereum network.</span> <p><span>{translate('FOOTER_1')}</span>
<span>Created by</span> <span>{translate('FOOTER_1b')}</span>
<a aria-label="kvhnuke's github" <a aria-label="kvhnuke's github"
href="https://github.com/kvhnuke" href="https://github.com/kvhnuke"
target="_blank">kvhnuke</a> & target="_blank">kvhnuke</a>
{' & '}
<a aria-label="tayvano's github" <a aria-label="tayvano's github"
href="https://github.com/tayvano" href="https://github.com/tayvano"
target="_blank">tayvano</a>. target="_blank">tayvano</a>.
@ -35,7 +34,7 @@ export default class Footer extends Component {
<br/> <br/>
</div> </div>
<div className="col-sm-6 footer-2"> <div className="col-sm-6 footer-2">
<h5><i aria-hidden="true">💝</i> Donations are always appreciated!</h5> <h5><i aria-hidden="true">💝</i>{translate('FOOTER_2')}</h5>
<ul> <ul>
<li> ETH: <span <li> ETH: <span
className="mono wrap">0x7cB57B5A97eAbe94205C07890BE4c1aD31E486A8</span> className="mono wrap">0x7cB57B5A97eAbe94205C07890BE4c1aD31E486A8</span>
@ -43,8 +42,7 @@ export default class Footer extends Component {
<li> BTC: <span className="mono wrap">1MEWT2SGbqtz6mPCgFcnea8XmWV5Z4Wc6</span></li> <li> BTC: <span className="mono wrap">1MEWT2SGbqtz6mPCgFcnea8XmWV5Z4Wc6</span></li>
</ul> </ul>
<h5><i aria-hidden="true">👫</i> You can also support us by supporting our <h5><i aria-hidden="true">👫</i>{translate('ADD_Warning_1')}</h5>
blockchain-family.</h5>
<p>Consider using our affiliate links to...</p> <p>Consider using our affiliate links to...</p>
<ul> <ul>
<li><a aria-label="Swap Ether or Bitcoin via Bity.com" <li><a aria-label="Swap Ether or Bitcoin via Bity.com"
@ -57,15 +55,6 @@ export default class Footer extends Component {
TREZOR</a> TREZOR</a>
</li> </li>
</ul> </ul>
<ul>
<li>
{/*<span translate="TranslatorName_1"></span>*/}
{/*<span translate="TranslatorName_2"></span>*/}
{/*<span translate="TranslatorName_3"></span>*/}
{/*<span translate="TranslatorName_4"></span>*/}
{/*<span translate="TranslatorName_5"></span>*/}
</li>
</ul>
</div> </div>
<div className="col-sm-3 footer-3"> <div className="col-sm-3 footer-3">
<h5><i aria-hidden="true">🌎</i> On the Web</h5> <h5><i aria-hidden="true">🌎</i> On the Web</h5>

View File

@ -27,11 +27,12 @@ const tabs = [
name: 'NAV_Help', name: 'NAV_Help',
link: 'help' link: 'help'
} }
] ];
export default class TabsOptions extends Component { export default class TabsOptions extends Component {
constructor(props) { constructor(props) {
super(props) super(props);
this.state = { this.state = {
showLeftArrow: false, showLeftArrow: false,
showRightArrow: false showRightArrow: false
@ -47,7 +48,6 @@ export default class TabsOptions extends Component {
scrollRight() { scrollRight() {
} }
render() { render() {
return ( return (
<div> <div>
@ -61,11 +61,12 @@ export default class TabsOptions extends Component {
<ul className='nav-inner'> <ul className='nav-inner'>
{ {
tabs.map((object, i) => { tabs.map((object, i) => {
// if the window pathname is the same or similar to the tab objects name, set the active toggle
const activeOrNot = (window.location.pathname === object.name || window.location.pathname.substring(1) === object.name) ? 'active' : '';
return ( return (
<li className='nav-item' <li className={`nav-item ${activeOrNot}`}
key={i} key={i} onClick={this.tabClick(i)}>
onClick={this.tabClick(i)}> <Link to={object.link}
<Link to={object.link} key={i}
aria-label={`nav item: ${translate(object.name)}`}> aria-label={`nav item: ${translate(object.name)}`}>
{translate(object.name)} {translate(object.name)}
</Link> </Link>
@ -80,9 +81,8 @@ export default class TabsOptions extends Component {
this.state.showRightArrow && this.state.showRightArrow &&
<a aria-hidden='true' <a aria-hidden='true'
className='nav-arrow-right' className='nav-arrow-right'
onClick={() => this.scrollRight(100)} onClick={() => this.scrollRight(100)}>&#187;</a>
ng-mouseover='scrollHoverIn(false,2);' ng-mouseleave='scrollHoverOut()'>&#187;</a }
>}
</nav> </nav>
</div> </div>

View File

@ -57,7 +57,7 @@ class App extends Component {
<main> <main>
<Header {...headerProps} /> <Header {...headerProps} />
<div className="main-content"> <div className="main-content">
{children} {React.cloneElement(children, { languageSelection })}
</div> </div>
<Footer /> <Footer />
</main> </main>

View File

@ -1,17 +1,17 @@
import React, {Component} from 'react'; import React, {Component} from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import {Field, reduxForm} from 'redux-form'; import {Field, reduxForm} from 'redux-form';
import GenerateWalletPasswordInputComponent from './GenerateWalletPasswordInputComponent'; import GenerateWalletPasswordInputComponent from './GenerateWalletPasswordInputComponent';
import LedgerTrezorWarning from './LedgerTrezorWarning'; import LedgerTrezorWarning from './LedgerTrezorWarning';
import translate from 'translations';
// VALIDATORS // VALIDATORS
const minLength = min => value => { const minLength = min => value => {
return value && value.length < min ? `Must be ${min} characters or more` : undefined return value && value.length < min ? `Must be ${min} characters or more` : undefined
} };
const minLength9 = minLength(9) const minLength9 = minLength(9);
const required = value => value ? undefined : 'Required' const required = value => value ? undefined : 'Required';
class GenerateWalletPasswordComponent extends Component { class GenerateWalletPasswordComponent extends Component {
@ -40,8 +40,8 @@ class GenerateWalletPasswordComponent extends Component {
} }
downloaded() { downloaded() {
let nextState = this.state let nextState = this.state;
nextState.hasDownloadedWalletFile = true nextState.hasDownloadedWalletFile = true;
this.setState(nextState) this.setState(nextState)
} }
@ -73,9 +73,9 @@ class GenerateWalletPasswordComponent extends Component {
!generateWalletFile && ( !generateWalletFile && (
<div> <div>
<section className="row"> <section className="row">
<h1 aria-live="polite">Generate Wallet</h1> <h1 aria-live="polite">{translate('NAV_GenerateWallet')}</h1>
<div className="col-sm-8 col-sm-offset-2"> <div className="col-sm-8 col-sm-offset-2">
<h4>Enter a strong password (at least 9 characters)</h4> <h4>{translate('HELP_1_Desc_3')}</h4>
<Field <Field
validate={[required, minLength9]} validate={[required, minLength9]}
component={GenerateWalletPasswordInputComponent} component={GenerateWalletPasswordInputComponent}
@ -87,7 +87,7 @@ class GenerateWalletPasswordComponent extends Component {
<button onClick={() => generateWalletFileAction()} <button onClick={() => generateWalletFileAction()}
disabled={generateWalletPassword ? generateWalletPassword.syncErrors : true} disabled={generateWalletPassword ? generateWalletPassword.syncErrors : true}
className="btn btn-primary btn-block"> className="btn btn-primary btn-block">
Generate Wallet {translate('NAV_GenerateWallet')}
</button> </button>
</div> </div>
</section> </section>
@ -98,25 +98,21 @@ class GenerateWalletPasswordComponent extends Component {
{ {
generateWalletFile && ( generateWalletFile && (
<section role="main" className="row"> <section role="main" className="row">
<h1>Save your Wallet File. Don't forget your password.</h1> <h1>{translate('GEN_Label_2')}</h1>
<br/> <br/>
<div className="col-sm-8 col-sm-offset-2"> <div className="col-sm-8 col-sm-offset-2">
<div aria-hidden="true" className="account-help-icon"><img <div aria-hidden="true" className="account-help-icon"><img
src="https://myetherwallet.com/images/icon-help.svg" className="help-icon"/> src="https://myetherwallet.com/images/icon-help.svg" className="help-icon"/>
<p className="account-help-text">This Keystore file matches the <p className="account-help-text">{translate('x_KeystoreDesc')}</p>
format used by Mist so you can easily import it in the future. It is the <h4>{translate('x_Keystore2')}</h4>
recommended file to download and back up.</p>
<h4>Keystore File (UTC / JSON)</h4>
</div> </div>
<a role="button" className="btn btn-primary btn-block" <a role="button" className="btn btn-primary btn-block"
href="blob:https://myetherwallet.com/2455ae32-916f-4224-a806-414bbe680168" href="blob:https://myetherwallet.com/2455ae32-916f-4224-a806-414bbe680168"
download="UTC--2017-04-26T23-07-03.538Z--c5b7fff4e1669e38e8d6bc8fffe7e562b2b70f43" download="UTC--2017-04-26T23-07-03.538Z--c5b7fff4e1669e38e8d6bc8fffe7e562b2b70f43"
aria-label="Download Keystore File (UTC / JSON · Recommended · Encrypted)" aria-label="Download Keystore File (UTC / JSON · Recommended · Encrypted)"
aria-describedby="x_KeystoreDesc" aria-describedby="x_KeystoreDesc"
onClick={() => generateWalletHasDownloadedFileAction()}>Download</a> onClick={() => generateWalletHasDownloadedFileAction()}>{translate('x_Download')}</a>
<p className="sr-only" id="x_KeystoreDesc">This Keystore file matches <p className="sr-only" id="x_KeystoreDesc">{translate('x_KeystoreDesc')}</p>
the format used by Mist so you can easily import it in the future. It is the
recommended file to download and back up.</p>
<br/><br/><br/><br/> <br/><br/><br/><br/>
</div> </div>
<div className="col-xs-12 alert alert-danger"> <div className="col-xs-12 alert alert-danger">

View File

@ -4,19 +4,28 @@ import React from 'react';
const BOLD_REGEXP = /(\*\*)(.*?)\1/; const BOLD_REGEXP = /(\*\*)(.*?)\1/;
const LINK_REGEXP = /\[([^\[]+)\]\(([^\)]+)\)/; const LINK_REGEXP = /\[([^\[]+)\]\(([^\)]+)\)/;
function decodeHTMLEntities(text) {
var entities = [['amp', '&'], ['lt', '<'], ['gt', '>']];
for (var i = 0, max = entities.length; i < max; ++i)
text = text.replace(new RegExp('&' + entities[i][0] + ';', 'g'), entities[i][1]);
return text;
}
function linkify(mdString: string) { function linkify(mdString: string) {
const parts = mdString.split(LINK_REGEXP); const parts = mdString.split(LINK_REGEXP);
if (parts.length === 1) { if (parts.length === 1) {
return parts[0]; return decodeHTMLEntities(parts[0]);
} }
const result = []; const result = [];
let i = 0; let i = 0;
while (i + 1 < parts.length) { while (i + 1 < parts.length) {
result.push(parts[i]); result.push(decodeHTMLEntities(parts[i]));
result.push(<a href={parts[i + 2]} target="_blank">{parts[i + 1]}</a>); result.push(<a href={parts[i + 2]} target="_blank">{parts[i + 1]}</a>);
i += 3; i += 3;
} }
result.push(parts[parts.length - 1]); result.push(decodeHTMLEntities(parts[parts.length - 1]));
return result.filter(Boolean); return result.filter(Boolean);
} }