Fix web UI setting bug for square resolution

For devices with square resolutions, the settings web UI page did not handle settings in the lower part of the image correctly. This was part due to HTML/Javascript and part parameter boundaries. With this patch that has been mitigated. Change-Id: Id4e2db3382b7bf62717d19676e817cde3128a334 Signed-off-by: Joakim Roubert <[email protected]>
AxisCommunications · Jun 24, 2024 · 2b69b79 · 2b69b79
1 parent f91a5ce
commit 2b69b79
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 10 deletions.
diff --git a/html/js/opcuacolorchecker.js b/html/js/opcuacolorchecker.js
@@ -152,9 +152,21 @@ function updateHeight(newvalue) {
 }
 
 function updateAspect(checked) {
+	const preview = document.getElementById('preview');
+	const width = preview.width;
+	const height = preview.height;
+
+	const mwmax = checked ? Math.min(width, height) : width;
+	const mhmax = checked ? mwmax : height;
+
+	document.getElementById('markerwidthnumbox').max = mwmax;
+	document.getElementById('markerwidthslider').max = mwmax;
+	document.getElementById('markerheightslider').max = mhmax;
+	document.getElementById('markerheightslider').max = mhmax;
+
 	if (checked) {
-		var height = document.getElementById('markerheightnumbox').value;
-		updateWH('MarkerWidth', height);
+		var hval = document.getElementById('markerheightnumbox').value;
+		updateWH('MarkerWidth', hval);
 	}
 }
 
@@ -272,9 +284,11 @@ async function initWithCurrentValues() {
 	document.getElementById('markerwidthslider').value = markerwidth;
 	document.getElementById('markerheightnumbox').value = markerheight;
 	document.getElementById('markerheightslider').value = markerheight;
-	document.getElementById('markerlockaspect').checked = (markerwidth == markerheight);
 	document.getElementById('markershape').value = markershape;
 
+	const markerlockaspect = (markerwidth == markerheight);
+	document.getElementById('markerlockaspect').checked = markerlockaspect;
+	updateAspect(markerlockaspect);
 	handleCoord(center.X, center.Y, false);
 	updateTolerance(tolerance, false);
 }

diff --git a/manifest.json b/manifest.json
@@ -12,7 +12,7 @@
             },
             "vendorUrl": "https://www.axis.com/",
             "runMode": "respawn",
-            "version": "1.0.3"
+            "version": "1.0.4"
         },
         "configuration": {
             "settingPage": "settings.html",
@@ -21,18 +21,18 @@
                 {"type": "transferCgi", "name": "pickcurrent.cgi", "access": "admin"}
             ],
             "paramConfig": [
-                {"name": "CenterX", "type": "int:min=0,max=639", "default": "100"},
-                {"name": "CenterY", "type": "int:min=0,max=359", "default": "170"},
+                {"name": "CenterX", "type": "int:min=0,max=959", "default": "100"},
+                {"name": "CenterY", "type": "int:min=0,max=539", "default": "170"},
                 {"name": "ColorB", "type": "double:min=0,max=255", "default": "50"},
                 {"name": "ColorG", "type": "double:min=0,max=255", "default": "50"},
                 {"name": "ColorR", "type": "double:min=0,max=255", "default": "50"},
-                {"name": "Height", "type": "int:min=0,max=1080", "default": "360"},
-                {"name": "MarkerHeight", "type": "int:min=1,max=360", "default": "25"},
+                {"name": "Height", "type": "int:min=1,max=1080", "default": "360"},
+                {"name": "MarkerHeight", "type": "int:min=1", "default": "25"},
                 {"name": "MarkerShape", "type": "enum:0|Ellipse, 1|Rectangle", "default": "0"},
-                {"name": "MarkerWidth", "type": "int:min=1,max=640", "default": "25"},
+                {"name": "MarkerWidth", "type": "int:min=1", "default": "25"},
                 {"name": "Port", "type": "int:min=1024,max=65535", "default": "4840"},
                 {"name": "Tolerance", "type": "int:min=0,max=255", "default": "35"},
-                {"name": "Width", "type": "int:min=0,max=1920", "default": "640"}
+                {"name": "Width", "type": "int:min=1,max=1920", "default": "640"}
             ]
         }
     }