add language support to latest features

This commit is contained in:
David Ralph
2020-12-04 11:42:13 +00:00
parent fc570089c2
commit ba843b44c4
5 changed files with 30 additions and 15 deletions

View File

@@ -12,8 +12,8 @@ export default class MainModal extends React.PureComponent {
constructor(...args) {
super(...args);
this.state = {
tab: <Settings language={this.props.language.settings} toastLanguage={this.props.language.toasts} />,
currentTab: 'settings'
tab: '',
currentTab: ''
};
this.tabs = {
settings: <Settings language={this.props.language.settings} toastLanguage={this.props.language.toasts} />,
@@ -25,6 +25,7 @@ export default class MainModal extends React.PureComponent {
componentDidMount() {
document.getElementById('backgroundImage').classList.toggle('backgroundEffects');
document.getElementById('center').classList.toggle('backgroundEffects');
this.setState({ tab: this.tabs.settings, currentTab: 'settings' });
}
componentWillUnmount() {

View File

@@ -34,13 +34,13 @@ export default class GreetingSettings extends React.PureComponent {
<Section title={this.props.language.greeting.title} name='greeting'>
<Checkbox name='events' text={this.props.language.greeting.events} />
<Checkbox name='defaultGreetingMessage' text={this.props.language.greeting.default} />
<Checkbox name='birthdayenabled' text='Birthday Enabled' />
<Checkbox name='birthdayenabled' text={this.props.language.greeting.birthday_enabled} />
<ul>
<p>{this.props.language.greeting.name} <span className='modalLink' onClick={() => this.resetItem()}>{this.props.language.reset}</span></p>
<input type='text' value={this.state.greetingName} onChange={(e) => this.setState({ greetingName: e.target.value })}></input>
</ul>
<ul>
<p>Birthday Date</p>
<p>{this.props.language.greeting.birthday_date}</p>
<DatePicker onChange={(data) => this.changeDate(data)} value={this.state.birthday}/>
</ul>
<Beforeunload onBeforeunload={() => this.beforeUnload()}/>

View File

@@ -52,24 +52,24 @@ export default class Settings extends React.PureComponent {
<Checkbox name='copyButton' text={this.props.language.quote.copy} />
<Checkbox name='tweetButton' text={this.props.language.quote.tweet} />
<Checkbox name='favouriteQuoteEnabled' text={this.props.language.quote.favourite} />
<Dropdown label='Language' name='quotelanguage' id='quotelanguage' onChange={() => localStorage.setItem('quotelanguage', document.getElementById('quotelanguage').value)}>
<Dropdown label={this.props.language.language} name='quotelanguage' id='quotelanguage' onChange={() => localStorage.setItem('quotelanguage', document.getElementById('quotelanguage').value)}>
<option className='choices' value='English'>English</option>
<option className='choices' value='French'>Français</option>
</Dropdown>
</Section>
<Section title='Date' name='date'>
<Checkbox name='short' text='Short Date' betaFeature={true} />
<Dropdown label='Short Format' name='dateFormat' id='dateformat' onChange={() => localStorage.setItem('dateFormat', document.getElementById('dateformat').value)}>
<Section title={this.props.language.date.title} name='date'>
<Checkbox name='short' text={this.props.language.date.short_date} betaFeature={true} />
<Dropdown label={this.props.language.date.short_format} name='dateFormat' id='dateformat' onChange={() => localStorage.setItem('dateFormat', document.getElementById('dateformat').value)}>
<option className='choices' value='DMY'>DMY</option>
<option className='choices' value='MDY'>MDY</option>
<option className='choices' value='YMD'>YMD</option>
</Dropdown>
<br/><br/>
<Dropdown label='Short Separator' name='shortFormat' id='shortformat' onChange={() => localStorage.setItem('shortFormat', document.getElementById('shortformat').value)}>
<option className='choices' value='default'>Default</option>
<option className='choices' value='dash'>Dash</option>
<option className='choices' value='gaps'>Gaps</option>
<Dropdown label={this.props.language.date.short_separator.title} name='shortFormat' id='shortformat' onChange={() => localStorage.setItem('shortFormat', document.getElementById('shortformat').value)}>
<option className='choices' value='default'>{this.props.language.date.short_separator.default}</option>
<option className='choices' value='dash'>{this.props.language.date.short_separator.dash}</option>
<option className='choices' value='gaps'>{this.props.language.date.short_separator.gaps}</option>
</Dropdown>
</Section>
@@ -82,7 +82,7 @@ export default class Settings extends React.PureComponent {
<Checkbox name='darkTheme' text={this.props.language.dark} />
<Checkbox name='brightnessTime' text={this.props.language.experimental.night_mode} betaFeature={true} />
<ul>
<p>Custom CSS <span className='modalLink' onClick={() => this.resetItem()}>{this.props.language.reset}</span> <span className='newFeature'> NEW</span></p>
<p>{this.props.language.custom_css} <span className='modalLink' onClick={() => this.resetItem()}>{this.props.language.reset}</span> <span className='newFeature'> NEW</span></p>
<textarea id='customcss'></textarea>
</ul>
</Section>