import { Main } from './main';

export class Calibration {
	private _Main: Main;

	observer: IntersectionObserver;
	visible: boolean = false;

	container: HTMLDivElement = document.querySelector('.ntsh-calibration');
	image: HTMLImageElement = this.container.querySelector('img');

	constructor(Main: Main) {
		this._Main = Main;

		this.registerListeners();

		this.startClock();
	}

	private startClock() {
		setInterval(() => {
			if (this.visible && this.image)
				this.image.src = `/calibrationImage?t=${Date.now()}`;
		}, 1000);
	}

	private registerListeners() {
		this.observer = new IntersectionObserver((entries) => {
			entries.forEach((entry) => {
				if (entry.isIntersecting) {
					this.visible = true;
					console.log('Calibration visible');
				} else {
					this.visible = false;
					console.log('Calibration not visible');
				}
			});
		});
		this.observer.observe(this.container);
	}
}