From 662c3e837cab15d613818b30cbfd66d825e69160 Mon Sep 17 00:00:00 2001 From: Eduard Kuzmenko Date: Thu, 2 Mar 2023 15:44:00 +0400 Subject: [PATCH] misc --- src/components/checkboxField.ts | 21 ++++++++++++--- src/components/radioField.ts | 5 ++-- src/components/row.ts | 4 +++ src/components/sidebarLeft/index.ts | 15 +++++++++-- .../sidebarLeft/tabs/generalSettings.ts | 26 ++++++++++++++++++- .../sidebarLeft/tabs/powerSaving.ts | 4 +-- src/config/app.ts | 2 +- src/helpers/liteMode.ts | 4 +++ src/lib/appManagers/utils/state/loadState.ts | 6 +++++ 9 files changed, 74 insertions(+), 13 deletions(-) diff --git a/src/components/checkboxField.ts b/src/components/checkboxField.ts index cf2fdd6b..bcc1439e 100644 --- a/src/components/checkboxField.ts +++ b/src/components/checkboxField.ts @@ -10,6 +10,7 @@ import {LangPackKey, _i18n} from '../lib/langPack'; import getDeepProperty from '../helpers/object/getDeepProperty'; import rootScope from '../lib/rootScope'; import apiManagerProxy from '../lib/mtproto/mtprotoworker'; +import simulateEvent from '../helpers/dom/dispatchEvent'; export type CheckboxFieldOptions = { text?: LangPackKey, @@ -19,6 +20,7 @@ export type CheckboxFieldOptions = { toggle?: boolean, stateKey?: string, stateValues?: any[], + stateValueReverse?: boolean, disabled?: boolean, checked?: boolean, restriction?: boolean, @@ -73,12 +75,16 @@ export default class CheckboxField { value = options.stateValues[input.checked ? 1 : 0]; } else { value = input.checked; + + if(options.stateValueReverse) { + value = !value; + } } rootScope.managers.appStateManager.setByKey(options.stateKey, value); }; - apiManagerProxy.getState().then((state) => { + options.checked === undefined && apiManagerProxy.getState().then((state) => { loaded = true; const stateValue = getDeepProperty(state, options.stateKey); let checked: boolean; @@ -86,6 +92,10 @@ export default class CheckboxField { checked = options.stateValues.indexOf(stateValue) === 1; } else { checked = stateValue; + + if(options.stateValueReverse) { + checked = !checked; + } } this.setValueSilently(checked); @@ -162,17 +172,20 @@ export default class CheckboxField { } */ this.setValueSilently(checked); - - const event = new Event('change', {bubbles: true, cancelable: true}); - this.input.dispatchEvent(event); + simulateEvent(this.input, 'change'); } public setValueSilently(checked: boolean) { this.input.checked = checked; } + public isDisabled() { + return this.label.classList.contains('checkbox-disabled'); + } + public toggleDisability(disable: boolean) { this.label.classList.toggle('checkbox-disabled', disable); + this.input.disabled = disable; return () => this.toggleDisability(!disable); } } diff --git a/src/components/radioField.ts b/src/components/radioField.ts index 655dcae6..6b156631 100644 --- a/src/components/radioField.ts +++ b/src/components/radioField.ts @@ -4,6 +4,7 @@ * https://github.com/morethanwords/tweb/blob/master/LICENSE */ +import simulateEvent from '../helpers/dom/dispatchEvent'; import getDeepProperty from '../helpers/object/getDeepProperty'; import {LangPackKey, _i18n} from '../lib/langPack'; import apiManagerProxy from '../lib/mtproto/mtprotoworker'; @@ -75,9 +76,7 @@ export default class RadioField { set checked(checked: boolean) { this.setValueSilently(checked); - - const event = new Event('change', {bubbles: true, cancelable: true}); - this.input.dispatchEvent(event); + simulateEvent(this.input, 'change'); } public setValueSilently(checked: boolean) { diff --git a/src/components/row.ts b/src/components/row.ts index 4027eee8..816932e1 100644 --- a/src/components/row.ts +++ b/src/components/row.ts @@ -285,6 +285,10 @@ export default class Row { return media; } + public isDisabled() { + return this.container.classList.contains('is-disabled'); + } + public toggleDisability(disable = !this.container.classList.contains('is-disabled')) { this.container.classList.toggle('is-disabled', disable); return () => this.toggleDisability(!disable); diff --git a/src/components/sidebarLeft/index.ts b/src/components/sidebarLeft/index.ts index cad08237..b170a3b5 100644 --- a/src/components/sidebarLeft/index.ts +++ b/src/components/sidebarLeft/index.ts @@ -55,6 +55,8 @@ import {FOLDER_ID_ARCHIVE} from '../../lib/mtproto/mtproto_config'; import mediaSizes from '../../helpers/mediaSizes'; import {fastRaf} from '../../helpers/schedulers'; import {getInstallPrompt} from '../../helpers/dom/installPrompt'; +import liteMode from '../../helpers/liteMode'; +import AppPowerSavingTab from './tabs/powerSaving'; export const LEFT_COLUMN_ACTIVE_CLASSNAME = 'is-left-column-shown'; @@ -175,8 +177,17 @@ export class AppSidebarLeft extends SidebarSlider { checkboxField: new CheckboxField({ toggle: true, checked: true, - stateKey: 'settings.animationsEnabled' - }) + stateKey: 'settings.liteMode.animations', + stateValueReverse: true + }), + verify: () => !liteMode.isEnabled() + }, { + icon: 'animations', + text: 'LiteMode.Title', + onClick: () => { + this.createTab(AppPowerSavingTab).open(); + }, + verify: () => liteMode.isEnabled() }, { icon: 'help', text: 'TelegramFeatures', diff --git a/src/components/sidebarLeft/tabs/generalSettings.ts b/src/components/sidebarLeft/tabs/generalSettings.ts index 65d68969..1e0b489a 100644 --- a/src/components/sidebarLeft/tabs/generalSettings.ts +++ b/src/components/sidebarLeft/tabs/generalSettings.ts @@ -35,6 +35,7 @@ import RLottiePlayer from '../../../lib/rlottie/rlottiePlayer'; import themeController from '../../../helpers/themeController'; import liteMode from '../../../helpers/liteMode'; import AppPowerSavingTab from './powerSaving'; +import {toastNew} from '../../toast'; export class RangeSettingSelector { public container: HTMLDivElement; @@ -130,8 +131,28 @@ export default class AppGeneralSettingsTab extends SliderSuperTabEventable { const onUpdate = () => { i.compareAndUpdate({key: getLiteModeStatus()}); + animationsCheckboxField.setValueSilently(liteMode.isAvailable('animations')); + animationsCheckboxField.toggleDisability(liteMode.isEnabled()); }; - onUpdate(); + + const animationsCheckboxField = new CheckboxField({ + text: 'EnableAnimations', + name: 'animations', + stateKey: 'settings.liteMode.animations', + stateValueReverse: true, + checked: false, + listenerSetter: this.listenerSetter + }); + + const animationsRow = new Row({ + checkboxField: animationsCheckboxField, + clickable: () => { + if(animationsCheckboxField.isDisabled()) { + toastNew({langPackKey: 'LiteMode.DisableAlert'}); + } + }, + listenerSetter: this.listenerSetter + }); const liteModeRow = new Row({ icon: 'animations', @@ -143,11 +164,14 @@ export default class AppGeneralSettingsTab extends SliderSuperTabEventable { listenerSetter: this.listenerSetter }); + onUpdate(); + this.listenerSetter.add(rootScope)('settings_updated', onUpdate); container.append( range.container, chatBackgroundButton, + animationsRow.container, liteModeRow.container ); } diff --git a/src/components/sidebarLeft/tabs/powerSaving.ts b/src/components/sidebarLeft/tabs/powerSaving.ts index 219e58ad..54148991 100644 --- a/src/components/sidebarLeft/tabs/powerSaving.ts +++ b/src/components/sidebarLeft/tabs/powerSaving.ts @@ -39,8 +39,8 @@ export default class AppPowerSavingTab extends SliderSuperTab { 'all', 'video', 'gif', - ['stickers', ['stickers_panel', 'stickers_chat']], - ['emoji', ['emoji_panel', 'emoji_messages']], + // ['stickers', ['stickers_panel', 'stickers_chat']], + // ['emoji', ['emoji_panel', 'emoji_messages']], ['effects', ['effects_reactions', 'effects_premiumstickers', 'effects_emoji']], ['chat', ['chat_background', 'chat_spoilers']], 'animations' diff --git a/src/config/app.ts b/src/config/app.ts index de12f523..4ba4da1d 100644 --- a/src/config/app.ts +++ b/src/config/app.ts @@ -21,7 +21,7 @@ const App = { version: process.env.VERSION, versionFull: process.env.VERSION_FULL, build: +process.env.BUILD, - langPackVersion: '0.9.7', + langPackVersion: '0.9.8', langPack: 'webk', langPackCode: 'en', domains: MAIN_DOMAINS, diff --git a/src/helpers/liteMode.ts b/src/helpers/liteMode.ts index a9084e22..6663cc07 100644 --- a/src/helpers/liteMode.ts +++ b/src/helpers/liteMode.ts @@ -14,6 +14,10 @@ export type LiteModeKey = 'all' | 'gif' | 'video' | 'chat' | 'chat_background' | 'chat_spoilers' | 'animations'; export class LiteMode { + public isEnabled() { + return rootScope.settings.liteMode.all; + } + public isAvailable(key: LiteModeKey) { return !rootScope.settings.liteMode.all && !rootScope.settings.liteMode[key]; } diff --git a/src/lib/appManagers/utils/state/loadState.ts b/src/lib/appManagers/utils/state/loadState.ts index e4301ed7..475db22b 100644 --- a/src/lib/appManagers/utils/state/loadState.ts +++ b/src/lib/appManagers/utils/state/loadState.ts @@ -377,6 +377,12 @@ async function loadStateInner() { } } + if(state.build < 309) { + state.settings.liteMode.animations = !state.settings.animationsEnabled; + state.settings.liteMode.video = !state.settings.autoPlay.videos; + state.settings.liteMode.gif = !state.settings.autoPlay.gifs; + } + if(compareVersion(state.version, STATE_VERSION) !== 0) { newVersion = STATE_VERSION; oldVersion = state.version;