From 26db05ac54074f57a074224cc87b7f8909807dc3 Mon Sep 17 00:00:00 2001 From: gemini86 <38013323+gemini86@users.noreply.github.com> Date: Sat, 13 Dec 2025 19:01:31 -0800 Subject: [PATCH 1/2] Enable number display on UI Gauge Tank widget - removed automatic percentage calculation - added options for prefix and suffix display --- nodes/widgets/ui_gauge.html | 2 ++ package-lock.json | 24 ------------------- ui/src/widgets/ui-gauge/types/UIGaugeTank.vue | 11 +++------ 3 files changed, 5 insertions(+), 32 deletions(-) diff --git a/nodes/widgets/ui_gauge.html b/nodes/widgets/ui_gauge.html index b9080ab90..c142ba5c7 100644 --- a/nodes/widgets/ui_gauge.html +++ b/nodes/widgets/ui_gauge.html @@ -256,6 +256,8 @@ $('#node-input-container-label-extras').hide() if (type === 'gauge-tile') { $('#node-input-container-tile-options').show() + } else if (type === 'gauge-tank') { + $('#node-input-container-label-extras').show() } else { $('#node-input-container-tile-options').hide() } diff --git a/package-lock.json b/package-lock.json index 744df96e9..f8fe173a6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -236,7 +236,6 @@ "integrity": "sha512-/IYpF10BpthGZEJQZMhMqV4AqWr5avcWfZm/SIKK1RvUDmzGqLoW/+xeJVX9C8ZnNkIC8hivbIQFaNaRw0BFZQ==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@algolia/client-common": "5.39.0", "@algolia/requester-browser-xhr": "5.39.0", @@ -403,7 +402,6 @@ "integrity": "sha512-vMqyb7XCDMPvJFFOaT9kxtiRh42GwlZEg1/uIgtZshS5a/8OaduUfCi7kynKgc3Tw/6Uo2D+db9qBttghhmxwQ==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@ampproject/remapping": "^2.2.0", "@babel/code-frame": "^7.26.2", @@ -6235,7 +6233,6 @@ "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz", "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==", "license": "MIT", - "peer": true, "bin": { "acorn": "bin/acorn" }, @@ -6313,7 +6310,6 @@ "integrity": "sha512-DzTfhUxzg9QBNGzU/0kZkxEV72TeA4MmPJ7RVfLnQwHNhhliPo7ynglEWJS791rNlLFoTyrKvkapwr/P3EXV9A==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@algolia/abtesting": "1.5.0", "@algolia/client-abtesting": "5.39.0", @@ -6996,7 +6992,6 @@ } ], "license": "MIT", - "peer": true, "dependencies": { "caniuse-lite": "^1.0.30001688", "electron-to-chromium": "^1.5.73", @@ -7496,7 +7491,6 @@ "integrity": "sha512-ci2iJH6LeIkvP9eJW6gpueU8cnZhv85ELY8w8WiFtNjMHA5ad6pQLaJo9mEly/9qUyCpvqX8/POVUTf18/HFdw==", "dev": true, "license": "Apache-2.0", - "peer": true, "dependencies": { "@chevrotain/cst-dts-gen": "11.0.3", "@chevrotain/gast": "11.0.3", @@ -8258,7 +8252,6 @@ "resolved": "https://registry.npmjs.org/cytoscape/-/cytoscape-3.30.2.tgz", "integrity": "sha512-oICxQsjW8uSaRmn4UK/jkczKOqTrVqt5/1WL0POiJUT2EKNc9STM4hYFHv917yu55aTBMFNRzymlJhVAiWPCxw==", "dev": true, - "peer": true, "engines": { "node": ">=0.10" } @@ -8645,7 +8638,6 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-3.0.0.tgz", "integrity": "sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==", - "peer": true, "engines": { "node": ">=12" } @@ -9377,7 +9369,6 @@ "resolved": "https://registry.npmjs.org/enquirer/-/enquirer-2.4.1.tgz", "integrity": "sha512-rRqJg/6gd538VHvR3PSrdRBb/1Vy2YfzHqzvbhGIQpDRKIa4FgV/54b5Q1xYSxOOwKvjXweS26E0Q+nAMwp2pQ==", "dev": true, - "peer": true, "dependencies": { "ansi-colors": "^4.1.1", "strip-ansi": "^6.0.1" @@ -9639,7 +9630,6 @@ "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@eslint-community/eslint-utils": "^4.2.0", "@eslint-community/regexpp": "^4.6.1", @@ -9831,7 +9821,6 @@ "integrity": "sha512-ixmkI62Rbc2/w8Vfxyh1jQRTdRTF52VxwRVHl/ykPAmqG+Nb7/kNn+byLP0LxPgI7zWA16Jt82SybJInmMia3A==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@rtsao/scc": "^1.1.0", "array-includes": "^3.1.8", @@ -9896,7 +9885,6 @@ "integrity": "sha512-6TyDmZ1HXoFQXnhCTUjVFULReoBPOAjpuiKELMkeP40yffI/1ZRO+d9ug/VC6fqISo2WkuIBk3cvuRPALaWlOQ==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@eslint-community/eslint-utils": "^4.4.0", "builtins": "^5.0.1", @@ -9935,7 +9923,6 @@ "integrity": "sha512-57Zzfw8G6+Gq7axm2Pdo3gW/Rx3h9Yywgn61uE/3elTCOePEHVrn2i5CdfBwA1BLK0Q0WqctICIUSqXZW/VprQ==", "dev": true, "license": "ISC", - "peer": true, "engines": { "node": "^12.22.0 || ^14.17.0 || >=16.0.0" }, @@ -10575,7 +10562,6 @@ "integrity": "sha512-7Ke1jyybbbPZyZXFxEftUtxFGLMpE2n6A+z//m4CRDlj0hW+o3iYSmh8nFlYMurOiJVDmJRilUQtJr08KfIxlg==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "tabbable": "^6.2.0" } @@ -12729,7 +12715,6 @@ "resolved": "https://registry.npmjs.org/marked/-/marked-4.3.0.tgz", "integrity": "sha512-PRsaiG84bK+AMvxziE/lCFss8juXjNaWzVbN5tXAm4XjeaS9NAHhop+PjQxz2A9h8Q4M/xGmzP8vqNwy6JeK0A==", "dev": true, - "peer": true, "bin": { "marked": "bin/marked.js" }, @@ -15202,7 +15187,6 @@ "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.23.0.tgz", "integrity": "sha512-vXB4IT9/KLDrS2WRXmY22sVB2wTsTwkpxjB8Q3mnakTENcYw3FRmfdYDy/acNmls+lHmDazgrRjK/yQ6hQAtwA==", "dev": true, - "peer": true, "dependencies": { "@types/estree": "1.0.6" }, @@ -15583,7 +15567,6 @@ "dev": true, "hasInstallScript": true, "license": "Apache-2.0", - "peer": true, "dependencies": { "color": "^4.2.3", "detect-libc": "^2.0.4", @@ -15696,7 +15679,6 @@ "resolved": "https://registry.npmjs.org/should/-/should-13.2.3.tgz", "integrity": "sha512-ggLesLtu2xp+ZxI+ysJTmNjh2U0TsC+rQ/pfED9bUZZ4DKefP27D+7YJVVTvKsmjLpIi9jAa7itwDGkDDmt1GQ==", "dev": true, - "peer": true, "dependencies": { "should-equal": "^2.0.0", "should-format": "^3.0.3", @@ -16785,7 +16767,6 @@ "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==", "dev": true, "license": "MIT", - "peer": true, "engines": { "node": ">=12" }, @@ -17463,7 +17444,6 @@ "integrity": "sha512-o5a9xKjbtuhY6Bi5S3+HvbRERmouabWbyUcpXXUA1u+GNUKoROi9byOJ8M0nHbHYHkYICiMlqxkg1KkYmm25Sw==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "esbuild": "^0.21.3", "postcss": "^8.4.43", @@ -17690,7 +17670,6 @@ "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.13.tgz", "integrity": "sha512-wmeiSMxkZCSc+PM2w2VRsOYAZC8GdipNFRTsLSfodVqI9mbejKeXEGr8SckuLnrQPGe3oJN5c3K0vpoU9q/wCQ==", "license": "MIT", - "peer": true, "dependencies": { "@vue/compiler-dom": "3.5.13", "@vue/compiler-sfc": "3.5.13", @@ -17759,7 +17738,6 @@ "resolved": "https://registry.npmjs.org/vuetify/-/vuetify-3.9.2.tgz", "integrity": "sha512-Pax7YCgbE5SArY8CDM0A9dTVHnG1oU79eIBA+FEEg3dDFV7bc+0AppJJLfG2+aoaBlJf2UH7tOCflJ/U23YU1Q==", "dev": true, - "peer": true, "engines": { "node": "^12.20 || >=14.13" }, @@ -18073,7 +18051,6 @@ "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "fast-deep-equal": "^3.1.3", "fast-uri": "^3.0.1", @@ -18147,7 +18124,6 @@ "integrity": "sha512-fS6iqSPZDs3dr/y7Od6y5nha8dW1YnbgtsyotCVvoFGKbERG++CVRFv1meyGDE1SNItQA8BrnCw7ScdAhRJ3XQ==", "dev": true, "license": "MIT", - "peer": true, "bin": { "rollup": "dist/bin/rollup" }, diff --git a/ui/src/widgets/ui-gauge/types/UIGaugeTank.vue b/ui/src/widgets/ui-gauge/types/UIGaugeTank.vue index b1774df37..2c39f1437 100644 --- a/ui/src/widgets/ui-gauge/types/UIGaugeTank.vue +++ b/ui/src/widgets/ui-gauge/types/UIGaugeTank.vue @@ -28,7 +28,9 @@
- +
@@ -59,13 +61,6 @@ export default { color: function () { return UIGaugeMethods.valueToColor(this.props.segments, this.value) }, - pc: function () { - if (typeof this.value !== 'undefined') { - return Math.max(0, Math.min(Math.round((this.value - this.props.min) / (this.props.max - this.props.min) * 100), 100)) - } else { - return 0 - } - }, clipId: function () { return `clip-${this.id}` }, From 7f9ce8a097bd7156528595dc3db0a98850198c3d Mon Sep 17 00:00:00 2001 From: gemini86 <38013323+gemini86@users.noreply.github.com> Date: Sun, 14 Dec 2025 08:50:14 -0800 Subject: [PATCH 2/2] UIGaugeTank- enable percent display option - enabled by default when gauge type is 'gauge-tank' to mimic original behavior - option is available for all gauge types, but not the default for others --- nodes/widgets/locales/en-US/ui_gauge.json | 3 ++- nodes/widgets/ui_gauge.html | 12 ++++++++++++ ui/src/widgets/ui-gauge/types/UIGaugeTank.vue | 16 +++++++++++++++- 3 files changed, 29 insertions(+), 2 deletions(-) diff --git a/nodes/widgets/locales/en-US/ui_gauge.json b/nodes/widgets/locales/en-US/ui_gauge.json index 1039125af..c63ee7373 100644 --- a/nodes/widgets/locales/en-US/ui_gauge.json +++ b/nodes/widgets/locales/en-US/ui_gauge.json @@ -30,7 +30,8 @@ "units": "Units", "icon": "Icon", "defaults": "Defaults", - "value": "Value" + "value": "Value", + "valueAsPercent": "Display Value as Percent" }, "errors": { "unique": "All 'from' values must be unique." diff --git a/nodes/widgets/ui_gauge.html b/nodes/widgets/ui_gauge.html index c142ba5c7..b0fff030c 100644 --- a/nodes/widgets/ui_gauge.html +++ b/nodes/widgets/ui_gauge.html @@ -142,6 +142,7 @@ order: { value: 0 }, value: { value: 'payload', required: false }, valueType: { value: 'msg' }, + valueAsPercent: { value: Boolean(this.gtype === 'gauge-tank') }, // default to true for tank gauges width: { value: 3, validate: function (v) { @@ -256,12 +257,16 @@ $('#node-input-container-label-extras').hide() if (type === 'gauge-tile') { $('#node-input-container-tile-options').show() + $('#node-input-valueAsPercent').prop('checked', false) } else if (type === 'gauge-tank') { $('#node-input-container-label-extras').show() + $('#node-input-valueAsPercent').prop('checked', true) } else { + $('#node-input-valueAsPercent').prop('checked', false) $('#node-input-container-tile-options').hide() } } else { + $('#node-input-valueAsPercent').prop('checked', false) $('#node-input-container-sizes').show() $('#node-input-container-gstyle').show() $('#node-input-container-label-extras').show() @@ -418,6 +423,13 @@

+
+ +

diff --git a/ui/src/widgets/ui-gauge/types/UIGaugeTank.vue b/ui/src/widgets/ui-gauge/types/UIGaugeTank.vue index 2c39f1437..45b438bdf 100644 --- a/ui/src/widgets/ui-gauge/types/UIGaugeTank.vue +++ b/ui/src/widgets/ui-gauge/types/UIGaugeTank.vue @@ -29,7 +29,7 @@
@@ -61,6 +61,20 @@ export default { color: function () { return UIGaugeMethods.valueToColor(this.props.segments, this.value) }, + pc: function () { + if (typeof this.value !== 'undefined') { + return Math.max(0, Math.min(Math.round((this.value - this.props.min) / (this.props.max - this.props.min) * 100), 100)) + } else { + return 0 + } + }, + displayValue: function () { + if (this.props.valueAsPercent) { + return `${this.pc}%` + } else { + return `${this.props.prefix}${this.value ?? this.props.min}${this.props.suffix}` + } + }, clipId: function () { return `clip-${this.id}` },