@hmcts/media-viewer
Version:
57 lines • 6.71 kB
JavaScript
import { Directive, HostListener, Input } from '@angular/core';
import * as i0 from "@angular/core";
export class GrabNDragDirective {
constructor(el) {
this.el = el;
this.pointerDown = false;
this.dragEnabled = false;
}
onPointerDown(event) {
if (this.dragEnabled) {
event.preventDefault();
this.pointerDown = true;
this.originalPosition = {
left: event.clientX + this.el.nativeElement.scrollLeft,
top: event.clientY + this.el.nativeElement.scrollTop,
};
}
}
onPointerMove(event) {
if (this.pointerDown && this.dragEnabled) {
event.preventDefault();
const scrollDiff = {
left: this.originalPosition.left - (event.clientX + this.el.nativeElement.scrollLeft),
top: this.originalPosition.top - (event.clientY + this.el.nativeElement.scrollTop)
};
if (this.dragEnabled) {
this.dragX.scrollLeft += scrollDiff.left;
this.el.nativeElement.scrollTop += scrollDiff.top;
}
}
}
onWindowPointerUp() {
this.pointerDown = false;
}
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GrabNDragDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: GrabNDragDirective, selector: "[mvGrabNDrag]", inputs: { dragEnabled: "dragEnabled", dragX: "dragX" }, host: { listeners: { "pointerdown": "onPointerDown($event)", "window:pointermove": "onPointerMove($event)", "window:pointerup": "onWindowPointerUp()" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GrabNDragDirective, decorators: [{
type: Directive,
args: [{
selector: '[mvGrabNDrag]'
}]
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { dragEnabled: [{
type: Input
}], dragX: [{
type: Input
}], onPointerDown: [{
type: HostListener,
args: ['pointerdown', ['$event']]
}], onPointerMove: [{
type: HostListener,
args: ['window:pointermove', ['$event']]
}], onWindowPointerUp: [{
type: HostListener,
args: ['window:pointerup']
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JhYi1uLWRyYWcuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbWVkaWEtdmlld2VyL3NyYy9saWIvdmlld2Vycy9ncmFiLW4tZHJhZy5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBYyxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQU0zRSxNQUFNLE9BQU8sa0JBQWtCO0lBUTdCLFlBQW9CLEVBQWM7UUFBZCxPQUFFLEdBQUYsRUFBRSxDQUFZO1FBTDFCLGdCQUFXLEdBQUcsS0FBSyxDQUFDO1FBRW5CLGdCQUFXLEdBQUcsS0FBSyxDQUFDO0lBSTdCLENBQUM7SUFHRCxhQUFhLENBQUMsS0FBbUI7UUFDL0IsSUFBSSxJQUFJLENBQUMsV0FBVyxFQUFFLENBQUM7WUFDckIsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO1lBQ3ZCLElBQUksQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDO1lBQ3hCLElBQUksQ0FBQyxnQkFBZ0IsR0FBRztnQkFDdEIsSUFBSSxFQUFFLEtBQUssQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsVUFBVTtnQkFDdEQsR0FBRyxFQUFFLEtBQUssQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsU0FBUzthQUNyRCxDQUFDO1FBQ0osQ0FBQztJQUNILENBQUM7SUFHRCxhQUFhLENBQUMsS0FBbUI7UUFDL0IsSUFBSSxJQUFJLENBQUMsV0FBVyxJQUFJLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQztZQUN6QyxLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7WUFDdkIsTUFBTSxVQUFVLEdBQUc7Z0JBQ2pCLElBQUksRUFBRSxJQUFJLENBQUMsZ0JBQWdCLENBQUMsSUFBSSxHQUFHLENBQUMsS0FBSyxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsQ0FBQyxVQUFVLENBQUM7Z0JBQ3JGLEdBQUcsRUFBRSxJQUFJLENBQUMsZ0JBQWdCLENBQUMsR0FBRyxHQUFHLENBQUMsS0FBSyxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsQ0FBQyxTQUFTLENBQUM7YUFDbkYsQ0FBQztZQUNGLElBQUksSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO2dCQUNyQixJQUFJLENBQUMsS0FBSyxDQUFDLFVBQVUsSUFBSSxVQUFVLENBQUMsSUFBSSxDQUFDO2dCQUN6QyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsQ0FBQyxTQUFTLElBQUksVUFBVSxDQUFDLEdBQUcsQ0FBQztZQUNwRCxDQUFDO1FBQ0gsQ0FBQztJQUNILENBQUM7SUFFaUMsaUJBQWlCO1FBQ2pELElBQUksQ0FBQyxXQUFXLEdBQUcsS0FBSyxDQUFDO0lBQzNCLENBQUM7a0lBeENVLGtCQUFrQjtzSEFBbEIsa0JBQWtCOzs0RkFBbEIsa0JBQWtCO2tCQUg5QixTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxlQUFlO2lCQUMxQjsrRUFNVSxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFNTixhQUFhO3NCQURaLFlBQVk7dUJBQUMsYUFBYSxFQUFFLENBQUMsUUFBUSxDQUFDO2dCQWF2QyxhQUFhO3NCQURaLFlBQVk7dUJBQUMsb0JBQW9CLEVBQUUsQ0FBQyxRQUFRLENBQUM7Z0JBZVosaUJBQWlCO3NCQUFsRCxZQUFZO3VCQUFDLGtCQUFrQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSG9zdExpc3RlbmVyLCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1ttdkdyYWJORHJhZ10nXG59KVxuZXhwb3J0IGNsYXNzIEdyYWJORHJhZ0RpcmVjdGl2ZSB7XG5cbiAgb3JpZ2luYWxQb3NpdGlvbjogeyBsZWZ0OiBudW1iZXI7IHRvcDogbnVtYmVyIH07XG4gIHByaXZhdGUgcG9pbnRlckRvd24gPSBmYWxzZTtcblxuICBASW5wdXQoKSBkcmFnRW5hYmxlZCA9IGZhbHNlO1xuICBASW5wdXQoKSBkcmFnWDogRWxlbWVudDtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGVsOiBFbGVtZW50UmVmKSB7XG4gIH1cblxuICBASG9zdExpc3RlbmVyKCdwb2ludGVyZG93bicsIFsnJGV2ZW50J10pXG4gIG9uUG9pbnRlckRvd24oZXZlbnQ6IFBvaW50ZXJFdmVudCkge1xuICAgIGlmICh0aGlzLmRyYWdFbmFibGVkKSB7XG4gICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgdGhpcy5wb2ludGVyRG93biA9IHRydWU7XG4gICAgICB0aGlzLm9yaWdpbmFsUG9zaXRpb24gPSB7XG4gICAgICAgIGxlZnQ6IGV2ZW50LmNsaWVudFggKyB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuc2Nyb2xsTGVmdCxcbiAgICAgICAgdG9wOiBldmVudC5jbGllbnRZICsgdGhpcy5lbC5uYXRpdmVFbGVtZW50LnNjcm9sbFRvcCxcbiAgICAgIH07XG4gICAgfVxuICB9XG5cbiAgQEhvc3RMaXN0ZW5lcignd2luZG93OnBvaW50ZXJtb3ZlJywgWyckZXZlbnQnXSlcbiAgb25Qb2ludGVyTW92ZShldmVudDogUG9pbnRlckV2ZW50KSB7XG4gICAgaWYgKHRoaXMucG9pbnRlckRvd24gJiYgdGhpcy5kcmFnRW5hYmxlZCkge1xuICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgIGNvbnN0IHNjcm9sbERpZmYgPSB7XG4gICAgICAgIGxlZnQ6IHRoaXMub3JpZ2luYWxQb3NpdGlvbi5sZWZ0IC0gKGV2ZW50LmNsaWVudFggKyB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuc2Nyb2xsTGVmdCksXG4gICAgICAgIHRvcDogdGhpcy5vcmlnaW5hbFBvc2l0aW9uLnRvcCAtIChldmVudC5jbGllbnRZICsgdGhpcy5lbC5uYXRpdmVFbGVtZW50LnNjcm9sbFRvcClcbiAgICAgIH07XG4gICAgICBpZiAodGhpcy5kcmFnRW5hYmxlZCkge1xuICAgICAgICB0aGlzLmRyYWdYLnNjcm9sbExlZnQgKz0gc2Nyb2xsRGlmZi5sZWZ0O1xuICAgICAgICB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuc2Nyb2xsVG9wICs9IHNjcm9sbERpZmYudG9wO1xuICAgICAgfVxuICAgIH1cbiAgfVxuXG4gIEBIb3N0TGlzdGVuZXIoJ3dpbmRvdzpwb2ludGVydXAnKSBvbldpbmRvd1BvaW50ZXJVcCgpIHtcbiAgICB0aGlzLnBvaW50ZXJEb3duID0gZmFsc2U7XG4gIH1cbn1cbiJdfQ==