From 900d23733d71c4b33ae63f61956f768fb5031f11 Mon Sep 17 00:00:00 2001
From: Dan <39170265+chillenberger@users.noreply.github.com>
Date: Thu, 3 Oct 2024 15:55:51 -0600
Subject: [PATCH 1/3] add compact number utility and use it
---
.../range_group_pricing_calc_controller.js | 11 +++++---
.../static/js/utilities/compact_number.js | 28 +++++++++++++++++++
2 files changed, 35 insertions(+), 4 deletions(-)
create mode 100644 pgml-dashboard/static/js/utilities/compact_number.js
diff --git a/pgml-dashboard/src/components/inputs/range_group_pricing_calc/range_group_pricing_calc_controller.js b/pgml-dashboard/src/components/inputs/range_group_pricing_calc/range_group_pricing_calc_controller.js
index ee212dedb..19772d3d8 100644
--- a/pgml-dashboard/src/components/inputs/range_group_pricing_calc/range_group_pricing_calc_controller.js
+++ b/pgml-dashboard/src/components/inputs/range_group_pricing_calc/range_group_pricing_calc_controller.js
@@ -1,4 +1,5 @@
import { Controller } from "@hotwired/stimulus";
+import { numberToCompact, compactToNumber } from "../../../../static/js/utilities/compact_number";
export default class extends Controller {
static targets = ["textInput", "range"];
@@ -18,7 +19,7 @@ export default class extends Controller {
updateText(e) {
if (e.detail >= this.minValue && e.detail <= this.maxValue) {
this.removeErrorState();
- this.textInputTarget.value = e.detail;
+ this.textInputTarget.value = numberToCompact(e.detail);
this.updateDatasetValue();
this.inputUpdated();
} else {
@@ -27,20 +28,22 @@ export default class extends Controller {
}
textUpdated() {
- let value = Number(this.textInputTarget.value);
+ let value = compactToNumber(this.textInputTarget.value);
+
if (!value) {
- value = this.minValue;
- this.textInputTarget.value = value;
+ this.textInputTarget.value = numberToCompact(this.minValue);
}
if (value > this.maxValue || value < this.minValue) {
this.applyErrorState();
value = value > this.maxValue ? this.maxValue : this.minValue;
value = value < this.minValue ? this.minValue : value;
+ this.textInputTarget.value = numberToCompact(value);
this.dispatchToRange(value);
} else {
this.removeErrorState();
this.dispatchToRange(value);
+ this.textInputTarget.value = numberToCompact(value);
this.updateDatasetValue();
this.inputUpdated();
}
diff --git a/pgml-dashboard/static/js/utilities/compact_number.js b/pgml-dashboard/static/js/utilities/compact_number.js
new file mode 100644
index 000000000..f13b1cb31
--- /dev/null
+++ b/pgml-dashboard/static/js/utilities/compact_number.js
@@ -0,0 +1,28 @@
+
+export const numberToCompact = (num) => {
+ if (num >= 1e12) {
+ return (num / 1e12).toFixed(1) + 'T'; // Trillion
+ } else if (num >= 1e9) {
+ return (num / 1e9).toFixed(1) + 'B'; // Billion
+ } else if (num >= 1e6) {
+ return (num / 1e6).toFixed(1) + 'M'; // Million
+ } else if (num >= 1e3) {
+ return (num / 1e3).toFixed(1) + 'K'; // Thousand
+ } else {
+ return num.toString(); // Less than a thousand
+ }
+};
+
+export const compactToNumber = (compact) => {
+ const suffixes = { 'K': 1e3, 'M': 1e6, 'B': 1e9, 'T': 1e12 };
+ const regex = /^(\d+(\.\d+)?)([KMBT])$/;
+
+ const match = compact.match(regex);
+ if (match) {
+ const number = parseFloat(match[1]);
+ const suffix = match[3].toUpperCase();
+ return number * suffixes[suffix];
+ } else {
+ return parseFloat(compact); // For numbers without suffixes
+ }
+};
\ No newline at end of file
From 4343864f1b1b393e51a9fba7b26d08e5e14e5dc5 Mon Sep 17 00:00:00 2001
From: Dan <39170265+chillenberger@users.noreply.github.com>
Date: Thu, 3 Oct 2024 15:58:24 -0600
Subject: [PATCH 2/3] lint
---
.../range_group_pricing_calc_controller.js | 5 ++++-
1 file changed, 4 insertions(+), 1 deletion(-)
diff --git a/pgml-dashboard/src/components/inputs/range_group_pricing_calc/range_group_pricing_calc_controller.js b/pgml-dashboard/src/components/inputs/range_group_pricing_calc/range_group_pricing_calc_controller.js
index 19772d3d8..bdb7e6d2f 100644
--- a/pgml-dashboard/src/components/inputs/range_group_pricing_calc/range_group_pricing_calc_controller.js
+++ b/pgml-dashboard/src/components/inputs/range_group_pricing_calc/range_group_pricing_calc_controller.js
@@ -1,5 +1,8 @@
import { Controller } from "@hotwired/stimulus";
-import { numberToCompact, compactToNumber } from "../../../../static/js/utilities/compact_number";
+import {
+ numberToCompact,
+ compactToNumber,
+} from "../../../../static/js/utilities/compact_number";
export default class extends Controller {
static targets = ["textInput", "range"];
From 3925d1ad10515f256b9980a189c41f4c8e828532 Mon Sep 17 00:00:00 2001
From: Dan <39170265+chillenberger@users.noreply.github.com>
Date: Fri, 4 Oct 2024 08:13:32 -0600
Subject: [PATCH 3/3] fmt
---
pgml-dashboard/static/js/utilities/compact_number.js | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/pgml-dashboard/static/js/utilities/compact_number.js b/pgml-dashboard/static/js/utilities/compact_number.js
index f13b1cb31..f1624838d 100644
--- a/pgml-dashboard/static/js/utilities/compact_number.js
+++ b/pgml-dashboard/static/js/utilities/compact_number.js
@@ -25,4 +25,4 @@ export const compactToNumber = (compact) => {
} else {
return parseFloat(compact); // For numbers without suffixes
}
-};
\ No newline at end of file
+};
pFad - Phonifier reborn
Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.
Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.
Alternative Proxies:
Alternative Proxy
pFad Proxy
pFad v3 Proxy
pFad v4 Proxy