EVOgeek
/
Vmeda.Online
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-4081 settings: Fix font size change click on other elements

main
Pau Ferrer Ocaña 2022-11-23 09:45:53 +01:00
parent 84ab313556
commit ba150fb8b9
2 changed files with 54 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/core/features/settings/pages/general/general.html
View File

@ -15,7 +15,7 @@
<ion-label>
<h2>{{ 'core.settings.language' | translate }}</h2>
</ion-label>
<ion-select [(ngModel)]="selectedLanguage" (ionChange)="languageChanged()" interface="action-sheet"
<ion-select [(ngModel)]="selectedLanguage" (ionChange)="languageChanged($event)" interface="action-sheet"
[interfaceOptions]="{header: 'core.settings.language' | translate}">
<ion-select-option *ngFor="let entry of languages" [value]="entry.code">{{ entry.name }}</ion-select-option>
</ion-select>
@ -24,9 +24,9 @@
<ion-label>
<h2>{{ 'core.settings.fontsize' | translate }}</h2>
</ion-label>
<ion-segment [(ngModel)]="selectedZoomLevel" (ionChange)="zoomLevelChanged()" color="primary">
<ion-segment-button *ngFor="let zoomLevel of zoomLevels" [value]="zoomLevel.value"
[ngStyle]="{'font-size.px': zoomLevel.style}">
<ion-segment [(ngModel)]="selectedZoomLevel" color="primary">
<ion-segment-button *ngFor=" let zoomLevel of zoomLevels" [value]="zoomLevel.value"
[ngStyle]="{'font-size.px': zoomLevel.style}" (click)="zoomLevelChanged($event, zoomLevel.value)">
<ion-label>
{{ 'core.settings.fontsizecharacter' | translate }}
<!-- Empty element styled with the largest font size, so all buttons share a common baseline. -->
@ -40,7 +40,7 @@
<h2>{{ 'core.settings.colorscheme' | translate }}</h2>
<p *ngIf="colorSchemeDisabled" class="text-danger">{{ 'core.settings.forcedsetting' | translate }}</p>
</ion-label>
<ion-select [(ngModel)]="selectedScheme" (ionChange)="colorSchemeChanged()" interface="action-sheet"
<ion-select [(ngModel)]="selectedScheme" (ionChange)="colorSchemeChanged($event)" interface="action-sheet"
[disabled]="colorSchemeDisabled" [interfaceOptions]="{header: 'core.settings.colorscheme' | translate}">
<ion-select-option *ngFor="let scheme of colorSchemes" [value]="scheme">
{{ 'core.settings.colorscheme-' + scheme | translate }}</ion-select-option>
@ -56,13 +56,13 @@
<h2>{{ 'core.settings.enablerichtexteditor' | translate }}</h2>
<p>{{ 'core.settings.enablerichtexteditordescription' | translate }}</p>
</ion-label>
<ion-toggle [(ngModel)]="richTextEditor" (ionChange)="richTextEditorChanged()"></ion-toggle>
<ion-toggle [(ngModel)]="richTextEditor" (ionChange)="richTextEditorChanged($event)"></ion-toggle>
</ion-item>
<ion-item class="ion-text-wrap" *ngIf="displayIframeHelp">
<ion-label>
<h2>{{ 'core.settings.ioscookies' | translate }}</h2>
<p>{{ 'core.settings.ioscookiesdescription' | translate }}</p>
<ion-button expand="block" (click)="openNativeSettings()">
<ion-button expand="block" (click)="openNativeSettings($event)">
{{ 'core.opensettings' | translate }}
</ion-button>
</ion-label>
@ -72,14 +72,14 @@
<h2>{{ 'core.settings.debugdisplay' | translate }}</h2>
<p>{{ 'core.settings.debugdisplaydescription' | translate }}</p>
</ion-label>
<ion-toggle [(ngModel)]="debugDisplay" (ionChange)="debugDisplayChanged()"></ion-toggle>
<ion-toggle [(ngModel)]="debugDisplay" (ionChange)="debugDisplayChanged($event)"></ion-toggle>
</ion-item>
<ion-item class="ion-text-wrap" *ngIf="analyticsSupported">
<ion-label>
<h2>{{ 'core.settings.enablefirebaseanalytics' | translate }}</h2>
<p>{{ 'core.settings.enablefirebaseanalyticsdescription' | translate }}</p>
</ion-label>
<ion-toggle [(ngModel)]="analyticsEnabled" (ionChange)="analyticsEnabledChanged()"></ion-toggle>
<ion-toggle [(ngModel)]="analyticsEnabled" (ionChange)="analyticsEnabledChanged($event)"></ion-toggle>
</ion-item>
</ion-list>
</ion-content>

52
src/core/features/settings/pages/general/general.ts
View File

@ -111,8 +111,13 @@ export class CoreSettingsGeneralPage {
/**
* Called when a new language is selected.
*
* @param ev: Event
*/
async languageChanged(): Promise<void> {
async languageChanged(ev: Event): Promise<void> {
ev.stopPropagation();
ev.preventDefault();
const previousLanguage = await CoreLang.getCurrentLanguage();
if (this.selectedLanguage === previousLanguage) {
// Prevent opening again.
@ -177,8 +182,16 @@ export class CoreSettingsGeneralPage {
/**
* Called when a new zoom level is selected.
*
* @param ev: Event
* @param value: New value
*/
zoomLevelChanged(): void {
zoomLevelChanged(ev: Event, value: CoreZoomLevel): void {
ev.stopPropagation();
ev.preventDefault();
this.selectedZoomLevel = value;
this.zoomLevels = this.zoomLevels.map((fontSize) => {
fontSize.selected = fontSize.value === this.selectedZoomLevel;
@ -191,31 +204,51 @@ export class CoreSettingsGeneralPage {
/**
* Called when a new color scheme is selected.
*
* @param ev: Event
*/
colorSchemeChanged(): void {
colorSchemeChanged(ev: Event): void {
ev.stopPropagation();
ev.preventDefault();
CoreSettingsHelper.setColorScheme(this.selectedScheme);
CoreConfig.set(CoreConstants.SETTINGS_COLOR_SCHEME, this.selectedScheme);
}
/**
* Called when the rich text editor is enabled or disabled.
*
* @param ev: Event
*/
richTextEditorChanged(): void {
richTextEditorChanged(ev: Event): void {
ev.stopPropagation();
ev.preventDefault();
CoreConfig.set(CoreConstants.SETTINGS_RICH_TEXT_EDITOR, this.richTextEditor ? 1 : 0);
}
/**
* Called when the debug display setting is enabled or disabled.
*
* @param ev: Event
*/
debugDisplayChanged(): void {
debugDisplayChanged(ev: Event): void {
ev.stopPropagation();
ev.preventDefault();
CoreConfig.set(CoreConstants.SETTINGS_DEBUG_DISPLAY, this.debugDisplay ? 1 : 0);
CoreDomUtils.setDebugDisplay(this.debugDisplay);
}
/**
* Called when the analytics setting is enabled or disabled.
*
* @param ev: Event
*/
async analyticsEnabledChanged(): Promise<void> {
async analyticsEnabledChanged(ev: Event): Promise<void> {
ev.stopPropagation();
ev.preventDefault();
await CorePushNotifications.enableAnalytics(this.analyticsEnabled);
CoreConfig.set(CoreConstants.SETTINGS_ANALYTICS_ENABLED, this.analyticsEnabled ? 1 : 0);
@ -223,8 +256,13 @@ export class CoreSettingsGeneralPage {
/**
* Open native settings.
*
* @param ev: Event
*/
openNativeSettings(): void {
openNativeSettings(ev: Event): void {
ev.stopPropagation();
ev.preventDefault();
Diagnostic.switchToSettings();
}