Lots of changes

-   ✅ Feedback van dataSensor array
-   ✅ dataSliders min/max and unit
-   ✅ Camera before Unity
-   ✅ Restart knop buiten service mode
-   ✅ Operator phonenumber button
-   ✅ Gracefull shutdown
-   ✅ Out of service control

frontend/views/dashboard/ts/menuBar.ts

@@ -1,4 +1,4 @@
-import { MorphComponent, MorphFeature } from 'morphux';
+import { ce, MorphComponent, MorphFeature } from 'morphux';
 import { Main } from './main';
 import { ComponentMenuBar } from 'morphux/dist/Components/MenuBar/Component.MenuBar';
 
@@ -9,11 +9,17 @@ export class MenuBar {
 
 	menubar: ComponentMenuBar;
 
+	supportNumber: string;
+
 	constructor(main: Main) {
 		this._Main = main;
 
 		this.build();
 
+		this._Main.socket.on('supportNumber', (number: string) => {
+			this.supportNumber = number;
+		});
+
 		setTimeout(() => {
 			if (localStorage?.getItem('serviceMode') === 'true')
 				this.toggleServiceMode(true, true);
@@ -22,10 +28,47 @@ export class MenuBar {
 
 	build() {
 		this.menubar = new ComponentMenuBar({
+			mobile: {
+				left: [
+					{
+						type: 'icon',
+						text: 'Restart',
+						materialIcon: 'restart_alt',
+						uniqueIdentifier: 'restart_installation',
+
+						click: async () => {
+							const mobileMenu: HTMLDivElement =
+								document.querySelector('.mux_mobilemenu');
+							mobileMenu?.click();
+
+							this.restartInstallation();
+						},
+					},
+				],
+				right: [
+					{
+						type: 'icon',
+						text: 'Support',
+						materialIcon: 'call_quality',
+						uniqueIdentifier: 'call_support',
+						click: () => this.showSupport(),
+					},
+				],
+			},
 			left: [
 				{
-					type: 'image',
-					url: '/img/morphix_logo_white.png',
+					type: 'normal',
+					text: 'Restart',
+					materialIcon: 'restart_alt',
+					uniqueIdentifier: 'restart_installation',
+
+					click: async () => {
+						const mobileMenu: HTMLDivElement =
+							document.querySelector('.mux_mobilemenu');
+						mobileMenu?.click();
+
+						this.restartInstallation();
+					},
 				},
 				{
 					type: 'normal',
@@ -65,7 +108,16 @@ export class MenuBar {
 
 			right: [
 				{
-					type: 'normal',
+					type: 'icon',
+					text: 'Support',
+					materialIcon: 'call_quality',
+					uniqueIdentifier: 'call_support',
+					click: () => this.showSupport(),
+				},
+				{
+					type: document.body.classList.contains('ntsh_service')
+						? 'normal'
+						: 'icon',
 					text: document.body.classList.contains('ntsh_service')
 						? 'Exit Service'
 						: 'Service Mode',
@@ -90,6 +142,51 @@ export class MenuBar {
 		this.container.appendChild(this.menubar.container);
 	}
 
+	async showSupport() {
+		const dialog = new MorphComponent.Dialog({
+			title: 'Contact Support',
+			width: 'medium',
+			height: 'auto',
+			okButtonVisible: false,
+			cancelButtonVisible: false,
+		});
+
+		this.supportNumber.slice();
+		const callAnchor = ce(
+			'a',
+			'ntsh_callanchor',
+			{ href: `tel:${this.supportNumber}` },
+			`+${this.supportNumber}`
+		);
+		dialog.content.appendChild(callAnchor);
+
+		setTimeout(() => callAnchor.click(), 100);
+	}
+
+	async restartInstallation() {
+		const confirmed = await MorphFeature.Confirm({
+			title: 'Restart Installation',
+			message: 'Are you sure you want to restart the installation?',
+		});
+		if (!confirmed) return;
+
+		MorphFeature.Loader({
+			active: true,
+			message: 'Restarting installation...',
+		});
+		this._Main.socket.emit(
+			'restartInstallation',
+			(response: { succeed: boolean; message?: string }) => {
+				MorphFeature.Loader({ active: false });
+				if (!response.succeed)
+					return MorphFeature.Alert({
+						title: 'Error',
+						message: response.message,
+					});
+			}
+		);
+	}
+
 	async toggleServiceMode(
 		mode?: boolean,
 		skipPin?: boolean