PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Handle fontslider input errors correctly

Browse source
This commit is contained in:
Jorik Schellekens 2020-04-23 13:52:08 +01:00
parent 600a812227
commit e5cb149296
2 changed files with 31 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
src/components/views/settings/tabs/user/AppearanceUserSettingsTab.js
View file

@ -101,11 +101,33 @@ export default class StyleUserSettingsTab extends React.Component {
};
_onFontSizeChanged = (size) => {
const parsedSize = isNaN(parseInt(size)) ? SettingsStore.getDefaultValue("font_size") : parseFloat(size);
this.setState({fontSize: parsedSize});
SettingsStore.setValue("font_size", null, SettingLevel.DEVICE, parsedSize);
this.setState({fontSize: size});
SettingsStore.setValue("font_size", null, SettingLevel.DEVICE, size);
};
_onValidateFontSize = ({value}) => {
console.log({value});
this.setState({fontSize: value});
const parsedSize = parseFloat(value);
const min = SettingsStore.getValue("font_size_min");
const max = SettingsStore.getValue("font_size_max");
if (isNaN(parsedSize)) {
return {valid: false, feedback: _t("Size must be a number")};
}
console.log({min});
console.log({max});
console.log({parsedSize});
if (!(min <= parsedSize && parsedSize <= max)) {
return {valid: false, feedback: _t('Custom font size can only be between %(min)s pt and %(max)s pt', {min, max})};
}
SettingsStore.setValue("font_size", null, SettingLevel.DEVICE, value);
return {valid: true, feedback: _t('Use between %(min)s pt and %(max)s pt', {min, max})};
}
_onAddCustomTheme = async () => {
let currentThemes = SettingsStore.getValue("custom_themes");
if (!currentThemes) currentThemes = [];
@ -247,10 +269,11 @@ export default class StyleUserSettingsTab extends React.Component {
type="text"
label={_t("Font size")}
autoComplete="off"
placeholder={SettingsStore.getValue("font_size", null).toString()}
placeholder={this.state.fontSize}
value={this.state.fontSize}
id="font_size_field"
onChange={(ev) => this._onFontSizeChanged(ev.target.value)}
onValidate={this._onValidateFontSize}
onChange={({value}) => this.setState({fontSize: value})}
disabled={!this.state.useCustomFontSize}
/>
</div>;

3
src/i18n/strings/en_EN.json
View file

@ -747,6 +747,9 @@
"Use an Integration Manager to manage bots, widgets, and sticker packs.": "Use an Integration Manager to manage bots, widgets, and sticker packs.",
"Manage integrations": "Manage integrations",
"Integration Managers receive configuration data, and can modify widgets, send room invites, and set power levels on your behalf.": "Integration Managers receive configuration data, and can modify widgets, send room invites, and set power levels on your behalf.",
"Size must be a number": "Size must be a number",
"Custom font size can only be between %(min)s pt and %(max)s pt": "Custom font size can only be between %(min)s pt and %(max)s pt",
"Use between %(min)s pt and %(max)s pt": "Use between %(min)s pt and %(max)s pt",
"Invalid theme schema.": "Invalid theme schema.",
"Error downloading theme information.": "Error downloading theme information.",
"Theme added!": "Theme added!",