impr(about): showing decimal places for typing stats if the number is…

… small Also no longer always showing millions - order of magnitude is now dynamic.
monkeytypegame · Oct 9, 2023 · 876b882 · 876b882
1 parent cf2ff91
commit 876b882
Show file tree

Hide file tree

Showing 2 changed files with 51 additions and 4 deletions.
diff --git a/frontend/src/ts/pages/about.ts b/frontend/src/ts/pages/about.ts
@@ -56,19 +56,35 @@ function updateStatsAndHistogram(): void {
       Math.round(secondsRounded / 3600) + " hours"
     );
 
+    const startedWithMagnitude = Misc.getNumberWithMagnitude(
+      typingStatsResponseData.testsStarted
+    );
+
     $(".pageAbout #totalStartedTestsStat .val").text(
-      Math.round(typingStatsResponseData.testsStarted / 1000000)
+      typingStatsResponseData.testsStarted < 10
+        ? startedWithMagnitude.roundedTo2
+        : startedWithMagnitude.rounded
+    );
+    $(".pageAbout #totalStartedTestsStat .valSmall").text(
+      startedWithMagnitude.orderOfMagnitude
     );
-    $(".pageAbout #totalStartedTestsStat .valSmall").text("million");
     $(".pageAbout #totalStartedTestsStat").attr(
       "aria-label",
       typingStatsResponseData.testsStarted + " tests"
     );
 
+    const completedWIthMagnitude = Misc.getNumberWithMagnitude(
+      typingStatsResponseData.testsCompleted
+    );
+
     $(".pageAbout #totalCompletedTestsStat .val").text(
-      Math.round(typingStatsResponseData.testsCompleted / 1000000)
+      typingStatsResponseData.testsCompleted < 10
+        ? completedWIthMagnitude.roundedTo2
+        : completedWIthMagnitude.rounded
+    );
+    $(".pageAbout #totalCompletedTestsStat .valSmall").text(
+      completedWIthMagnitude.orderOfMagnitude
     );
-    $(".pageAbout #totalCompletedTestsStat .valSmall").text("million");
     $(".pageAbout #totalCompletedTestsStat").attr(
       "aria-label",
       typingStatsResponseData.testsCompleted + " tests"

diff --git a/frontend/src/ts/utils/misc.ts b/frontend/src/ts/utils/misc.ts
@@ -1679,4 +1679,35 @@ export function updateTitle(title?: string): void {
   }
 }
 
+export function getNumberWithMagnitude(num: number): {
+  rounded: number;
+  roundedTo2: number;
+  orderOfMagnitude: string;
+} {
+  const units = [
+    "",
+    "thousand",
+    "million",
+    "billion",
+    "trillion",
+    "quadrillion",
+    "quintillion",
+  ];
+  let unitIndex = 0;
+  let roundedNum = num;
+
+  while (roundedNum >= 1000) {
+    roundedNum /= 1000;
+    unitIndex++;
+  }
+
+  const unit = units[unitIndex];
+
+  return {
+    rounded: Math.round(roundedNum),
+    roundedTo2: roundTo2(roundedNum),
+    orderOfMagnitude: unit,
+  };
+}
+
 // DO NOT ALTER GLOBAL OBJECTSONSTRUCTOR, IT WILL BREAK RESULT HASHES