From 5d54f0891c2aae5237ef6e1c49b29a744d5c9e8e Mon Sep 17 00:00:00 2001
From: wertiop <wertiop121@gmail.com>
Date: Thu, 25 Jul 2024 19:26:39 +0100
Subject: [PATCH] fixup! feat: add horizontal FOV converter

---
 layout/pages/settings/video.xml    | 15 +++++++++++----
 scripts/pages/settings/fov.js      | 21 ++++++++++++---------
 scripts/pages/settings/settings.js | 17 +++++++++--------
 3 files changed, 32 insertions(+), 21 deletions(-)

diff --git a/layout/pages/settings/video.xml b/layout/pages/settings/video.xml
index d3e90247..8567cc2f 100644
--- a/layout/pages/settings/video.xml
+++ b/layout/pages/settings/video.xml
@@ -33,12 +33,19 @@
 					<Label class="settings-group__title" text="#Settings_Video" />
 				</Panel>
 
-				<Panel class="settings-group__combo" onload="Fov.loadSettings()">
-					<SettingsSlider id="FOV" text="#Settings_Video_FOV" min="50" max="130" convar="fov_desired" hasdocspage="false" onvaluechanged="Fov.updateFOV()" />
+				<SettingsSlider id="FOV" text="#Settings_Video_FOV" min="50" max="130" convar="fov_desired" hasdocspage="false" onvaluechanged="Fov.updateFOV()" />
 
-					<Panel class="settings-enum__values pr-2 pl-4 mb-1">
+				<Panel class="settings-group__combo" onload="Fov.loadSettings()" infotitle="#Settings_Video_Horizontal_FOV" infomessage="#Settings_Video_Horizontal_FOV_Info">
+					<Panel class="settings-enum">
 						<Label text="#Settings_Video_Horizontal_FOV" class="settings-enum__title" />
-						<TextEntry id="FOV_Horizontal" class="textentry settings-slider__textentry HasInput ml-4" multiline="false" textmode="numeric" oninputsubmit="Fov.updateHorizontalFov()" />
+						<Panel class="settings-enum__values">
+							<TextEntry id="FOV_Horizontal" class="textentry settings-slider__textentry HasInput ml-4" multiline="false" textmode="numeric" oninputsubmit="Fov.updateHorizontalFov()" />
+							<DropDown id="FOV_Horizontal_AspectRatioEnum" class="dropdown ml-4" menuclass="dropdown-menu" onuserinputsubmit="Fov.updateFOV()">
+								<Label text="#Settings_Video_AspectRatio_Normal" value="0" id="aspectratio0" />
+								<Label text="#Settings_Video_AspectRatio_16x9" value="1" id="aspectratio1" />
+								<Label text="#Settings_Video_AspectRatio_16x10" value="2" id="aspectratio2" />
+							</DropDown>
+						</Panel>
 					</Panel>
 				</Panel>
 
diff --git a/scripts/pages/settings/fov.js b/scripts/pages/settings/fov.js
index e3153c38..dc50c32a 100644
--- a/scripts/pages/settings/fov.js
+++ b/scripts/pages/settings/fov.js
@@ -3,23 +3,26 @@ class Fov {
 		/** @type {SettingsSlider} @static */
 		fov: $('#FOV'),
 		/** @type {TextEntry} @static */
-		horizontalFov: $('#FOV_Horizontal')
+		horizontalFov: $('#FOV_Horizontal'),
+		aspectRatio: $('#FOV_Horizontal_AspectRatioEnum')
 	};
 
 	static loadSettings() {
+		this.panels.aspectRatio.SetSelected('aspectratio1');
 		this.updateFOV();
 	}
 
 	static aspectRatio() {
-		// find the display panel
-		// there doesn't seem to be an api for this yet
-		let panel = this.panels.fov;
-		let parent = panel;
-		while ((parent = panel.GetParent())) {
-			panel = parent;
+		const id = this.panels.aspectRatio.GetSelected().id;
+		switch(id) {
+			case 'aspectratio0':
+				return 4/3;
+			case 'aspectratio1':
+				return 16/9;
+			case 'aspectratio2':
+				return 16/10;
 		}
-
-		return panel.actuallayoutwidth / panel.actuallayoutheight;
+		return Number.NaN;
 	}
 
 	static fovToHorizontal(fov) {
diff --git a/scripts/pages/settings/settings.js b/scripts/pages/settings/settings.js
index 4f3ed864..07a5235a 100644
--- a/scripts/pages/settings/settings.js
+++ b/scripts/pages/settings/settings.js
@@ -244,9 +244,7 @@ class MainMenuSettings {
 
 	static initPanelsRecursive(panel) {
 		// Initialise info panel event handlers
-		if (this.isSettingsPanel(panel) || this.isSpeedometerPanel(panel)) {
-			this.setPanelInfoEvents(panel);
-		}
+		this.setPanelInfoEvents(panel);
 
 		// Initialise all the settings using persistent storage
 		// Only Enum and EnumDropDown are currently supported, others can be added when/if needed
@@ -312,13 +310,20 @@ class MainMenuSettings {
 
 	static setPanelInfoEvents(panel) {
 		const message = panel.GetAttributeString('infomessage', '');
+		const title = panel.GetAttributeString('infotitle', '');
+
+		// Don't set events if there's no info to show
+		if(!this.isSettingsPanel(panel) && message === '' && title === '' && !panel.convar && !panel.bind) return;
+
 		// Default to true if not set
 		const hasDocs = !(panel.GetAttributeString('hasdocspage', '') === 'false');
+
+
 		panel.SetPanelEvent('onmouseover', () => {
 			// Set onmouseover events for all settings panels
 			this.showInfo(
 				// If a panel has a specific title use that, if not use the panel's name. Child ID names vary between panel types, blame Valve
-				panel.GetAttributeString('infotitle', '') ||
+				title ||
 					panel.FindChildTraverse('Title')?.text ||
 					panel.FindChildTraverse('title')?.text,
 				message,
@@ -438,8 +443,4 @@ class MainMenuSettings {
 			'ConVarColorDisplay'
 		].includes(panel.paneltype);
 	}
-
-	static isSpeedometerPanel(panel) {
-		return ['SpeedometersContainer', 'RangeColorProfilesContainer'].includes(panel.id);
-	}
 }