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

MOBILE-3833 user-tours: Fix flicking swipe tour

main
Pau Ferrer Ocaña 2022-04-06 14:12:43 +02:00
parent 7236dd34c1
commit 946292c0fd
1 changed files with 38 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
src/core/features/usertours/services/user-tours.ts
View File

@ -131,7 +131,7 @@ export class CoreUserToursService {
* @param acknowledge Whether to acknowledge that the user has seen this User Tour or not. * @param acknowledge Whether to acknowledge that the user has seen this User Tour or not.
*/ */
async dismiss(acknowledge: boolean = true): Promise<void> { async dismiss(acknowledge: boolean = true): Promise<void> {
await this.tours.find(({ visible }) => visible)?.component.dismiss(acknowledge); await this.getForegroundTour()?.dismiss(acknowledge);
} }
/** /**
@ -195,7 +195,7 @@ export class CoreUserToursService {
protected activateTour(tour: CoreUserToursUserTourComponent): void { protected activateTour(tour: CoreUserToursUserTourComponent): void {
// Handle show/dismiss lifecycle. // Handle show/dismiss lifecycle.
CoreSubscriptions.once(tour.beforeDismiss, () => { CoreSubscriptions.once(tour.beforeDismiss, () => {
const index = this.tours.findIndex(({ component }) => component === tour); const index = this.getTourIndex(tour);
if (index === -1) { if (index === -1) {
return; return;
@ -203,14 +203,17 @@ export class CoreUserToursService {
this.tours.splice(index, 1); this.tours.splice(index, 1);
const foregroundTour = this.tours.find(({ visible }) => visible); this.getForegroundTour()?.show();
foregroundTour?.component.show();
}); });
// Add to existing tours and show it if it's on top. // Add to existing tours and show it if it's on top.
const index = this.tours.findIndex(({ component }) => component === tour); const index = this.getTourIndex(tour);
const foregroundTour = this.tours.find(({ visible }) => visible); const previousForegroundTour = this.getForegroundTour();
if (previousForegroundTour?.id === tour.id) {
// Already activated.
return;
}
if (index !== -1) { if (index !== -1) {
this.tours[index].visible = true; this.tours[index].visible = true;
@ -221,35 +224,53 @@ export class CoreUserToursService {
}); });
} }
if (this.tours.find(({ visible }) => visible)?.component !== tour) { if (this.getForegroundTour()?.id !== tour.id) {
// Another tour is in use.
return; return;
} }
foregroundTour?.component.hide();
tour.show(); tour.show();
} }
/**
* Returns the first visible tour in the stack.
*
* @return foreground tour if found or undefined.
*/
protected getForegroundTour(): CoreUserToursUserTourComponent | undefined {
return this.tours.find(({ visible }) => visible)?.component;
}
/**
* Returns the tour index in the stack.
*
* @return Tour index if found or -1 otherwise.
*/
protected getTourIndex(tour: CoreUserToursUserTourComponent): number {
return this.tours.findIndex(({ component }) => component === tour);
}
/** /**
* Hide User Tour if visible. * Hide User Tour if visible.
* *
* @param tour User tour. * @param tour User tour.
*/ */
protected deactivateTour(tour: CoreUserToursUserTourComponent): void { protected deactivateTour(tour: CoreUserToursUserTourComponent): void {
const index = this.tours.findIndex(({ component }) => component === tour); const index = this.getTourIndex(tour);
const foregroundTourIndex = this.tours.findIndex(({ visible }) => visible);
if (index === -1) { if (index === -1) {
return; return;
} }
const foregroundTour = this.getForegroundTour();
this.tours[index].visible = false; this.tours[index].visible = false;
if (index === foregroundTourIndex) { if (foregroundTour?.id !== tour.id) {
tour.hide(); // Another tour is in use.
return;
this.tours.find(({ visible }) => visible)?.component.show();
} }
tour.hide();
} }
/** /**