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

MOBILE-4565 a11y: Do not let the user focus on elements in movement

main
Pau Ferrer Ocaña 2024-04-15 16:01:37 +02:00
parent 84ad9c1e97
commit 1b301dae58
2 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/core/components/swipe-slides/swipe-slides.html
View File

@ -1,4 +1,4 @@
<swiper-container #swiperRef *ngIf="loaded">
<swiper-container #swiperRef *ngIf="loaded" [attr.aria-busy]="activeSlideIndex ? 'true' : null">
<swiper-slide *ngFor="let item of items; index as index" [attr.aria-hidden]="!isActive(index)">
<ng-container *ngIf="template" [ngTemplateOutlet]="template" [ngTemplateOutletContext]="{item: item, active: isActive(index)}" />
</swiper-slide>

12
src/core/components/swipe-slides/swipe-slides.ts
View File

@ -72,7 +72,7 @@ export class CoreSwipeSlidesComponent<Item = unknown> implements OnChanges, OnDe
protected hostElement: HTMLElement;
protected unsubscribe?: () => void;
protected resizeListener: CoreEventObserver;
protected activeSlideIndexes: number[] = [];
protected activeSlideIndex?: number;
protected onReadyPromise = new CorePromisedValue<void>();
constructor(
@ -112,7 +112,7 @@ export class CoreSwipeSlidesComponent<Item = unknown> implements OnChanges, OnDe
* @returns Whether the slide is active.
*/
isActive(index: number): boolean {
return this.activeSlideIndexes.includes(index);
return this.activeSlideIndex === index;
}
/**
@ -153,7 +153,7 @@ export class CoreSwipeSlidesComponent<Item = unknown> implements OnChanges, OnDe
item: items[initialIndex],
};
this.activeSlideIndexes = [initialIndex];
this.activeSlideIndex = initialIndex;
this.manager.setSelectedItem(items[initialIndex]);
this.onWillChange.emit(initialItemData);
@ -268,7 +268,7 @@ export class CoreSwipeSlidesComponent<Item = unknown> implements OnChanges, OnDe
return;
}
this.activeSlideIndexes.push(currentItemData.index);
this.activeSlideIndex = undefined;
this.manager?.setSelectedItem(currentItemData.item);
this.onWillChange.emit(currentItemData);
@ -283,12 +283,12 @@ export class CoreSwipeSlidesComponent<Item = unknown> implements OnChanges, OnDe
async slideDidChange(): Promise<void> {
const currentItemData = await this.getCurrentSlideItemData();
if (!currentItemData) {
this.activeSlideIndexes = [];
this.activeSlideIndex = undefined;
return;
}
this.activeSlideIndexes = [currentItemData.index];
this.activeSlideIndex = currentItemData.index;
this.onDidChange.emit(currentItemData);