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

MOBILE-4565 a11y: Add alert to empty search message

main
Pau Ferrer Ocaña 2024-04-15 13:08:33 +02:00
parent 540beee17e
commit e87b05bd69
8 changed files with 16 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/addons/messages/pages/search/search.html
View File

@ -28,7 +28,7 @@
</ion-list>
<core-empty-box *ngIf="displayResults && !contacts.results.length && !nonContacts.results.length && !messages.results.length"
icon="fas-magnifying-glass" [message]="'core.noresults' | translate" />
icon="fas-magnifying-glass" [message]="'core.noresults' | translate" role="alert" />
</core-loading>
</core-split-view>
</ion-content>

2
src/addons/mod/forum/pages/search/search.html
View File

@ -31,7 +31,7 @@
<core-infinite-loading [enabled]="resultsSource.isLoaded() && !resultsSource.isCompleted()" (action)="loadMoreResults($event)"
[error]="loadMoreError" />
<core-empty-box *ngIf="resultsSource.isEmpty()" icon="fas-magnifying-glass" [dimmed]="!resultsSource.isLoaded()">
<core-empty-box *ngIf="resultsSource.isEmpty()" icon="fas-magnifying-glass" [dimmed]="!resultsSource.isLoaded()" role="alert">
<p *ngIf="!resultsSource.isLoaded()">{{ 'core.search.empty' | translate }}</p>
<ng-container *ngIf="resultsSource.isLoaded()">
<p><strong>{{ 'core.search.noresults' | translate: { $a: resultsSource.getQuery() } }}</strong></p>

4
src/addons/mod/glossary/components/index/addon-mod-glossary-index.html
View File

@ -24,7 +24,7 @@
<core-search-box *ngIf="isSearch" (onSubmit)="search($event)" [placeholder]="'addon.mod_glossary.searchquery' | translate"
[autoFocus]="true" [lengthCheck]="2" (onClear)="toggleSearch()" searchArea="AddonModGlossary-{{module.id}}" />
<core-loading [hideUntil]="!showLoading">
<core-loading [hideUntil]="!showLoading" [message]="loadingMessage">
<!-- Activity info. -->
<core-course-module-info *ngIf="!isSearch" [module]="module" [description]="description" [component]="component"
[componentId]="componentId" [courseId]="courseId" [hasDataToSync]="hasOffline" (completionChanged)="onCompletionChange()" />
@ -65,7 +65,7 @@
</ion-list>
<core-empty-box *ngIf="(!entries || !entries.hasEntries) && (!isSearch || hasSearched)" icon="fas-list"
[message]="'addon.mod_glossary.noentriesfound' | translate" />
[message]="'addon.mod_glossary.noentriesfound' | translate" [attr.role]="hasSearched ? 'alert' : null" />
<core-infinite-loading [enabled]="entries && !entries.completed && (!isSearch || hasSearched)" [error]="loadMoreError"
(action)="loadMoreEntries($event)" />

4
src/core/features/courses/pages/list/list.html
View File

@ -28,7 +28,7 @@
[placeholder]="'core.courses.search' | translate" [searchLabel]="'core.courses.search' | translate" [autoFocus]="searchMode"
searchArea="CoreCoursesSearch" [lengthCheck]="1" />
<core-loading [hideUntil]="loaded">
<core-loading [hideUntil]="loaded" [message]="loadingMessage">
<ng-container *ngIf="searchMode && searchTotal > 0">
<ion-item-divider>
<ion-label>
@ -45,7 +45,7 @@
<core-empty-box *ngIf="searchMode && !courses.length" icon="fas-magnifying-glass"
[message]="'core.courses.nosearchresults' | translate" />
[message]="'core.courses.nosearchresults' | translate" role="alert" />
<core-empty-box *ngIf="!searchMode && !courses.length" icon="fas-graduation-cap" [message]="'core.courses.nocourses' | translate" />

9
src/core/features/courses/pages/list/list.ts
View File

@ -49,6 +49,7 @@ export class CoreCoursesListPage implements OnInit, OnDestroy {
coursesLoaded = 0;
canLoadMore = false;
loadMoreError = false;
loadingMessage = Translate.instant('core.loading');
showOnlyEnrolled = false;
@ -176,6 +177,8 @@ export class CoreCoursesListPage implements OnInit, OnDestroy {
* @returns Promise resolved when done.
*/
protected async loadCourses(clearTheList = false): Promise<void> {
this.loadingMessage = Translate.instant('core.loading');
this.loadMoreError = false;
try {
@ -249,9 +252,10 @@ export class CoreCoursesListPage implements OnInit, OnDestroy {
this.searchTotal = 0;
this.logSearch = CoreTime.once(() => this.performLogSearch());
const modal = await CoreDomUtils.showModalLoading('core.searching', true);
this.loaded = false;
await this.searchCourses().finally(() => {
modal.dismiss();
this.loaded = true;
});
}
@ -310,6 +314,7 @@ export class CoreCoursesListPage implements OnInit, OnDestroy {
*/
protected async searchCourses(): Promise<void> {
this.loadMoreError = false;
this.loadingMessage = Translate.instant('core.searching');
try {
const response = await CoreCourses.search(this.searchText, this.searchPage, undefined, this.showOnlyEnrolled);

2
src/core/features/search/pages/global-search/global-search.html
View File

@ -35,7 +35,7 @@
[error]="loadMoreError" />
<core-empty-box *ngIf="resultsSource.isEmpty()" icon="fas-magnifying-glass" [dimmed]="!resultsSource.isLoaded()">
<p *ngIf="!resultsSource.isLoaded()">{{ 'core.search.empty' | translate }}</p>
<p *ngIf="!resultsSource.isLoaded()" role="alert">{{ 'core.search.empty' | translate }}</p>
<ng-container *ngIf="resultsSource.isLoaded()">
<p><strong>{{ 'core.search.noresults' | translate: { $a: resultsSource.getQuery() } }}</strong></p>
<p><small>{{ 'core.search.noresultshelp' | translate }}</small></p>

2
src/core/features/tag/pages/search/search.html
View File

@ -34,7 +34,7 @@
</ion-grid>
<core-loading [hideUntil]="loaded && !searching">
<core-empty-box *ngIf="!cloud || !cloud!.tags || !cloud!.tags.length" icon="fas-tags"
[message]="'core.tag.notagsfound' | translate: {$a: query}" />
[message]="'core.tag.notagsfound' | translate: {$a: query}" role="alert" />
<ng-container *ngIf="cloud && cloud!.tags && cloud!.tags.length > 0">
<div class="ion-text-center core-tag-cloud">

2
src/core/features/user/pages/participants/participants.html
View File

@ -12,7 +12,7 @@
[message]="'core.user.noparticipants' | translate" />
<core-empty-box *ngIf="participants.empty && !searchInProgress && searchQuery" icon="fas-magnifying-glass"
[message]="'core.noresults' | translate" />
[message]="'core.noresults' | translate" [attr.role]="searchQuery ? 'alert' : null" />
<ion-list *ngIf="!participants.empty">
<ion-item *ngFor="let participant of participants.items" class="ion-text-wrap"