import { NgxMoveableComponent } from "ngx-moveable";
import { NgxInfiniteViewerComponent } from "ngx-infinite-viewer";
import { ViewChild, Component, AfterViewInit } from "@angular/core";

@Component({ selector: "ngx-app", templateUrl: "./App.component.html" })
export default class NgxAppComponent implements AfterViewInit {
    @ViewChild("viewerRef")
    viewerRef!: NgxInfiniteViewerComponent;
    scrollOptions: any = {
        container: () => this.viewerRef!.getContainer(),
        threshold: 20,
        getScrollPosition: () => {
            return [
                this.viewerRef!.getScrollLeft({ absolute: true }),
                this.viewerRef!.getScrollTop({ absolute: true }),
            ];
        }
    };
    ngAfterViewInit() {
        setTimeout(() => {
            this.viewerRef!.scrollCenter();
        }, 100);
    }
    onClick() {
        this.viewerRef!.scrollCenter();
    }
    onRender(e) {
        e.target.style.cssText += e.cssText;
    }
    onScroll({ direction }) {
        this.viewerRef!.scrollBy(direction[0] * 10, direction[1] * 10);
    }
}