62 lines
1.5 KiB
TypeScript
62 lines
1.5 KiB
TypeScript
/* Angular Imports */
|
|
import { Directive, Renderer2, ElementRef, HostBinding, ChangeDetectorRef, OnDestroy } from '@angular/core';
|
|
|
|
/* rxjs Imports */
|
|
import { Subscription } from 'rxjs';
|
|
import { map } from 'rxjs/operators';
|
|
|
|
/* Popover Ref */
|
|
import { PopoverRef } from './popover-ref';
|
|
|
|
/**
|
|
* Internal directive that shows the popover arrow.
|
|
*/
|
|
@Directive({
|
|
selector: '[mifosxPopoverArrow]'
|
|
})
|
|
export class PopoverArrowDirective implements OnDestroy {
|
|
@HostBinding('style.width.px')
|
|
@HostBinding('style.height.px')
|
|
arrowSize: number;
|
|
|
|
@HostBinding('style.top.px')
|
|
offsetTop: number;
|
|
|
|
@HostBinding('style.right.px')
|
|
offsetRight: number;
|
|
|
|
@HostBinding('style.bottom.px')
|
|
offsetBottom: number;
|
|
|
|
@HostBinding('style.left.px')
|
|
offsetLeft: number;
|
|
|
|
private subscription = new Subscription();
|
|
|
|
/**
|
|
* @param {PopoverRef} popoverRef PopoverRef.
|
|
* @param {ChangeDetectorRef} cd ChangeDetectorRef
|
|
*/
|
|
constructor(
|
|
private popoverRef: PopoverRef,
|
|
private cd: ChangeDetectorRef
|
|
) {
|
|
this.arrowSize = popoverRef.config.arrowSize;
|
|
|
|
this.subscription = popoverRef.positionChanges().subscribe((p) => {
|
|
const { offsetX, offsetY } = p.connectionPair;
|
|
|
|
this.offsetTop = offsetY >= 0 ? offsetY * -1 : null;
|
|
this.offsetLeft = offsetX < 0 ? offsetX * -1 : null;
|
|
this.offsetBottom = offsetY < 0 ? offsetY : null;
|
|
this.offsetRight = offsetX >= 0 ? offsetX : null;
|
|
|
|
this.cd.detectChanges();
|
|
});
|
|
}
|
|
|
|
ngOnDestroy(): void {
|
|
this.subscription.unsubscribe();
|
|
}
|
|
}
|