MOBILE-3565 directives: Add long press gesture directive

src/app/directives/directives.module.ts

@@ -0,0 +1,27 @@
+// (C) Copyright 2015 Moodle Pty Ltd.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import { NgModule } from '@angular/core';
+import { CoreLongPressDirective } from './long-press.directive';
+
+@NgModule({
+    declarations: [
+        CoreLongPressDirective,
+    ],
+    imports: [],
+    exports: [
+        CoreLongPressDirective,
+    ],
+})
+export class CoreDirectivesModule {}

src/app/directives/long-press.directive.ts

@@ -0,0 +1,59 @@
+// (C) Copyright 2015 Moodle Pty Ltd.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+// Based on https://medium.com/madewithply/ionic-4-long-press-gestures-96cf1e44098b
+
+import { Directive, ElementRef, OnInit, OnDestroy, Output, EventEmitter } from '@angular/core';
+import { Gesture } from '@ionic/angular';
+import { GestureController } from '@singletons/core.singletons';
+/**
+ * Directive to add long press actions to html elements.
+ */
+@Directive({
+    selector: '[longPress]',
+})
+export class CoreLongPressDirective implements OnInit, OnDestroy {
+
+    element: HTMLElement;
+    pressGesture: Gesture;
+
+    @Output() longPress = new EventEmitter();
+
+    constructor(el: ElementRef) {
+        this.element = el.nativeElement;
+        this.element.setAttribute('tappable', '');
+    }
+
+    /**
+     * Initialize gesture listening.
+     */
+    ngOnInit(): void {
+        this.pressGesture = GestureController.instance.create({
+            el: this.element,
+            threshold: 0,
+            gestureName: 'longpress',
+            onEnd: ev => this.longPress.emit(ev.event),
+        }, true);
+
+        this.pressGesture.enable();
+    }
+
+    /**
+     * Destroy gesture listening.
+     */
+    ngOnDestroy(): void {
+        this.pressGesture.destroy();
+    }
+
+}

src/app/singletons/core.singletons.ts

@@ -21,6 +21,7 @@ import {
     LoadingController as LoadingControllerService,
     ModalController as ModalControllerService,
     ToastController as ToastControllerService,
+    GestureController as GestureControllerService,
 } from '@ionic/angular';
 
 import { Clipboard as ClipboardService } from '@ionic-native/clipboard/ngx';
@@ -99,6 +100,7 @@ export class AlertController extends makeSingleton(AlertControllerService) {}
 export class LoadingController extends makeSingleton(LoadingControllerService) {}
 export class ModalController extends makeSingleton(ModalControllerService) {}
 export class ToastController extends makeSingleton(ToastControllerService) {}
+export class GestureController extends makeSingleton(GestureControllerService) {}
 
 // Convert external libraries injectables.
 export class Translate extends makeSingleton(TranslateService) {}