MOBILE-4081 airnotifier: Improve devices list format
parent
eac671c5b3
commit
9b6a1e04fe
|
@ -9,24 +9,36 @@
|
|||
</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">
|
||||
<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">
|
||||
<p class="item-heading">
|
||||
{{ device.name }} {{ device.model }}
|
||||
<span *ngIf="device.current">({{ 'core.currentdevice' | translate }})</span>
|
||||
</p>
|
||||
<p>{{ device.platform }} {{ device.version }}</p>
|
||||
<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>
|
||||
<core-button-with-spinner [loading]="device.updating" slot="end">
|
||||
<ion-toggle [(ngModel)]="device.enable" (ngModelChange)="enableDevice(device, device.enable)">
|
||||
</ion-toggle>
|
||||
</core-button-with-spinner>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
</ion-item-divider>
|
||||
<ion-card>
|
||||
<ion-list>
|
||||
<ion-item class="ion-text-wrap" *ngFor="let device of platform.devices" [class.item-current]="device.current">
|
||||
<ion-label>
|
||||
<p class="item-heading">
|
||||
<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>
|
||||
</ion-label>
|
||||
<core-button-with-spinner [loading]="device.updating" slot="end">
|
||||
<ion-toggle [(ngModel)]="device.enable" (ngModelChange)="enableDevice(device, device.enable)">
|
||||
</ion-toggle>
|
||||
</core-button-with-spinner>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
</ion-card>
|
||||
</ng-container>
|
||||
</core-loading>
|
||||
</ion-content>
|
||||
|
|
|
@ -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.
|
||||
*/
|
||||
|
|
Loading…
Reference in New Issue