Implmeented some stuiff

frontend/views/dashboard/ts/dashboard.unity.ts

@@ -75,6 +75,9 @@ export class DashboardUnity {
 	parametersTable: HTMLTableElement = document.querySelector(
 		'.ntsh_dashboard-unity-parameters'
 	);
+	advancedParametersTable: HTMLTableElement = document.querySelector(
+		'.ntsh_dashboard-unity-advancedparameters'
+	);
 
 	sensorsTable: HTMLTableElement = document.querySelector(
 		'.ntsh_dashboard-unity-sensors'
@@ -200,6 +203,9 @@ export class DashboardUnity {
 		this.renderParameterSliders(
 			state.state == 'CONNECTED' ? state.parameters.sliders : []
 		);
+		this.renderAdvancedParameterSliders(
+			state.state == 'CONNECTED' ? state.parameters.advancedSliders : []
+		);
 		this.renderParameterSensors(
 			state.state == 'CONNECTED' ? state.parameters.sensors : []
 		);
@@ -358,6 +364,155 @@ export class DashboardUnity {
 		}
 	}
 
+	private renderAdvancedParameterSliders(
+		sliders: UnityParameters['sliders']
+	) {
+		const existingSliders = this.advancedParametersTable.querySelectorAll(
+			'.ntsh_dashboard-unity-parameter-row'
+		);
+
+		if (existingSliders.length !== sliders.length) {
+			this.advancedParametersTable.innerHTML = '';
+
+			if (sliders.length === 0) {
+				const row = ce('tr');
+				const cell = ce('td');
+				cell.appendChild(
+					ce(
+						'div',
+						['mux_text', 'ntsh_dashboard-unity-parameters-loading'],
+						null,
+						'Waiting for Unity...'
+					)
+				);
+				row.appendChild(cell);
+				this.advancedParametersTable.appendChild(row);
+			} else
+				sliders.forEach((slider) => {
+					const multiplierFactor = slider.visualMultiplier ?? 1;
+					const decimalPlacesFactor =
+						10 ** (slider.decimalPlaces ?? 0);
+
+					const value =
+						Math.round(
+							slider.outputValue *
+								multiplierFactor *
+								decimalPlacesFactor
+						) / decimalPlacesFactor;
+
+					const row = ce('tr', 'ntsh_dashboard-unity-parameter-row');
+
+					const nameCell = ce('td');
+					nameCell.appendChild(
+						ce('div', 'mux_text', null, slider.sliderName)
+					);
+					row.appendChild(nameCell);
+
+					const progressCell = ce('td', 'no-service');
+					progressCell.appendChild(
+						createProgress(
+							value,
+							slider.min * multiplierFactor,
+							slider.max * multiplierFactor,
+							slider.unit
+						)
+					);
+					row.appendChild(progressCell);
+
+					const sliderCell = ce('td', 'only-service');
+					const sliderProgress = createProgress(
+						value,
+						slider.min * multiplierFactor,
+						slider.max * multiplierFactor,
+						slider.unit
+					);
+					const sliderValue: HTMLDivElement =
+						sliderProgress.querySelector('.ntsh_progress-value');
+					sliderValue.classList.add('mux_resizer');
+					sliderCell.appendChild(sliderProgress);
+
+					const resizer = new MorphComponent.Resizer({
+						existingContainer: sliderValue,
+						direction: 'right',
+						relative: true,
+						min: 0,
+						max: () => sliderProgress.clientWidth,
+					});
+					let lastValue: number = -1;
+					resizer.on('resized', (size) => {
+						const percentage =
+							Math.round(
+								(size / sliderProgress.clientWidth) * 100
+							) / 100;
+
+						var actualValue =
+							slider.min + percentage * (slider.max - slider.min);
+
+						if (actualValue === lastValue) return;
+						lastValue = actualValue;
+
+						this._Main.socket.emit(
+							'unityWebSocket',
+							'advancedParameterValue',
+							slider.sliderIndex,
+							actualValue
+						);
+						setProgressState(
+							sliderProgress,
+							Math.round(
+								actualValue *
+									multiplierFactor *
+									decimalPlacesFactor
+							) / decimalPlacesFactor,
+							slider.min * multiplierFactor,
+							slider.max * multiplierFactor,
+							slider.unit
+						);
+					});
+
+					row.appendChild(sliderCell);
+
+					this.advancedParametersTable.appendChild(row);
+				});
+		} else {
+			existingSliders.forEach((row, index) => {
+				const slider = sliders[index];
+				const multiplierFactor = slider.visualMultiplier ?? 1;
+				const decimalPlacesFactor = 10 ** (slider.decimalPlaces ?? 0);
+
+				const value =
+					Math.round(
+						slider.outputValue *
+							multiplierFactor *
+							decimalPlacesFactor
+					) / decimalPlacesFactor;
+
+				const progressElement: HTMLDivElement = row.querySelector(
+					'.no-service .ntsh_progress'
+				);
+				setProgressState(
+					progressElement,
+					value,
+					slider.min * multiplierFactor,
+					slider.max * multiplierFactor,
+					slider.unit
+				);
+
+				const sliderElement: HTMLDivElement = row.querySelector(
+					'.only-service .ntsh_progress'
+				);
+				if (sliderElement.querySelector('.mux_resizer-moving') == null)
+					setProgressState(
+						sliderElement,
+						value,
+						slider.min * multiplierFactor,
+						slider.max * multiplierFactor,
+						slider.unit
+					);
+			});
+		}
+	}
+
 	private renderParameterSensors(sensors: UnityParameters['sensors']) {
 		const existingSensors = this.sensorsTable.querySelectorAll(
 			'.ntsh_dashboard-unity-sensor-row'
@@ -528,6 +683,7 @@ interface UnityParameters {
 	zedFPS: string;
 	outOfService: boolean;
 	sliders: UnityParameterSlider[];
+	advancedSliders: UnityParameterSlider[];
 	sensors: UnitySocketMessageHeartbeat['heartbeat']['dataSensors'];
 }