impr(about): add spaces to the stats numbers to make them easier to read

monkeytypegame · Oct 30, 2023 · eb89b83 · eb89b83
1 parent 1b71d05
commit eb89b83
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 3 deletions.
diff --git a/frontend/src/ts/pages/about.ts b/frontend/src/ts/pages/about.ts
@@ -53,7 +53,7 @@ function updateStatsAndHistogram(): void {
     $(".pageAbout #totalTimeTypingStat .valSmall").text("years");
     $(".pageAbout #totalTimeTypingStat").attr(
       "aria-label",
-      Math.round(secondsRounded / 3600) + " hours"
+      Misc.numberWithSpaces(Math.round(secondsRounded / 3600)) + " hours"
     );
 
     const startedWithMagnitude = Misc.getNumberWithMagnitude(
@@ -70,7 +70,7 @@ function updateStatsAndHistogram(): void {
     );
     $(".pageAbout #totalStartedTestsStat").attr(
       "aria-label",
-      typingStatsResponseData.testsStarted + " tests"
+      Misc.numberWithSpaces(typingStatsResponseData.testsStarted) + " tests"
     );
 
     const completedWIthMagnitude = Misc.getNumberWithMagnitude(
@@ -87,7 +87,7 @@ function updateStatsAndHistogram(): void {
     );
     $(".pageAbout #totalCompletedTestsStat").attr(
       "aria-label",
-      typingStatsResponseData.testsCompleted + " tests"
+      Misc.numberWithSpaces(typingStatsResponseData.testsCompleted) + " tests"
     );
   }
 }

diff --git a/frontend/src/ts/utils/misc.ts b/frontend/src/ts/utils/misc.ts
@@ -1707,4 +1707,8 @@ export function getNumberWithMagnitude(num: number): {
   };
 }
 
+export function numberWithSpaces(x: number): string {
+  return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " ");
+}
+
 // DO NOT ALTER GLOBAL OBJECTSONSTRUCTOR, IT WILL BREAK RESULT HASHES