@progress/kendo-angular-gantt
Version:
Kendo UI Angular Gantt
84 lines (83 loc) • 4.75 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { Directive, ElementRef, Input, NgZone } from '@angular/core';
import { Subscription } from 'rxjs';
import { isPresent } from '../utils';
import { ScrollAxis, ScrollDirection } from './drag-scroll-settings';
import { TimelineScrollService } from './timeline-scroll.service';
import { getViewportBoundaries, scrollElement } from './utils';
import * as i0 from "@angular/core";
import * as i1 from "./timeline-scroll.service";
/**
* @hidden
*/
export class TimelineScrollableDirective {
timelineScrollableContainer;
scrollService;
zone;
scrollSettings;
subscriptions = new Subscription();
verticalScrollInterval;
horizontalScrollInterval;
constructor(timelineScrollableContainer, scrollService, zone) {
this.timelineScrollableContainer = timelineScrollableContainer;
this.scrollService = scrollService;
this.zone = zone;
this.subscriptions.add(this.scrollService.horizontalScroll
.subscribe(this.scrollHorizontallyTo.bind(this)));
this.subscriptions.add(this.scrollService.verticalScroll
.subscribe(this.scrollVerticallyTo.bind(this)));
this.subscriptions.add(this.scrollService.scrollCancel
.subscribe(this.cancelScroll.bind(this)));
}
ngOnDestroy() {
this.subscriptions.unsubscribe();
}
scrollHorizontallyTo(left) {
this.zone.runOutsideAngular(() => {
const container = this.timelineScrollableContainer.nativeElement;
const visibleBoundaries = getViewportBoundaries(container);
if (left < visibleBoundaries.left + this.scrollSettings.threshold) {
this.horizontalScrollInterval = setInterval(() => scrollElement(container, this.scrollSettings.step, ScrollDirection.Backwards, ScrollAxis.Horizontal), this.scrollSettings.interval);
}
else if (left > visibleBoundaries.right - this.scrollSettings.threshold) {
this.horizontalScrollInterval = setInterval(() => scrollElement(container, this.scrollSettings.step, ScrollDirection.Forward, ScrollAxis.Horizontal), this.scrollSettings.interval);
}
});
}
scrollVerticallyTo(top) {
this.zone.runOutsideAngular(() => {
const container = this.timelineScrollableContainer.nativeElement;
const visibleBoundaries = getViewportBoundaries(container);
if (top < visibleBoundaries.top + this.scrollSettings.threshold) {
this.verticalScrollInterval = setInterval(() => scrollElement(container, this.scrollSettings.step, ScrollDirection.Backwards, ScrollAxis.Vertical), this.scrollSettings.interval);
}
else if (top > visibleBoundaries.bottom - this.scrollSettings.threshold) {
this.verticalScrollInterval = setInterval(() => scrollElement(container, this.scrollSettings.step, ScrollDirection.Forward, ScrollAxis.Vertical), this.scrollSettings.interval);
}
});
}
cancelScroll() {
if (isPresent(this.verticalScrollInterval)) {
clearInterval(this.verticalScrollInterval);
this.verticalScrollInterval = null;
}
if (isPresent(this.horizontalScrollInterval)) {
clearInterval(this.horizontalScrollInterval);
this.horizontalScrollInterval = null;
}
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TimelineScrollableDirective, deps: [{ token: i0.ElementRef }, { token: i1.TimelineScrollService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: TimelineScrollableDirective, isStandalone: true, selector: "[kendoGanttTimelineScrollable]", inputs: { scrollSettings: "scrollSettings" }, ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TimelineScrollableDirective, decorators: [{
type: Directive,
args: [{
selector: '[kendoGanttTimelineScrollable]',
standalone: true
}]
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.TimelineScrollService }, { type: i0.NgZone }], propDecorators: { scrollSettings: [{
type: Input
}] } });