client: make emoji amount slider more intuitive

Changelog: Changed
This commit is contained in:
Johann150 2022-09-16 17:21:09 +02:00
parent e6a76b326c
commit bcb93aec14
Signed by untrusted user: Johann150
GPG key ID: 9EE6577A2A06F8F1
2 changed files with 24 additions and 8 deletions

View file

@ -851,6 +851,7 @@ noEmailServerWarning: "Email server not configured."
thereIsUnresolvedAbuseReportWarning: "There are unsolved reports."
recommended: "Recommended"
check: "Check"
unlimited: "Unlimited"
_emailUnavailable:
used: "This email address is already being used"
format: "The format of this email address is invalid"
@ -982,9 +983,7 @@ _serverDisconnectedBehavior:
dialog: "Show warning dialog"
quiet: "Show unobtrusive warning"
maxCustomEmojiPicker: "Maximum suggested custom emoji in picker"
maxCustomEmojiPickerDescription: "0 for unlimited"
maxUnicodeEmojiPicker: "Maximum suggested unicode emoji in picker"
maxUnicodeEmojiPickerDescription: "0 for unlimited"
_channel:
create: "Create channel"
edit: "Edit channel"

View file

@ -35,13 +35,11 @@
<option value="quiet">{{ i18n.ts._serverDisconnectedBehavior.quiet }}</option>
</FormSelect>
<FormRange v-model="maxCustomEmojiPicker" :min="0" :max="24" :step="1" class="_formBlock">
<FormRange v-model="maxCustomEmojiPicker" :min="1" :max="25" :step="1" :text-converter="emojiCountConverter" class="_formBlock">
<template #label>{{ i18n.ts.maxCustomEmojiPicker }}</template>
<template #caption>{{ i18n.ts.maxCustomEmojiPickerDescription }}</template>
</FormRange>
<FormRange v-model="maxUnicodeEmojiPicker" :min="0" :max="24" :step="1" class="_formBlock">
<FormRange v-model="maxUnicodeEmojiPicker" :min="1" :max="25" :step="1" :text-converter="emojiCountConverter" class="_formBlock">
<template #label>{{ i18n.ts.maxUnicodeEmojiPicker }}</template>
<template #caption>{{ i18n.ts.maxUnicodeEmojiPickerDescription }}</template>
</FormRange>
</FormSection>
@ -128,8 +126,6 @@ async function reloadAsk(): Promise<void> {
const overridedDeviceKind = computed(defaultStore.makeGetterSetter('overridedDeviceKind'));
const serverDisconnectedBehavior = computed(defaultStore.makeGetterSetter('serverDisconnectedBehavior'));
const maxCustomEmojiPicker = computed(defaultStore.makeGetterSetter('maxCustomEmojiPicker'));
const maxUnicodeEmojiPicker = computed(defaultStore.makeGetterSetter('maxUnicodeEmojiPicker'));
const reduceAnimation = computed(defaultStore.makeGetterSetter('animation', v => !v, v => !v));
const useBlurEffectForModal = computed(defaultStore.makeGetterSetter('useBlurEffectForModal'));
const useBlurEffect = computed(defaultStore.makeGetterSetter('useBlurEffect'));
@ -148,6 +144,27 @@ const enableInfiniteScroll = computed(defaultStore.makeGetterSetter('enableInfin
const useReactionPickerForContextMenu = computed(defaultStore.makeGetterSetter('useReactionPickerForContextMenu'));
const squareAvatars = computed(defaultStore.makeGetterSetter('squareAvatars'));
/*
For these two, the sliders go to 25, but 25 should be mapped to "unlimited".
"Unlimited" is stored internally as 0 so the modulo is necessary.
*/
let maxCustomEmojiPicker = $ref(defaultStore.state.maxCustomEmojiPicker);
watch($$(maxCustomEmojiPicker), () => {
defaultStore.set('maxCustomEmojiPicker', maxCustomEmojiPicker % 25);
});
let maxUnicodeEmojiPicker = $ref(defaultStore.state.maxUnicodeEmojiPicker);
watch($$(maxUnicodeEmojiPicker), () => {
defaultStore.set('maxUnicodeEmojiPicker', maxUnicodeEmojiPicker % 25);
});
function emojiCountConverter(n: number): string {
if (n === 25) {
return i18n.ts.unlimited;
} else {
return n.toString();
}
}
watch(lang, () => {
localStorage.setItem('lang', lang.value as string);
localStorage.removeItem('locale');