all files / component/tooltip/ tooltip.directive.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
 
 
 
 
 
 
 
 
1×
1×
1×
 
1×
 
 
 
 
1×
4×
1×
1×
1×
 
 
4×
 
4×
4×
 
4×
 
4×
3×
 
3×
 
 
 
 
 
3×
 
 
1×
 
 
/*
 *  @license
 *  Copyright Hôpitaux Universitaires de Genève. All Rights Reserved.
 *
 *  Use of this source code is governed by an Apache-2.0 license that can be
 *  found in the LICENSE file at https://github.com/DSI-HUG/dejajs-components/blob/master/LICENSE
 */
 
import { Directive, ElementRef, EventEmitter, Input, Output } from '@angular/core';
import { fromEvent as observableFromEvent, of as observableOf } from 'rxjs';
import { delay, switchMap, takeUntil } from 'rxjs/operators';
import { DejaConnectionPositionPair } from '../../common/core/overlay/connection-position-pair';
import { DejaTooltipService } from './tooltip.service';
 
@Directive({
    selector: '[deja-tooltip]',
})
export class DejaTooltipDirective {
    @Input('tooltip-delay') public delay = 600;
    @Input('tooltip-model') public model: any;
    @Input('deja-tooltip') public name: string;
    @Input('tooltip-positions') public positions: DejaConnectionPositionPair | string;
 
    // tslint:disable-next-line:no-output-rename
    @Output('tooltip-show') public show = new EventEmitter();
 
    constructor(elementRef: ElementRef, tooltipService: DejaTooltipService) {
        const element = elementRef.nativeElement as HTMLElement;
 
        const leave$ = observableFromEvent(element, 'mouseleave');
 
        observableFromEvent(element, 'mouseenter').pipe(
            switchMap((e) => observableOf(e).pipe(delay(this.delay), takeUntil(leave$))))
            .subscribe(() => {
                tooltipService.params[this.name] = {
                    model: this.model,
                    ownerElement: elementRef,
                    positions: this.positions,
                };
 
                this.show.emit();
            });
    }
}