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

MOBILE-3947 reminders: Fix reminder button a11y roles

Browse Source
This commit is contained in:
Noel De Martin 2024-01-11 15:24:14 +01:00
parent b65b1a3e1f
commit 21d0dc6821
3 changed files with 29 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/core/features/reminders/components/date/date.html
View File

@ -4,4 +4,4 @@
</div>
<core-reminders-set-button *ngIf="showReminderButton" slot="end" [component]="component" [instanceId]="instanceId" [type]="type"
[label]="label" [timebefore]="timebefore" [time]="time" [title]="title" [url]="url" />
[label]="label" [initialTimebefore]="timebefore" [time]="time" [title]="title" [url]="url" />

5
src/core/features/reminders/components/set-button/set-button.html
View File

@ -1,6 +1,7 @@
<ion-button fill="clear" size="small" (click)="setReminder($event)"
[attr.aria-label]="'core.reminders.setareminderfor' | translate : { title: title, label: labelClean }"
[attr.aria-checked]="timebefore !== undefined">
[attr.aria-label]="'core.reminders.setareminderfor' | translate : { title: title, label: labelClean }">
<ion-icon name="fas-bell" slot="icon-only" *ngIf="timebefore !== undefined" aria-hidden="true" />
<ion-icon name="far-bell-slash" slot="icon-only" *ngIf="timebefore === undefined" aria-hidden="true" />
</ion-button>
<span class="sr-only" role="status" *ngIf="reminderMessage">{{ reminderMessage }}</span>

29
src/core/features/reminders/components/set-button/set-button.ts
View File

@ -32,18 +32,22 @@ export class CoreRemindersSetButtonComponent implements OnInit {
@Input() instanceId?: number;
@Input() type?: string;
@Input() label = '';
@Input() timebefore?: number;
@Input() initialTimebefore?: number;
@Input() time = -1;
@Input() title = '';
@Input() url = '';
labelClean = '';
timebefore?: number;
reminderMessage?: string;
/**
* @inheritdoc
*/
ngOnInit(): void {
this.labelClean = this.label.replace(':', '');
this.setTimebefore(this.initialTimebefore);
}
/**
@ -86,6 +90,23 @@ export class CoreRemindersSetButtonComponent implements OnInit {
this.saveReminder(reminderTime.timeBefore);
}
/**
* Update time before.
*/
setTimebefore(timebefore: number | undefined): void {
this.timebefore = timebefore;
if (this.timebefore !== undefined) {
const reminderTime = this.time - this.timebefore;
this.reminderMessage = Translate.instant('core.reminders.reminderset', {
$a: CoreTimeUtils.userDate(reminderTime * 1000),
});
} else {
this.reminderMessage = undefined;
}
}
/**
* Save reminder.
*
@ -105,18 +126,18 @@ export class CoreRemindersSetButtonComponent implements OnInit {
});
if (timebefore === undefined || timebefore === CoreRemindersService.DISABLED) {
this.timebefore = undefined;
this.setTimebefore(undefined);
CoreDomUtils.showToast('core.reminders.reminderunset', true);
return;
}
this.timebefore = timebefore;
this.setTimebefore(timebefore);
const reminder: CoreReminderData = {
timebefore,
component: this.component,
instanceId: this.instanceId,
timebefore: this.timebefore,
type: this.type,
title: this.label + ' ' + this.title,
url: this.url,