CIT/Vmeda.Online
3
0
Fork 1
forked from EVOgeek/Vmeda.Online
Code Pull Requests Activity

MOBILE-3833 core: Fix RTL swipe navigation

Browse Source
This commit is contained in:
Noel De Martin 2022-03-10 15:46:00 +01:00
parent f5c9c3d022
commit d6795d72b5
1 changed files with 37 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/core/directives/swipe-navigation.ts
View File

@ -16,7 +16,7 @@ import { AfterViewInit, Directive, ElementRef, Input, OnDestroy } from '@angula
import { CoreSwipeNavigationItemsManager } from '@classes/items-management/swipe-navigation-items-manager'; import { CoreSwipeNavigationItemsManager } from '@classes/items-management/swipe-navigation-items-manager';
import { Gesture, GestureDetail } from '@ionic/angular'; import { Gesture, GestureDetail } from '@ionic/angular';
import { CoreScreen } from '@services/screen'; import { CoreScreen } from '@services/screen';
import { GestureController } from '@singletons'; import { GestureController, Platform } from '@singletons';
const ACTIVATION_THRESHOLD = 150; const ACTIVATION_THRESHOLD = 150;
const SWIPE_FRICTION = 0.6; const SWIPE_FRICTION = 0.6;
@ -74,25 +74,55 @@ export class CoreSwipeNavigationDirective implements AfterViewInit, OnDestroy {
} }
/** /**
* Swipe to previous item. * Move to item to the left.
*/ */
swipeLeft(): void { swipeLeft(): void {
if (!this.enabled) { if (!this.enabled) {
return; return;
} }
this.manager?.navigateToNextItem(); Platform.isRTL
? this.manager?.navigateToPreviousItem()
: this.manager?.navigateToNextItem();
} }
/** /**
* Swipe to next item. * Move to item to the right.
*/ */
swipeRight(): void { swipeRight(): void {
if (!this.enabled) { if (!this.enabled) {
return; return;
} }
this.manager?.navigateToPreviousItem(); Platform.isRTL
? this.manager?.navigateToNextItem()
: this.manager?.navigateToPreviousItem();
}
/**
* Check whether there is an item to the right of the current selection.
*/
protected async hasItemRight(): Promise<boolean> {
if (!this.manager) {
return false;
}
return Platform.isRTL
? await this.manager.hasNextItem()
: await this.manager.hasPreviousItem();
}
/**
* Check whether there is an item to the left of the current selection.
*/
protected async hasItemLeft(): Promise<boolean> {
if (!this.manager) {
return false;
}
return Platform.isRTL
? await this.manager.hasPreviousItem()
: await this.manager.hasNextItem();
} }
/** /**
@ -127,7 +157,7 @@ export class CoreSwipeNavigationDirective implements AfterViewInit, OnDestroy {
protected async onRelease(event: GestureDetail): Promise<void> { protected async onRelease(event: GestureDetail): Promise<void> {
this.element.style.transition = '.5s ease-out'; this.element.style.transition = '.5s ease-out';
if (event.deltaX > ACTIVATION_THRESHOLD && await this.manager?.hasPreviousItem()) { if (event.deltaX > ACTIVATION_THRESHOLD && await this.hasItemRight()) {
this.preventClickOnElement(); this.preventClickOnElement();
this.swipeRight(); this.swipeRight();
@ -136,7 +166,7 @@ export class CoreSwipeNavigationDirective implements AfterViewInit, OnDestroy {
return; return;
} }
if (event.deltaX < -ACTIVATION_THRESHOLD && await this.manager?.hasNextItem()) { if (event.deltaX < -ACTIVATION_THRESHOLD && await this.hasItemLeft()) {
this.element.style.transform = 'translateX(-100%) !important'; this.element.style.transform = 'translateX(-100%) !important';
this.preventClickOnElement(); this.preventClickOnElement();