24 lines
858 B
TypeScript
24 lines
858 B
TypeScript
|
|
export class ScrollManager {
|
||
|
|
private scrollableContent!: HTMLElement;
|
||
|
|
private timeAxisContent!: HTMLElement;
|
||
|
|
private calendarHeader!: HTMLElement;
|
||
|
|
|
||
|
|
init(container: HTMLElement): void {
|
||
|
|
this.scrollableContent = container.querySelector('swp-scrollable-content')!;
|
||
|
|
this.timeAxisContent = container.querySelector('swp-time-axis-content')!;
|
||
|
|
this.calendarHeader = container.querySelector('swp-calendar-header')!;
|
||
|
|
|
||
|
|
this.scrollableContent.addEventListener('scroll', () => this.onScroll());
|
||
|
|
}
|
||
|
|
|
||
|
|
private onScroll(): void {
|
||
|
|
const { scrollTop, scrollLeft } = this.scrollableContent;
|
||
|
|
|
||
|
|
// Synkroniser time-axis vertikalt
|
||
|
|
this.timeAxisContent.style.transform = `translateY(-${scrollTop}px)`;
|
||
|
|
|
||
|
|
// Synkroniser header horisontalt
|
||
|
|
this.calendarHeader.style.transform = `translateX(-${scrollLeft}px)`;
|
||
|
|
}
|
||
|
|
}
|