mirrors/mue
1
0
Fork 0
mirror of https://github.com/mue/mue.git synced 2026-07-14 12:34:03 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(translations): new translation system

Browse Source
This commit is contained in:
David Ralph
2021-09-10 16:38:53 +01:00
parent 941c168486
commit b0eeff1bf8
63 changed files with 651 additions and 593 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/widgets/background/Background.jsx
View File

@@ -1,4 +1,5 @@
// todo: rewrite this mess
import variables from 'modules/variables';
import { PureComponent } from 'react';
import PhotoInformation from './PhotoInformation';
@@ -23,7 +24,6 @@ export default class Background extends PureComponent {
photoURL: ''
}
};
this.language = window.language.widgets.background;
}
setBackground() {
@@ -134,12 +134,15 @@ export default class Background extends PureComponent {
let credit = data.photographer;
let photoURL, photographerURL;
const language = variables.language;
const languagecode = variables.languagecode;
if (backgroundAPI === 'unsplash') {
credit = data.photographer + ` ${this.language.unsplash}`;
credit = data.photographer + ` ${language.getMessage(languagecode, 'background.unsplash')}`;
photoURL = data.photo_page;
photographerURL = data.photographer_page;
} else if (backgroundAPI === 'pexels') {
credit = data.photographer + ` ${this.language.pexels}`;
credit = data.photographer + ` ${language.getMessage(languagecode, 'background.pexels')}`;
photoURL = data.photo_page;
photographerURL = data.photographer_page;
}

3
src/components/widgets/background/Favourite.jsx
View File

@@ -1,3 +1,4 @@
import variables from 'modules/variables';
import { PureComponent } from 'react';
import { Star, StarBorder } from '@material-ui/icons';
import Hotkeys from 'react-hot-keys';
@@ -57,7 +58,7 @@ export default class Favourite extends PureComponent {
}
return (
<Tooltip title={window.language.modals.main.settings.sections.background.buttons.favourite}>
<Tooltip title={variables.language.getMessage(variables.languagecode, 'modals.main.settings.sections.background.buttons.favourite')}>
{this.state.favourited}
{window.keybinds.favouriteBackground && window.keybinds.favouriteBackground !== '' ? <Hotkeys keyName={window.keybinds.favouriteBackground} onKeyDown={() => this.favourite()} /> : null}
</Tooltip>

3
src/components/widgets/background/Maximise.jsx
View File

@@ -1,3 +1,4 @@
import variables from 'modules/variables';
import { PureComponent } from 'react';
import { Fullscreen } from '@material-ui/icons';
import Hotkeys from 'react-hot-keys';
@@ -56,7 +57,7 @@ export default class Maximise extends PureComponent {
render() {
return (
<Tooltip title={window.language.modals.main.settings.sections.background.buttons.view}>
<Tooltip title={variables.language.getMessage(variables.languagecode, 'modals.main.settings.sections.background.buttons.view')}>
<Fullscreen onClick={this.maximise} className='topicons' />
{window.keybinds.maximiseBackground && window.keybinds.maximiseBackground !== '' ? <Hotkeys keyName={window.keybinds.maximiseBackground} onKeyDown={this.maximise} /> : null}
</Tooltip>

25
src/components/widgets/background/PhotoInformation.jsx
View File

@@ -1,3 +1,4 @@
import variables from 'modules/variables';
import { useState, Fragment } from 'react';
import { Info, LocationOn, PhotoCamera, Crop as Resolution, Person as Photographer, GetApp as Download } from '@material-ui/icons';
import Hotkeys from 'react-hot-keys';
@@ -26,26 +27,26 @@ export default function PhotoInformation({ info, url, api }) {
const [width, setWidth] = useState(0);
const [height, setHeight] = useState(0);
const language = window.language.widgets.background;
if (info.hidden === true || !info.credit) {
return null;
}
// remove unsplash and pexels text
const photographer = info.credit.split(` ${language.unsplash}`)[0].split(` ${language.pexels}`);
const unsplash = variables.language.getMessage(variables.languagecode, 'widgets.background.unsplash');
const pexels = variables.language.getMessage(variables.languagecode, 'widgets.background.pexels');
const photographer = info.credit.split(` ${unsplash}`)[0].split(` ${pexels}`);
let credit = info.credit;
let photo = language.credit;
let credit;
let photo;
// unsplash and pexels credit
if (info.photographerURL && info.photographerURL !== '' && !info.offline && api) {
if (api === 'unsplash') {
photo = <a href={info.photoURL + '?utm_source=mue'} target='_blank' rel='noopener noreferrer'>{language.credit}</a>;
credit = <><a href={info.photographerURL} target='_blank' rel='noopener noreferrer'>{photographer}</a> <a href='https://unsplash.com?utm_source=mue' target='_blank' rel='noopener noreferrer'>{language.unsplash}</a></>;
photo = <a href={info.photoURL + '?utm_source=mue'} target='_blank' rel='noopener noreferrer'>{variables.language.getMessage(variables.languagecode, 'widgets.background.credit')}</a>;
credit = <><a href={info.photographerURL} target='_blank' rel='noopener noreferrer'>{photographer}</a> <a href='https://unsplash.com?utm_source=mue' target='_blank' rel='noopener noreferrer'>{unsplash}</a></>;
} else {
photo = <a href={info.photoURL} target='_blank' rel='noopener noreferrer'>{language.credit}</a>;
credit = <><a href={info.photographerURL} target='_blank' rel='noopener noreferrer'>{photographer}</a> <a href='https://pexels.com' target='_blank' rel='noopener noreferrer'>{language.pexels}</a></>;
photo = <a href={info.photoURL} target='_blank' rel='noopener noreferrer'>{variables.language.getMessage(variables.languagecode, 'widgets.background.credit')}</a>;
credit = <><a href={info.photographerURL} target='_blank' rel='noopener noreferrer'>{photographer}</a> <a href='https://pexels.com' target='_blank' rel='noopener noreferrer'>{pexels}</a></>;
}
}
@@ -126,7 +127,7 @@ export default function PhotoInformation({ info, url, api }) {
<Info className='photoInformationHover'/>
<div className='infoCard'>
<Info className='infoIcon'/>
<h1>{language.information}</h1>
<h1>{variables.language.getMessage(variables.languagecode, 'widgets.background.information')}</h1>
<hr/>
{photoMap()}
{/* fix console error by using fragment and key */}
@@ -141,11 +142,11 @@ export default function PhotoInformation({ info, url, api }) {
<Resolution/>
<span id='infoResolution'>{width}x{height}</span>
<Photographer/>
<span>{photographer}</span>
<span>{info.credit}</span>
{downloadEnabled ?
<>
<Download/>
<span className='download' onClick={() => downloadImage(info)}>{language.download}</span>
<span className='download' onClick={() => downloadImage(info)}>{variables.language.getMessage(variables.languagecode, 'widgets.background.download')}</span>
</>
: null}
</div>

18
src/components/widgets/greeting/Greeting.jsx
View File

@@ -1,3 +1,4 @@
import variables from 'modules/variables';
import { PureComponent, createRef } from 'react';
import { nth, convertTimezone } from 'modules/helpers/date';
@@ -12,7 +13,6 @@ export default class Greeting extends PureComponent {
greeting: ''
};
this.timer = undefined;
this.language = window.language.widgets.greeting;
this.greeting = createRef();
}
@@ -27,13 +27,13 @@ export default class Greeting extends PureComponent {
// If it's December 25th, set the greeting string to "Merry Christmas"
if (month === 11 && date === 25) {
message = this.language.christmas;
message = variables.language.getMessage(variables.languagecode, 'widgets.greeting.christmas');
// If the date is January 1st, set the greeting string to "Happy new year"
} else if (month === 0 && date === 1) {
message = this.language.newyear;
message = variables.language.getMessage(variables.languagecode, 'widgets.greeting.newyear');
// If it's October 31st, set the greeting string to "Happy Halloween"
} else if (month === 9 && date === 31) {
message = this.language.halloween;
message = variables.language.getMessage(variables.languagecode, 'widgets.greeting.halloween');
}
return message;
@@ -56,13 +56,13 @@ export default class Greeting extends PureComponent {
const hour = now.getHours();
// Set the default greeting string to "Good evening"
let message = this.language.evening;
let message = variables.language.getMessage(variables.languagecode, 'widgets.greeting.evening');
// If it's before 12am, set the greeting string to "Good morning"
if (hour < 12) {
message = this.language.morning;
message = variables.language.getMessage(variables.languagecode, 'widgets.greeting.morning');
// If it's before 6pm, set the greeting string to "Good afternoon"
} else if (hour < 18) {
message = this.language.afternoon;
message = variables.language.getMessage(variables.languagecode, 'widgets.greeting.afternoon');
}
// Events and custom
@@ -95,10 +95,10 @@ export default class Greeting extends PureComponent {
if (birth.getDate() === now.getDate() && birth.getMonth() === now.getMonth()) {
if (localStorage.getItem('birthdayage') === 'true') {
const text = this.language.birthday.split(' ');
const text = variables.language.getMessage(variables.languagecode, 'widgets.greeting.birthday').split(' ');
message = `${text[0]} ${nth(this.calculateAge(birth))} ${text[1]}`;
} else {
message = this.language.birthday;
message = variables.language.getMessage(variables.languagecode, 'widgets.greeting.birthday');
}
}
}

7
src/components/widgets/navbar/Navbar.jsx
View File

@@ -1,3 +1,4 @@
import variables from 'modules/variables';
import { PureComponent, createRef } from 'react';
import { RefreshRounded, SettingsRounded, AssignmentRounded as NotesRounded, SmsFailed as Report } from '@material-ui/icons';
@@ -67,18 +68,18 @@ export default class Navbar extends PureComponent {
: null}
{(window.constants.BETA_VERSION === true) ?
<Tooltip title={window.language.widgets.navbar.tooltips.feedback}>
<Tooltip title={variables.language.getMessage(variables.languagecode, 'widgets.navbar.tooltips.feedback')}>
<Report className='topicons' onClick={() => this.props.openModal('feedbackModal')}/>
</Tooltip>
: null}
{(this.refreshValue !== 'false') ?
<Tooltip title={window.language.widgets.navbar.tooltips.refresh}>
<Tooltip title={variables.language.getMessage(variables.languagecode, 'widgets.navbar.tooltips.refresh')}>
<RefreshRounded className='refreshicon topicons' onClick={() => this.refresh()}/>
</Tooltip>
: null}
<Tooltip title={window.language.modals.main.navbar.settings}>
<Tooltip title={variables.language.getMessage(variables.languagecode, 'modals.main.navbar.settings')}>
<SettingsRounded className='settings-icon topicons' onClick={() => this.props.openModal('mainModal')}/>
</Tooltip>
</div>

8
src/components/widgets/navbar/Notes.jsx
View File

@@ -1,3 +1,4 @@
import variables from 'modules/variables';
import { PureComponent } from 'react';
import { FileCopyRounded, AssignmentRounded as NotesRounded, PushPin }from '@material-ui/icons';
import TextareaAutosize from '@material-ui/core/TextareaAutosize';
@@ -12,7 +13,6 @@ export default class Notes extends PureComponent {
visibility: (localStorage.getItem('notesPinned') === 'true') ? 'visible' : 'hidden',
marginLeft: (localStorage.getItem('refresh') === 'false') ? '-200px' : '-150px'
};
this.language = window.language.widgets.navbar.notes;
}
setNotes = (e) => {
@@ -41,7 +41,7 @@ export default class Notes extends PureComponent {
copy() {
window.stats.postEvent('feature', 'Notes copied');
navigator.clipboard.writeText(this.state.notes);
toast(window.language.toasts.notes);
toast(variables.language.getMessage(variables.languagecode, 'toasts.notes'));
}
render() {
@@ -49,9 +49,9 @@ export default class Notes extends PureComponent {
<span id='noteContainer' className='notescontainer' style={{ visibility: this.state.visibility, marginLeft: this.state.marginLeft }}>
<div className='topbarnotes'>
<NotesRounded/>
<h3>{this.language.title}</h3>
<h3>{variables.language.getMessage(variables.languagecode, 'widgets.navbar.notes.title')}</h3>
</div>
<TextareaAutosize rowsmax={50} placeholder={this.language.placeholder} value={this.state.notes} onChange={this.setNotes}/>
<TextareaAutosize rowsmax={50} placeholder={variables.language.getMessage(variables.languagecode, 'widgets.navbar.notes.placeholder')} value={this.state.notes} onChange={this.setNotes}/>
<button onClick={() => this.pin()} className='pinNote'><PushPin/></button>
<button onClick={() => this.copy()} className='copyNote'><FileCopyRounded/></button>
{window.keybinds.pinNotes && window.keybinds.pinNotes !== '' ? <Hotkeys keyName={window.keybinds.pinNotes} onKeyDown={() => this.pin()}/> : null}

1
src/components/widgets/quicklinks/QuickLinks.jsx
View File

@@ -19,7 +19,6 @@ export default class QuickLinks extends PureComponent {
nameError: '',
urlError: ''
};
this.language = window.language.widgets.quicklinks;
this.quicklinksContainer = createRef();
}

6
src/components/widgets/quote/Quote.jsx
View File

@@ -1,3 +1,4 @@
import variables from 'modules/variables';
import { PureComponent, createRef } from 'react';
import { FilterNone as FileCopy, Twitter, Star, StarBorder } from '@material-ui/icons';
import { toast } from 'react-toastify';
@@ -27,7 +28,6 @@ export default class Quote extends PureComponent {
quoteLanguage: '',
type: localStorage.getItem('quoteType') || 'api'
};
this.language = window.language.widgets.quote;
this.quote = createRef();
this.quotediv = createRef();
this.quoteauthor = createRef();
@@ -55,7 +55,7 @@ export default class Quote extends PureComponent {
}
getAuthorLink(author) {
let authorlink = `https://${window.languagecode.split('_')[0]}.wikipedia.org/wiki/${author.split(' ').join('_')}`;
let authorlink = `https://${variables.languagecode.split('_')[0]}.wikipedia.org/wiki/${author.split(' ').join('_')}`;
if (localStorage.getItem('authorLink') === 'false' || author === 'Unknown') {
authorlink = null;
}
@@ -163,7 +163,7 @@ export default class Quote extends PureComponent {
copyQuote() {
window.stats.postEvent('feature', 'Quote copied');
navigator.clipboard.writeText(`${this.state.quote} - ${this.state.author}`);
toast(window.language.toasts.quote);
toast(variables.language.getMessage(variables.languagecode, 'toasts.quote'));
}
tweetQuote() {

6
src/components/widgets/search/Search.jsx
View File

@@ -1,3 +1,4 @@
import variables from 'modules/variables';
import { PureComponent, Fragment } from 'react';
import { Search as SearchIcon, Mic } from '@material-ui/icons';
import Hotkeys from 'react-hot-keys';
@@ -24,7 +25,6 @@ export default class Search extends PureComponent {
suggestions: [],
searchDropdown: 'hidden'
};
this.language = window.language.widgets.search;
}
startSpeechRecognition = () => {
@@ -169,7 +169,7 @@ export default class Search extends PureComponent {
}
render() {
const customText = window.language.modals.main.settings.sections.search.custom.split(' ')[0];
const customText = variables.language.getMessage(variables.languagecode, 'modals.main.settings.sections.search.custom').split(' ')[0];
return (
<form onSubmit={this.searchButton} className='searchBar'>
@@ -194,7 +194,7 @@ export default class Search extends PureComponent {
</div> : null}
{this.state.microphone}
<SearchIcon onClick={this.searchButton}/>
<AutocompleteInput placeholder={this.language} id='searchtext' suggestions={this.state.suggestions} onChange={(e) => this.getSuggestions(e)} onClick={this.searchButton}/>
<AutocompleteInput placeholder={variables.language.getMessage(variables.languagecode, 'widgets.search')} id='searchtext' suggestions={this.state.suggestions} onChange={(e) => this.getSuggestions(e)} onClick={this.searchButton}/>
{window.keybinds.focusSearch && window.keybinds.focusSearch !== '' ? <Hotkeys keyName={window.keybinds.focusSearch} onKeyDown={() => document.getElementById('searchtext').focus()}/> : null}
</form>
);

5
src/components/widgets/time/Date.jsx
View File

@@ -1,3 +1,4 @@
import variables from 'modules/variables';
import { PureComponent, createRef } from 'react';
import { nth, convertTimezone } from 'modules/helpers/date';
@@ -28,7 +29,7 @@ export default class DateWidget extends PureComponent {
}
this.setState({
weekNumber: `${window.language.widgets.date.week} ${1 + Math.ceil((firstThursday - dateToday) / 604800000)}`
weekNumber: `${variables.language.getMessage(variables.languagecode, 'widgets.date.week')} ${1 + Math.ceil((firstThursday - dateToday) / 604800000)}`
});
}
@@ -95,7 +96,7 @@ export default class DateWidget extends PureComponent {
});
} else {
// Long date
const lang = window.languagecode.split('_')[0];
const lang = variables.languagecode.split('_')[0];
const datenth = (localStorage.getItem('datenth') === 'true') ? nth(date.getDate()) : date.getDate();

9
src/components/widgets/weather/Weather.jsx
View File

@@ -1,3 +1,4 @@
import variables from 'modules/variables';
import { PureComponent } from 'react';
import { WiHumidity, WiWindy, WiBarometer, WiCloud } from 'weather-icons-react';
@@ -59,12 +60,12 @@ export default class Weather extends PureComponent {
};
if (!this.state.weather.temp) {
data = await (await fetch(window.constants.PROXY_URL + `/weather/current?city=${this.state.location}&lang=${window.languagecode}`)).json();
data = await (await fetch(window.constants.PROXY_URL + `/weather/current?city=${this.state.location}&lang=${variables.languagecode}`)).json();
}
if (data.cod === '404') {
return this.setState({
location: window.language.widgets.weather.not_found
location: variables.language.getMessage(variables.languagecode, 'widgets.weather.not_found')
});
}
@@ -133,7 +134,7 @@ export default class Weather extends PureComponent {
return (localStorage.getItem(setting) === 'true');
};
if (this.state.location === window.language.widgets.weather.not_found) {
if (this.state.location === variables.language.getMessage(variables.languagecode, 'weather.not_found')) {
return (<div className='weather'>
<span className='loc'>{this.state.location}</span>
</div>);
@@ -163,7 +164,7 @@ export default class Weather extends PureComponent {
{enabled('humidity') ? <span className='loc'><br/><WiHumidity/>{this.state.weather.humidity}%</span> : null}
{enabled('windspeed') ? <span className='loc'><br/><WiWindy/>{this.state.weather.wind_speed}<span className='minmax'> m/s</span> {enabled('windDirection') ? <WindDirectionIcon degrees={this.state.weather.wind_degrees}/> : null}</span> : null}
{enabled('cloudiness') ? <span className='loc'><br/><WiCloud/>{this.state.weather.cloudiness}%</span> : null}
{enabled('visibility') ? <span className='loc'><br/>{this.state.weather.visibility} {window.language.widgets.weather.meters}</span> : null}
{enabled('visibility') ? <span className='loc'><br/>{this.state.weather.visibility} {variables.language.getMessage(variables.languagecode, 'widgets.weather.meters')}</span> : null}
{enabled('atmosphericpressure') ? <span className='loc'><br/><WiBarometer/>{this.state.weather.pressure}<span className='minmax'> hPa</span></span> : null}
<br/>
{enabled('showlocation') ? <span className='loc'>{this.state.location}</span> : null}