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

Merge pull request #2568 from crazyserver/MOBILE-3572 

Mobile 3572
main
Juan Leyva 2020-10-21 13:36:27 +02:00 committed by GitHub
parent 099ca77221 5cf0204240
commit deb6438648
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 51 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/assets/lang/en.json
View File

@ -2001,6 +2001,7 @@
"core.settings.cannotsyncwithoutwifi": "Cannot synchronise because the current settings only allow to synchronise when connected to Wi-Fi. Please connect to a Wi-Fi network.",
"core.settings.colorscheme": "Color Scheme",
"core.settings.colorscheme-auto": "Auto (based on system settings)",
"core.settings.colorscheme-auto-notice": "Auto mode may not work in some Android devices.",
"core.settings.colorscheme-dark": "Dark",
"core.settings.colorscheme-light": "Light",
"core.settings.compilationinfo": "Compilation info",

1
src/core/settings/lang/en.json
View File

@ -7,6 +7,7 @@
"cannotsyncwithoutwifi": "Cannot synchronise because the current settings only allow to synchronise when connected to Wi-Fi. Please connect to a Wi-Fi network.",
"colorscheme": "Color Scheme",
"colorscheme-auto": "Auto (based on system settings)",
"colorscheme-auto-notice": "Auto mode may not work in some Android devices.",
"colorscheme-dark": "Dark",
"colorscheme-light": "Light",
"compilationinfo": "Compilation info",

5
src/core/settings/pages/general/general.html
View File

@ -20,7 +20,7 @@
</ion-segment-button>
</ion-segment>
</ion-item>
<ion-item text-wrap class="core-settings-general-color-scheme" *ngIf="colorSchemes.length > 0">
<ion-item text-wrap class="core-settings-general-color-scheme" *ngIf="colorSchemes.length > 0" [attr.no-lines]="selectedScheme=='auto' && isAndroid ? true : null">
<ion-label>
<h2>{{ 'core.settings.colorscheme' | translate }}</h2>
<p *ngIf="colorSchemeDisabled" class="text-danger">{{ 'core.settings.forcedsetting' | translate }}</p>
@ -29,6 +29,9 @@
<ion-option *ngFor="let scheme of colorSchemes" [value]="scheme">{{ 'core.settings.colorscheme-' + scheme | translate }}</ion-option>
</ion-select>
</ion-item>
<ion-item text-wrap *ngIf="colorSchemes.length > 0 && selectedScheme=='auto' && isAndroid">
<p class="text-danger">{{ 'core.settings.colorscheme-auto-notice' | translate }}</p>
</ion-item>
<ion-item text-wrap *ngIf="rteSupported">
<ion-label>
<h2>{{ 'core.settings.enablerichtexteditor' | translate }}</h2>

14
src/core/settings/pages/general/general.ts
View File

@ -15,6 +15,7 @@
import { Component, ViewChild } from '@angular/core';
import { IonicPage, Segment } from 'ionic-angular';
import { CoreConstants } from '@core/constants';
import { CoreApp } from '@providers/app';
import { CoreConfigProvider } from '@providers/config';
import { CoreFileProvider } from '@providers/file';
import { CoreEventsProvider } from '@providers/events';
@ -46,6 +47,7 @@ export class CoreSettingsGeneralPage {
colorSchemes = [];
selectedScheme: string;
colorSchemeDisabled: boolean;
isAndroid: boolean;
constructor(protected configProvider: CoreConfigProvider,
fileProvider: CoreFileProvider,
@ -71,17 +73,11 @@ export class CoreSettingsGeneralPage {
this.colorSchemes.push('light');
this.selectedScheme = this.colorSchemes[0];
} else {
let defaultColorScheme = 'light';
this.isAndroid = CoreApp.instance.isAndroid();
if (window.matchMedia('(prefers-color-scheme: dark)').matches ||
window.matchMedia('(prefers-color-scheme: light)').matches) {
this.colorSchemes.push('auto');
defaultColorScheme = 'auto';
}
this.colorSchemes.push('light');
this.colorSchemes.push('dark');
this.colorSchemes = this.settingsHelper.getAllowedColorSchemes();
this.configProvider.get(CoreConstants.SETTINGS_COLOR_SCHEME, defaultColorScheme).then((scheme) => {
this.configProvider.get(CoreConstants.SETTINGS_COLOR_SCHEME, 'light').then((scheme) => {
this.selectedScheme = scheme;
});
}

48
src/core/settings/providers/helper.ts
View File

@ -44,6 +44,7 @@ export interface CoreSiteSpaceUsage {
export class CoreSettingsHelper {
protected logger;
protected syncPromises = {};
protected colorSchemes: string[] = [];
constructor(loggerProvider: CoreLoggerProvider,
protected appProvider: CoreAppProvider,
@ -342,14 +343,7 @@ export class CoreSettingsHelper {
if (!!CoreConfigConstants.forceColorScheme) {
this.setColorScheme(CoreConfigConstants.forceColorScheme);
} else {
let defaultColorScheme = 'light';
if (window.matchMedia('(prefers-color-scheme: dark)').matches ||
window.matchMedia('(prefers-color-scheme: light)').matches) {
defaultColorScheme = 'auto';
}
this.configProvider.get(CoreConstants.SETTINGS_COLOR_SCHEME, defaultColorScheme).then((scheme) => {
this.configProvider.get(CoreConstants.SETTINGS_COLOR_SCHEME, 'light').then((scheme) => {
this.setColorScheme(scheme);
});
}
@ -388,6 +382,40 @@ export class CoreSettingsHelper {
document.documentElement.style.fontSize = fontSize + '%';
}
/**
* Get system allowed color schemes.
*
* @return Allowed color schemes.
*/
getAllowedColorSchemes(): string[] {
if (this.colorSchemes.length > 0) {
return this.colorSchemes;
}
if (!CoreConfigConstants.forceColorScheme) {
this.colorSchemes.push('light');
this.colorSchemes.push('dark');
if (window.matchMedia('(prefers-color-scheme)').media !== 'not all') {
this.colorSchemes.push('auto');
}
} else {
this.colorSchemes = [CoreConfigConstants.forceColorScheme];
}
return this.colorSchemes;
}
/**
* Toggle Dark on auto mode.
*
* @param dark If dark scheme should be set or removed.
*/
protected toggleDarkTheme(dark: boolean): void {
if (document.body.classList.contains('scheme-auto')) {
document.body.classList.toggle('scheme-dark', dark);
}
}
/**
* Set body color scheme.
*
@ -397,6 +425,10 @@ export class CoreSettingsHelper {
document.body.classList.remove('scheme-light');
document.body.classList.remove('scheme-dark');
document.body.classList.remove('scheme-auto');
const colorSchemes = this.getAllowedColorSchemes();
colorScheme = colorSchemes.indexOf(colorScheme) >= 0 ? colorScheme : colorSchemes[0];
document.body.classList.add('scheme-' + colorScheme);
}
}