Added basic control panel

frontend/views/control/ts/calibration.ts

@@ -0,0 +1,41 @@
+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);
+	}
+}