Merge pull request #3462 from crazyserver/MOBILE-4081

Mobile 4081
main
Dani Palou 2022-11-23 12:15:13 +01:00 committed by GitHub
commit a61fab5f70
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 170 additions and 87 deletions

View File

@ -9,18 +9,28 @@
</ion-toolbar>
</ion-header>
<ion-content>
<ion-refresher slot="fixed" [disabled]="!devicesLoaded" (ionRefresh)="refreshDevices($event.target)">
<ion-refresher slot="fixed" [disabled]="!loaded" (ionRefresh)="refreshDevices($event.target)">
<ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
</ion-refresher>
<core-loading [hideUntil]="devicesLoaded">
<core-loading [hideUntil]="loaded">
<ng-container *ngFor="let platform of platformDevices">
<ion-item-divider class="ion-text-wrap">
<ion-label>
<h2>{{ platform.platform }}</h2>
</ion-label>
</ion-item-divider>
<ion-card>
<ion-list>
<ion-item class="ion-text-wrap" *ngFor="let device of devices" [class.item-current]="device.current">
<ion-label [class.core-bold]="device.current">
<ion-item class="ion-text-wrap" *ngFor="let device of platform.devices" [class.item-current]="device.current">
<ion-label>
<p class="item-heading">
{{ device.name }} {{ device.model }}
<span *ngIf="device.current">({{ 'core.currentdevice' | translate }})</span>
<strong>{{ device.name }} {{ device.model }}</strong> ({{platform.platform}} {{ device.version }})
</p>
<p *ngIf="device.current"><strong>{{ 'core.currentdevice' | translate }}</strong></p>
<p>
{{ 'core.lastmodified' | translate }}: {{ device.timemodified * 1000 |
coreFormatDate:'strftimedatetimeshort' }}
</p>
<p>{{ device.platform }} {{ device.version }}</p>
</ion-label>
<core-button-with-spinner [loading]="device.updating" slot="end">
<ion-toggle [(ngModel)]="device.enable" (ngModelChange)="enableDevice(device, device.enable)">
@ -28,5 +38,7 @@
</core-button-with-spinner>
</ion-item>
</ion-list>
</ion-card>
</ng-container>
</core-loading>
</ion-content>

View File

@ -29,13 +29,13 @@ import { CoreUtils } from '@services/utils/utils';
})
export class AddonMessageOutputAirnotifierDevicesPage implements OnInit, OnDestroy {
devices?: AddonMessageOutputAirnotifierDeviceFormatted[] = [];
devicesLoaded = false;
platformDevices: AddonMessageOutputAirnotifierPlatformDevices[] = [];
loaded = false;
protected updateTimeout?: number;
/**
* Component being initialized.
* @inheritdoc
*/
ngOnInit(): void {
this.fetchDevices();
@ -49,12 +49,11 @@ export class AddonMessageOutputAirnotifierDevicesPage implements OnInit, OnDestr
protected async fetchDevices(): Promise<void> {
try {
const devices = await AddonMessageOutputAirnotifier.getUserDevices();
this.devices = this.formatDevices(devices);
this.formatDevices(devices);
} catch (error) {
CoreDomUtils.showErrorModal(error);
} finally {
this.devicesLoaded = true;
this.loaded = true;
}
}
@ -62,24 +61,37 @@ export class AddonMessageOutputAirnotifierDevicesPage implements OnInit, OnDestr
* Add some calculated data for devices.
*
* @param devices Devices to format.
* @return Formatted devices.
*/
protected formatDevices(devices: AddonMessageOutputAirnotifierDevice[]): AddonMessageOutputAirnotifierDeviceFormatted[] {
const formattedDevices: AddonMessageOutputAirnotifierDeviceFormatted[] = devices;
protected formatDevices(devices: AddonMessageOutputAirnotifierDevice[]): void {
this.platformDevices = [];
const formattedDevices: Record<string, AddonMessageOutputAirnotifierPlatformDevices> = {};
const pushId = CorePushNotifications.getPushId();
// Convert enabled to boolean and search current device.
formattedDevices.forEach((device) => {
devices.forEach((device: AddonMessageOutputAirnotifierDeviceFormatted) => {
if (formattedDevices[device.platform] === undefined) {
formattedDevices[device.platform] = {
platform: device.platform,
devices: [],
};
}
device.enable = !!device.enable;
device.current = !!(pushId && pushId == device.pushid);
device.current = pushId === device.pushid;
formattedDevices[device.platform].devices.push(device);
});
return formattedDevices.sort((a, b) => {
const compareA = a.name.toLowerCase();
const compareB = b.name.toLowerCase();
for (const platform in formattedDevices) {
const devices = formattedDevices[platform];
devices.devices.sort((a, b) => b.timemodified - a.timemodified);
return compareA.localeCompare(compareB);
});
devices.platform = devices.platform.replace('-fcm', '');
this.platformDevices.push(devices);
}
}
/**
@ -145,7 +157,7 @@ export class AddonMessageOutputAirnotifierDevicesPage implements OnInit, OnDestr
}
/**
* Page destroyed.
* @inheritdoc
*/
ngOnDestroy(): void {
// If there is a pending action to update devices, execute it right now.
@ -157,6 +169,11 @@ export class AddonMessageOutputAirnotifierDevicesPage implements OnInit, OnDestr
}
type AddonMessageOutputAirnotifierPlatformDevices = {
platform: string;
devices: AddonMessageOutputAirnotifierDeviceFormatted[];
};
/**
* User device with some calculated data.
*/

View File

@ -13,31 +13,56 @@
<ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
</ion-refresher>
<core-loading [hideUntil]="preferencesLoaded">
<!-- General settings. -->
<ion-card>
<ion-list>
<ion-item-divider class="ion-text-wrap">
<ion-label>
<h2>{{ 'core.settings.general' | translate }}</h2>
</ion-label>
</ion-item-divider>
<ion-item class="ion-text-wrap">
<ion-label>
<p>{{ 'addon.messages.useentertosend' | translate }}</p>
</ion-label>
<ion-toggle [(ngModel)]="sendOnEnter" (ngModelChange)="sendOnEnterChanged()" slot="end"></ion-toggle>
</ion-item>
</ion-list>
</ion-card>
<!-- Contactable privacy. -->
<ion-card>
<ion-item *ngIf="!advancedContactable">
<ion-label>{{ 'addon.messages.blocknoncontacts' | translate }}</ion-label>
<ion-toggle [(ngModel)]="contactablePrivacy" (ngModelChange)="saveContactablePrivacy(contactablePrivacy)">
<ion-label class="ion-text-wrap">
<p>{{ 'addon.messages.blocknoncontacts' | translate }}</p>
</ion-label>
<ion-toggle [(ngModel)]="contactablePrivacy" (ngModelChange)="saveContactablePrivacy(contactablePrivacy)" slot="end">
</ion-toggle>
</ion-item>
<ion-list *ngIf="advancedContactable" class="ion-text-wrap">
<ion-list *ngIf="advancedContactable">
<ion-radio-group [(ngModel)]="contactablePrivacy" (ionChange)="saveContactablePrivacy(contactablePrivacy)">
<ion-item-divider>
<ion-label>
<h2>{{ 'addon.messages.contactableprivacy' | translate }}</h2>
</ion-label>
</ion-item-divider>
<ion-item>
<ion-label>{{ 'addon.messages.contactableprivacy_onlycontacts' | translate }}</ion-label>
<ion-item class="ion-text-wrap">
<ion-label>
<p>{{ 'addon.messages.contactableprivacy_onlycontacts' | translate }}</p>
</ion-label>
<ion-radio slot="start" [value]="onlyContactsValue"></ion-radio>
</ion-item>
<ion-item>
<ion-label>{{ 'addon.messages.contactableprivacy_coursemember' | translate }}</ion-label>
<ion-item class="ion-text-wrap">
<ion-label>
<p>{{ 'addon.messages.contactableprivacy_coursemember' | translate }}</p>
</ion-label>
<ion-radio slot="start" [value]="courseMemberValue"></ion-radio>
</ion-item>
<ion-item *ngIf="allowSiteMessaging">
<ion-label>{{ 'addon.messages.contactableprivacy_site' | translate }}</ion-label>
<ion-item *ngIf="allowSiteMessaging" class="ion-text-wrap">
<ion-label>
<p>{{ 'addon.messages.contactableprivacy_site' | translate }}</p>
</ion-label>
<ion-radio slot="start" [value]="siteValue"></ion-radio>
</ion-item>
</ion-radio-group>
@ -53,23 +78,6 @@
<ng-container *ngTemplateOutlet="settings; context: {preferences: preferences}"></ng-container>
</ng-container>
</ng-container>
<!-- General settings. -->
<ion-card>
<ion-list class="ion-text-wrap">
<ion-item-divider>
<ion-label>
<h2>{{ 'core.settings.general' | translate }}</h2>
</ion-label>
</ion-item-divider>
<ion-item class="ion-text-wrap">
<ion-label>
<p class="item-heading">{{ 'addon.messages.useentertosend' | translate }}</p>
</ion-label>
<ion-toggle [(ngModel)]="sendOnEnter" (ngModelChange)="sendOnEnterChanged()" slot="end"></ion-toggle>
</ion-item>
</ion-list>
</ion-card>
</core-loading>
</ion-content>
@ -94,18 +102,20 @@
<!-- If notifications not disabled, show toggles.
If notifications are disabled, show "Disabled" instead of toggle. -->
<ion-item *ngFor="let state of ['loggedin', 'loggedoff']" class="ion-text-wrap">
<ion-label>{{ 'core.settings.' + state | translate }}</ion-label>
<ion-label>
<p>{{ 'core.settings.' + state | translate }}</p>
</ion-label>
<ng-container *ngIf="!preferences.disableall">
<!-- If notifications enabled, show toggle. -->
<core-button-with-spinner *ngIf="!processor.locked" [loading]="notification['updating'+state]">
<core-button-with-spinner *ngIf="!processor.locked" [loading]="notification['updating'+state]" slot="end">
<ion-toggle [(ngModel)]="processor[state].checked"
(ngModelChange)="changePreferenceLegacy(notification, processor, state)">
</ion-toggle>
</core-button-with-spinner>
<span *ngIf="processor.locked && processor[state].checked" class="text-gray">
<span *ngIf="processor.locked && processor[state].checked" class="text-gray" slot="end">
{{'core.settings.forced' | translate }}
</span>
<span *ngIf="processor.locked && !processor[state].checked" class="text-gray">
<span *ngIf="processor.locked && !processor[state].checked" class="text-gray" slot="end">
{{'core.settings.disallowed' | translate }}
</span>
</ng-container>
@ -129,18 +139,20 @@
<ng-container *ngFor="let processor of notification.processors">
<!-- If group messaging is enabled, display a simplified view. -->
<ion-item class="ion-text-wrap">
<ion-label>{{ processor.displayname }}</ion-label>
<ion-label>
<p>{{ processor.displayname }}</p>
</ion-label>
<ng-container *ngIf="!preferences.disableall">
<!-- If notifications enabled, show toggle. -->
<core-button-with-spinner *ngIf="!processor.locked" [loading]="notification.updating">
<core-button-with-spinner *ngIf="!processor.locked" [loading]="notification.updating" slot="end">
<ion-toggle [(ngModel)]="processor.enabled" (ngModelChange)="changePreference(notification, processor)">
</ion-toggle>
</core-button-with-spinner>
<span class="text-gray" *ngIf="processor.locked">
<span class="text-gray" *ngIf="processor.locked" slot="end">
{{ processor.lockedmessage }}
</span>
</ng-container>
<span *ngIf="preferences.disableall" class="text-gray">{{ 'core.settings.disabled' | translate }}</span>
<span *ngIf="preferences.disableall" class="text-gray" slot="end">{{ 'core.settings.disabled' | translate }}</span>
</ion-item>
</ng-container>
</ion-card>

View File

@ -70,9 +70,7 @@ export class AddonMessagesSettingsPage implements OnInit, OnDestroy {
}
/**
* Runs when the page has loaded. This event only happens once per page being created.
* If a page leaves but is cached, then this event will not fire again on a subsequent viewing.
* Setup code for the page.
* @inheritdoc
*/
ngOnInit(): void {
this.fetchPreferences();
@ -261,6 +259,9 @@ export class AddonMessagesSettingsPage implements OnInit, OnDestroy {
});
}
/**
* Send on Enter toggle has changed.
*/
sendOnEnterChanged(): void {
// Save the value.
CoreConfig.set(CoreConstants.SETTINGS_SEND_ON_ENTER, this.sendOnEnter ? 1 : 0);
@ -274,7 +275,7 @@ export class AddonMessagesSettingsPage implements OnInit, OnDestroy {
}
/**
* Page destroyed.
* @inheritdoc
*/
ngOnDestroy(): void {
// If there is a pending action to update preferences, execute it right now.

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>

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();
}

View File

@ -327,6 +327,9 @@ ion-button.button-outline {
--background: var(--core-input-background);
--color: var(--core-input-text);
--ion-color-primary: var(--core-input-text);
&.ios {
--color-activated: var(--contrast-background);
}
}
ion-button.button-solid {