mirror of
https://github.com/mue/mue.git
synced 2026-07-22 00:07:23 +02:00
refactor: clean translation system and more widget stuff
This commit is contained in:
David Ralph
@@ -16,14 +16,12 @@ import CustomSettings from './Custom';
|
||||
import { values } from 'modules/helpers/settings/modals';
|
||||
|
||||
export default class BackgroundSettings extends PureComponent {
|
||||
getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
this.state = {
|
||||
backgroundType: localStorage.getItem('backgroundType') || 'api',
|
||||
backgroundFilter: localStorage.getItem('backgroundFilter') || 'none',
|
||||
backgroundCategories: [this.getMessage('modals.main.loading')],
|
||||
backgroundCategories: [variables.getMessage('modals.main.loading')],
|
||||
backgroundAPI: localStorage.getItem('backgroundAPI') || 'mue',
|
||||
marketplaceEnabled: localStorage.getItem('photo_packs'),
|
||||
effects: false,
|
||||
@@ -51,7 +49,7 @@ export default class BackgroundSettings extends PureComponent {
|
||||
componentDidMount() {
|
||||
if (navigator.onLine === false || localStorage.getItem('offlineMode') === 'true') {
|
||||
return this.setState({
|
||||
backgroundCategories: [this.getMessage('modals.update.offline.title')],
|
||||
backgroundCategories: [variables.getMessage('modals.update.offline.title')],
|
||||
});
|
||||
}
|
||||
|
||||
@@ -68,29 +66,31 @@ export default class BackgroundSettings extends PureComponent {
|
||||
|
||||
const interval = (
|
||||
<SettingsItem
|
||||
title={getMessage('modals.main.settings.sections.background.interval.title')}
|
||||
subtitle={getMessage('modals.mani.settings.sections.background.intervanl.subtitle')}
|
||||
title={variables.getMessage('modals.main.settings.sections.background.interval.title')}
|
||||
subtitle={variables.getMessage(
|
||||
'modals.mani.settings.sections.background.intervanl.subtitle',
|
||||
)}
|
||||
>
|
||||
<Dropdown
|
||||
label={getMessage('modals.main.settings.sections.background.interval.title')}
|
||||
label={variables.getMessage('modals.main.settings.sections.background.interval.title')}
|
||||
name="backgroundchange"
|
||||
>
|
||||
<option value="refresh">{getMessage('tabname')}</option>
|
||||
<option value="refresh">{variables.getMessage('tabname')}</option>
|
||||
<option value="60000">
|
||||
{getMessage('modals.main.settings.sections.background.interval.minute')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.interval.minute')}
|
||||
</option>
|
||||
<option value="1800000">
|
||||
{getMessage('modals.main.settings.sections.background.interval.half_hour')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.interval.half_hour')}
|
||||
</option>
|
||||
<option value="3600000">
|
||||
{getMessage('modals.main.settings.sections.background.interval.hour')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.interval.hour')}
|
||||
</option>
|
||||
<option value="86400000">
|
||||
{getMessage('modals.main.settings.sections.background.interval.day')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.interval.day')}
|
||||
</option>
|
||||
<option value="604800000">{getMessage('widgets.date.week')}</option>
|
||||
<option value="604800000">{variables.getMessage('widgets.date.week')}</option>
|
||||
<option value="2628000000">
|
||||
{getMessage('modals.main.settings.sections.background.interval.month')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.interval.month')}
|
||||
</option>
|
||||
</Dropdown>
|
||||
</SettingsItem>
|
||||
@@ -100,27 +100,27 @@ export default class BackgroundSettings extends PureComponent {
|
||||
<>
|
||||
{interval}
|
||||
<SettingsItem
|
||||
title={getMessage('modals.main.settings.sections.background.api')}
|
||||
subtitle={getMessage('modals.main.settings.sections.background.api_subtitle')}
|
||||
title={variables.getMessage('modals.main.settings.sections.background.api')}
|
||||
subtitle={variables.getMessage('modals.main.settings.sections.background.api_subtitle')}
|
||||
final={true}
|
||||
>
|
||||
{this.state.backgroundCategories[0] === getMessage('modals.main.loading') ? (
|
||||
{this.state.backgroundCategories[0] === variables.getMessage('modals.main.loading') ? (
|
||||
<>
|
||||
<Dropdown
|
||||
label={getMessage('modals.main.settings.sections.background.category')}
|
||||
label={variables.getMessage('modals.main.settings.sections.background.category')}
|
||||
name="apiCategory"
|
||||
>
|
||||
<MenuItem value="loading" key="loading">
|
||||
{getMessage('modals.main.loading')}
|
||||
{variables.getMessage('modals.main.loading')}
|
||||
</MenuItem>
|
||||
<MenuItem value="loading" key="loading">
|
||||
{getMessage('modals.main.loading')}
|
||||
{variables.getMessage('modals.main.loading')}
|
||||
</MenuItem>
|
||||
</Dropdown>
|
||||
</>
|
||||
) : (
|
||||
<Dropdown
|
||||
label={getMessage('modals.main.settings.sections.background.category')}
|
||||
label={variables.getMessage('modals.main.settings.sections.background.category')}
|
||||
name="apiCategory"
|
||||
>
|
||||
{this.state.backgroundCategories.map((category) => (
|
||||
@@ -131,21 +131,29 @@ export default class BackgroundSettings extends PureComponent {
|
||||
</Dropdown>
|
||||
)}
|
||||
<Dropdown
|
||||
label={getMessage('modals.main.settings.sections.background.source.quality.title')}
|
||||
label={variables.getMessage(
|
||||
'modals.main.settings.sections.background.source.quality.title',
|
||||
)}
|
||||
name="apiQuality"
|
||||
element=".other"
|
||||
>
|
||||
<option value="original">
|
||||
{getMessage('modals.main.settings.sections.background.source.quality.original')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.source.quality.original',
|
||||
)}
|
||||
</option>
|
||||
<option value="high">
|
||||
{getMessage('modals.main.settings.sections.background.source.quality.high')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.source.quality.high')}
|
||||
</option>
|
||||
<option value="normal">
|
||||
{getMessage('modals.main.settings.sections.background.source.quality.normal')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.source.quality.normal',
|
||||
)}
|
||||
</option>
|
||||
<option value="datasaver">
|
||||
{getMessage('modals.main.settings.sections.background.source.quality.datasaver')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.source.quality.datasaver',
|
||||
)}
|
||||
</option>
|
||||
</Dropdown>
|
||||
<Radio
|
||||
@@ -208,10 +216,10 @@ export default class BackgroundSettings extends PureComponent {
|
||||
header = (
|
||||
<span className="mainTitle" onClick={() => this.setState({ effects: false })}>
|
||||
<span className="backTitle">
|
||||
{getMessage('modals.main.settings.sections.background.title')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.title')}
|
||||
</span>
|
||||
<MdOutlineKeyboardArrowRight />{' '}
|
||||
{getMessage('modals.main.settings.sections.background.effects.title')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.effects.title')}
|
||||
</span>
|
||||
);
|
||||
} else if (this.state.backgroundSettingsSection === true) {
|
||||
@@ -221,16 +229,16 @@ export default class BackgroundSettings extends PureComponent {
|
||||
onClick={() => this.setState({ backgroundSettingsSection: false })}
|
||||
>
|
||||
<span className="backTitle">
|
||||
{getMessage('modals.main.settings.sections.background.title')}{' '}
|
||||
{variables.getMessage('modals.main.settings.sections.background.title')}{' '}
|
||||
</span>
|
||||
<MdOutlineKeyboardArrowRight />{' '}
|
||||
{getMessage('modals.main.settings.sections.background.source.title')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.source.title')}
|
||||
</span>
|
||||
);
|
||||
} else {
|
||||
header = (
|
||||
<Header
|
||||
title={getMessage('modals.main.settings.sections.background.title')}
|
||||
title={variables.getMessage('modals.main.settings.sections.background.title')}
|
||||
setting="background"
|
||||
category="background"
|
||||
element="#backgroundImage"
|
||||
@@ -251,39 +259,51 @@ export default class BackgroundSettings extends PureComponent {
|
||||
<MdSource />
|
||||
<div className="content">
|
||||
<span className="title">
|
||||
{getMessage('modals.main.settings.sections.background.source.title')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.source.title')}
|
||||
</span>
|
||||
<span className="subtitle">
|
||||
{getMessage('modals.main.settings.sections.background.source.subtitle')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.source.subtitle',
|
||||
)}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="action">
|
||||
<Dropdown
|
||||
label={getMessage('modals.main.settings.sections.background.type.title')}
|
||||
label={variables.getMessage(
|
||||
'modals.main.settings.sections.background.type.title',
|
||||
)}
|
||||
name="backgroundType"
|
||||
onChange={(value) => this.setState({ backgroundType: value })}
|
||||
category="background"
|
||||
>
|
||||
{this.state.marketplaceEnabled ? (
|
||||
<option value="photo_pack">
|
||||
{this.getMessage('modals.main.navbar.marketplace')}
|
||||
{variables.getMessage('modals.main.navbar.marketplace')}
|
||||
</option>
|
||||
) : null}
|
||||
<option value="api">
|
||||
{getMessage('modals.main.settings.sections.background.type.api')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.type.api')}
|
||||
</option>
|
||||
<option value="custom">
|
||||
{getMessage('modals.main.settings.sections.background.type.custom_image')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.type.custom_image',
|
||||
)}
|
||||
</option>
|
||||
<option value="colour">
|
||||
{getMessage('modals.main.settings.sections.background.type.custom_colour')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.type.custom_colour',
|
||||
)}
|
||||
</option>
|
||||
<option value="random_colour">
|
||||
{getMessage('modals.main.settings.sections.background.type.random_colour')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.type.random_colour',
|
||||
)}
|
||||
</option>
|
||||
<option value="random_gradient">
|
||||
{getMessage('modals.main.settings.sections.background.type.random_gradient')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.type.random_gradient',
|
||||
)}
|
||||
</option>
|
||||
</Dropdown>
|
||||
</div>
|
||||
@@ -297,10 +317,14 @@ export default class BackgroundSettings extends PureComponent {
|
||||
<MdOutlineAutoAwesome />
|
||||
<div className="content">
|
||||
<span className="title">
|
||||
{getMessage('modals.main.settings.sections.background.effects.title')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.effects.title',
|
||||
)}
|
||||
</span>
|
||||
<span className="subtitle">
|
||||
{getMessage('modals.main.settings.sections.background.effects.subtitle')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.effects.subtitle',
|
||||
)}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -319,25 +343,31 @@ export default class BackgroundSettings extends PureComponent {
|
||||
this.state.backgroundType === 'custom' ||
|
||||
this.state.marketplaceEnabled) ? (
|
||||
<SettingsItem
|
||||
title={getMessage('modals.main.settings.sections.background.display')}
|
||||
subtitle={getMessage('modals.main.settings.sections.background.display_subtitle')}
|
||||
title={variables.getMessage('modals.main.settings.sections.background.display')}
|
||||
subtitle={variables.getMessage(
|
||||
'modals.main.settings.sections.background.display_subtitle',
|
||||
)}
|
||||
final={true}
|
||||
>
|
||||
<Checkbox
|
||||
name="ddgProxy"
|
||||
text={getMessage('modals.main.settings.sections.background.ddg_image_proxy')}
|
||||
text={variables.getMessage(
|
||||
'modals.main.settings.sections.background.ddg_image_proxy',
|
||||
)}
|
||||
element=".other"
|
||||
disabled={!usingImage}
|
||||
/>
|
||||
<Checkbox
|
||||
name="bgtransition"
|
||||
text={getMessage('modals.main.settings.sections.background.transition')}
|
||||
text={variables.getMessage('modals.main.settings.sections.background.transition')}
|
||||
element=".other"
|
||||
disabled={!usingImage}
|
||||
/>
|
||||
<Checkbox
|
||||
name="photoInformation"
|
||||
text={getMessage('modals.main.settings.sections.background.photo_information')}
|
||||
text={variables.getMessage(
|
||||
'modals.main.settings.sections.background.photo_information',
|
||||
)}
|
||||
element=".other"
|
||||
disabled={
|
||||
this.state.backgroundType !== 'api' && this.state.backgroundType !== 'marketplace'
|
||||
@@ -345,7 +375,7 @@ export default class BackgroundSettings extends PureComponent {
|
||||
/>
|
||||
<Checkbox
|
||||
name="photoMap"
|
||||
text={getMessage('modals.main.settings.sections.background.show_map')}
|
||||
text={variables.getMessage('modals.main.settings.sections.background.show_map')}
|
||||
element=".other"
|
||||
disabled={this.state.backgroundAPI !== 'unsplash'}
|
||||
/>
|
||||
@@ -354,38 +384,48 @@ export default class BackgroundSettings extends PureComponent {
|
||||
{this.state.backgroundSettingsSection ? (
|
||||
<>
|
||||
<SettingsItem
|
||||
title={getMessage('modals.main.settings.sections.background.source.title')}
|
||||
subtitle={getMessage('modals.main.settings.sections.background.source.subtitle')}
|
||||
title={variables.getMessage('modals.main.settings.sections.background.source.title')}
|
||||
subtitle={variables.getMessage(
|
||||
'modals.main.settings.sections.background.source.subtitle',
|
||||
)}
|
||||
final={
|
||||
this.state.backgroundType === 'random_colour' ||
|
||||
this.state.backgroundType === 'random_gradient'
|
||||
}
|
||||
>
|
||||
<Dropdown
|
||||
label={getMessage('modals.main.settings.sections.background.type.title')}
|
||||
label={variables.getMessage('modals.main.settings.sections.background.type.title')}
|
||||
name="backgroundType"
|
||||
onChange={(value) => this.setState({ backgroundType: value })}
|
||||
category="background"
|
||||
>
|
||||
{this.state.marketplaceEnabled ? (
|
||||
<option value="photo_pack">
|
||||
{this.getMessage('modals.main.navbar.marketplace')}
|
||||
{variables.getMessage('modals.main.navbar.marketplace')}
|
||||
</option>
|
||||
) : null}
|
||||
<option value="api">
|
||||
{getMessage('modals.main.settings.sections.background.type.api')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.type.api')}
|
||||
</option>
|
||||
<option value="custom">
|
||||
{getMessage('modals.main.settings.sections.background.type.custom_image')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.type.custom_image',
|
||||
)}
|
||||
</option>
|
||||
<option value="colour">
|
||||
{getMessage('modals.main.settings.sections.background.type.custom_colour')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.type.custom_colour',
|
||||
)}
|
||||
</option>
|
||||
<option value="random_colour">
|
||||
{getMessage('modals.main.settings.sections.background.type.random_colour')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.type.random_colour',
|
||||
)}
|
||||
</option>
|
||||
<option value="random_gradient">
|
||||
{getMessage('modals.main.settings.sections.background.type.random_gradient')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.type.random_gradient',
|
||||
)}
|
||||
</option>
|
||||
</Dropdown>
|
||||
</SettingsItem>
|
||||
@@ -397,12 +437,14 @@ export default class BackgroundSettings extends PureComponent {
|
||||
this.state.marketplaceEnabled) &&
|
||||
this.state.effects ? (
|
||||
<SettingsItem
|
||||
title={getMessage('modals.main.settings.sections.background.effects.title')}
|
||||
subtitle={getMessage('modals.main.settings.sections.background.effects.subtitle')}
|
||||
title={variables.getMessage('modals.main.settings.sections.background.effects.title')}
|
||||
subtitle={variables.getMessage(
|
||||
'modals.main.settings.sections.background.effects.subtitle',
|
||||
)}
|
||||
final={true}
|
||||
>
|
||||
<Slider
|
||||
title={getMessage('modals.main.settings.sections.background.effects.blur')}
|
||||
title={variables.getMessage('modals.main.settings.sections.background.effects.blur')}
|
||||
name="blur"
|
||||
min="0"
|
||||
max="100"
|
||||
@@ -413,7 +455,9 @@ export default class BackgroundSettings extends PureComponent {
|
||||
element="#backgroundImage"
|
||||
/>
|
||||
<Slider
|
||||
title={getMessage('modals.main.settings.sections.background.effects.brightness')}
|
||||
title={variables.getMessage(
|
||||
'modals.main.settings.sections.background.effects.brightness',
|
||||
)}
|
||||
name="brightness"
|
||||
min="0"
|
||||
max="100"
|
||||
@@ -424,34 +468,48 @@ export default class BackgroundSettings extends PureComponent {
|
||||
element="#backgroundImage"
|
||||
/>
|
||||
<Dropdown
|
||||
label={getMessage('modals.main.settings.sections.background.effects.filters.title')}
|
||||
label={variables.getMessage(
|
||||
'modals.main.settings.sections.background.effects.filters.title',
|
||||
)}
|
||||
name="backgroundFilter"
|
||||
onChange={(value) => this.setState({ backgroundFilter: value })}
|
||||
category="background"
|
||||
element="#backgroundImage"
|
||||
>
|
||||
<option value="none">
|
||||
{getMessage('modals.main.settings.sections.appearance.navbar.refresh_options.none')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.appearance.navbar.refresh_options.none',
|
||||
)}
|
||||
</option>
|
||||
<option value="grayscale">
|
||||
{getMessage('modals.main.settings.sections.background.effects.filters.grayscale')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.effects.filters.grayscale',
|
||||
)}
|
||||
</option>
|
||||
<option value="sepia">
|
||||
{getMessage('modals.main.settings.sections.background.effects.filters.sepia')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.effects.filters.sepia',
|
||||
)}
|
||||
</option>
|
||||
<option value="invert">
|
||||
{getMessage('modals.main.settings.sections.background.effects.filters.invert')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.effects.filters.invert',
|
||||
)}
|
||||
</option>
|
||||
<option value="saturate">
|
||||
{getMessage('modals.main.settings.sections.background.effects.filters.saturate')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.effects.filters.saturate',
|
||||
)}
|
||||
</option>
|
||||
<option value="contrast">
|
||||
{getMessage('modals.main.settings.sections.background.effects.filters.contrast')}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.effects.filters.contrast',
|
||||
)}
|
||||
</option>
|
||||
</Dropdown>
|
||||
{this.state.backgroundFilter !== 'none' ? (
|
||||
<Slider
|
||||
title={getMessage(
|
||||
title={variables.getMessage(
|
||||
'modals.main.settings.sections.background.effects.filters.amount',
|
||||
)}
|
||||
name="backgroundFilterAmount"
|
||||
|
||||
@@ -18,8 +18,6 @@ export default class ColourSettings extends PureComponent {
|
||||
};
|
||||
GradientPickerInitialState = undefined;
|
||||
|
||||
getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
this.state = {
|
||||
@@ -32,7 +30,7 @@ export default class ColourSettings extends PureComponent {
|
||||
this.setState({
|
||||
gradientSettings: this.DefaultGradientSettings,
|
||||
});
|
||||
toast(this.getMessage('toasts.reset'));
|
||||
toast(variables.getMessage('toasts.reset'));
|
||||
}
|
||||
|
||||
initialiseColourPickerState(gradientSettings) {
|
||||
@@ -120,7 +118,8 @@ export default class ColourSettings extends PureComponent {
|
||||
typeof this.state.gradientSettings === 'object' &&
|
||||
this.state.gradientSettings.gradient.every(
|
||||
(g) =>
|
||||
g.colour !== this.getMessage('modals.main.settings.sections.background.source.disabled'),
|
||||
g.colour !==
|
||||
variables.getMessage('modals.main.settings.sections.background.source.disabled'),
|
||||
)
|
||||
) {
|
||||
const clampNumber = (num, a, b) => Math.max(Math.min(num, Math.max(a, b)), Math.min(a, b));
|
||||
@@ -133,7 +132,7 @@ export default class ColourSettings extends PureComponent {
|
||||
].sort((a, b) => (a.stop > b.stop ? 1 : -1)),
|
||||
});
|
||||
}
|
||||
return this.getMessage('modals.main.settings.sections.background.source.disabled');
|
||||
return variables.getMessage('modals.main.settings.sections.background.source.disabled');
|
||||
};
|
||||
|
||||
onColourPickerChange = (attrs, name) => {
|
||||
@@ -211,7 +210,7 @@ export default class ColourSettings extends PureComponent {
|
||||
{!gradientHasMoreThanOneColour ? (
|
||||
<>
|
||||
<button type="button" className="add" onClick={this.addColour}>
|
||||
{this.getMessage('modals.main.settings.sections.background.source.add_colour')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.source.add_colour')}
|
||||
</button>
|
||||
</>
|
||||
) : null}
|
||||
@@ -222,11 +221,13 @@ export default class ColourSettings extends PureComponent {
|
||||
return (
|
||||
<>
|
||||
<SettingsItem
|
||||
title={this.getMessage('modals.main.settings.sections.background.source.custom_colour')}
|
||||
title={variables.getMessage(
|
||||
'modals.main.settings.sections.background.source.custom_colour',
|
||||
)}
|
||||
final={true}
|
||||
>
|
||||
<span className="link" onClick={() => this.resetColour()}>
|
||||
{this.getMessage('modals.main.settings.buttons.reset')}
|
||||
{variables.getMessage('modals.main.settings.buttons.reset')}
|
||||
</span>
|
||||
{colourSettings}
|
||||
</SettingsItem>
|
||||
|
||||
@@ -21,8 +21,7 @@ import Modal from 'react-modal';
|
||||
import CustomURLModal from './CustomURLModal';
|
||||
|
||||
export default class CustomSettings extends PureComponent {
|
||||
getMessage = (text, obj) =>
|
||||
variables.language.getMessage(variables.languagecode, text, obj || {});
|
||||
getMessage = (text, obj) => variables.getMessage(text, obj || {});
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
@@ -38,7 +37,7 @@ export default class CustomSettings extends PureComponent {
|
||||
this.setState({
|
||||
customBackground: [],
|
||||
});
|
||||
toast(this.getMessage('toasts.reset'));
|
||||
toast(variables.getMessage('toasts.reset'));
|
||||
EventBus.dispatch('refresh', 'background');
|
||||
};
|
||||
|
||||
@@ -92,11 +91,15 @@ export default class CustomSettings extends PureComponent {
|
||||
<>
|
||||
<Checkbox
|
||||
name="backgroundVideoLoop"
|
||||
text={this.getMessage('modals.main.settings.sections.background.source.loop_video')}
|
||||
text={variables.getMessage(
|
||||
'modals.main.settings.sections.background.source.loop_video',
|
||||
)}
|
||||
/>
|
||||
<Checkbox
|
||||
name="backgroundVideoMute"
|
||||
text={this.getMessage('modals.main.settings.sections.background.source.mute_video')}
|
||||
text={variables.getMessage(
|
||||
'modals.main.settings.sections.background.source.mute_video',
|
||||
)}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
@@ -152,7 +155,7 @@ export default class CustomSettings extends PureComponent {
|
||||
const settingsSize = new TextEncoder().encode(JSON.stringify(settings)).length;
|
||||
if (videoCheck(file.type) === true) {
|
||||
if (settingsSize + file.size > 4850000) {
|
||||
return toast(this.getMessage('toasts.no_storage'));
|
||||
return toast(variables.getMessage('toasts.no_storage'));
|
||||
}
|
||||
|
||||
return this.customBackground(file, false, this.state.currentBackgroundIndex);
|
||||
@@ -160,7 +163,7 @@ export default class CustomSettings extends PureComponent {
|
||||
|
||||
compressAccurately(file, 300).then(async (res) => {
|
||||
if (settingsSize + res.size > 4850000) {
|
||||
return toast(this.getMessage('toasts.no_storage'));
|
||||
return toast(variables.getMessage('toasts.no_storage'));
|
||||
}
|
||||
|
||||
this.customBackground(await filetoDataURL(res), false, this.state.currentBackgroundIndex);
|
||||
@@ -188,7 +191,7 @@ export default class CustomSettings extends PureComponent {
|
||||
<MdOutlineFileUpload />
|
||||
</button>
|
||||
<button onClick={() => this.setState({ customURLModal: true })}>
|
||||
{this.getMessage('modals.main.settings.sections.background.source.add_url')}{' '}
|
||||
{variables.getMessage('modals.main.settings.sections.background.source.add_url')}{' '}
|
||||
<MdAddLink />
|
||||
</button>
|
||||
</div>
|
||||
@@ -217,17 +220,20 @@ export default class CustomSettings extends PureComponent {
|
||||
<div className="emptyNewMessage">
|
||||
<MdAddPhotoAlternate />
|
||||
<span className="title">
|
||||
{this.getMessage(
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.source.drop_to_upload',
|
||||
)}
|
||||
</span>
|
||||
<span className="subtitle">
|
||||
{this.getMessage('modals.main.settings.sections.background.source.formats', {
|
||||
list: 'jpeg, png, webp, webm, gif, mp4, webm, ogg',
|
||||
})}
|
||||
{variables.getMessage(
|
||||
'modals.main.settings.sections.background.source.formats',
|
||||
{
|
||||
list: 'jpeg, png, webp, webm, gif, mp4, webm, ogg',
|
||||
},
|
||||
)}
|
||||
</span>
|
||||
<button onClick={() => this.uploadCustomBackground()}>
|
||||
{this.getMessage('modals.main.settings.sections.background.source.select')}
|
||||
{variables.getMessage('modals.main.settings.sections.background.source.select')}
|
||||
<MdFolder />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -10,16 +10,10 @@ export default function CustomURLModal({ modalClose, modalCloseOnly }) {
|
||||
<div className="smallModal">
|
||||
<div className="shareHeader">
|
||||
<span className="title">
|
||||
{variables.language.getMessage(
|
||||
variables.languagecode,
|
||||
'modals.main.settings.sections.background.source.add_url',
|
||||
)}
|
||||
{variables.getMessage('modals.main.settings.sections.background.source.add_url')}
|
||||
</span>
|
||||
<Tooltip
|
||||
title={variables.language.getMessage(
|
||||
variables.languagecode,
|
||||
'modals.main.settings.sections.advanced.reset_modal.cancel',
|
||||
)}
|
||||
title={variables.getMessage('modals.main.settings.sections.advanced.reset_modal.cancel')}
|
||||
>
|
||||
<div className="close" onClick={modalCloseOnly}>
|
||||
<MdClose />
|
||||
@@ -34,10 +28,7 @@ export default function CustomURLModal({ modalClose, modalCloseOnly }) {
|
||||
varient="outlined"
|
||||
/>
|
||||
<Tooltip
|
||||
title={variables.language.getMessage(
|
||||
variables.languagecode,
|
||||
'modals.main.settings.sections.background.source.add_url',
|
||||
)}
|
||||
title={variables.getMessage('modals.main.settings.sections.background.source.add_url')}
|
||||
placement="top"
|
||||
>
|
||||
<button onClick={() => modalClose(url)}>
|
||||
|
||||
Reference in New Issue
Block a user