added estimated total words typed

frontend/src/styles/account.scss

@@ -120,6 +120,15 @@
   }
 
   .group {
+    &.estimatedWordsTyped {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      .title {
+        margin-right: 1rem;
+      }
+    }
+
     &.noDataError {
       margin: 20rem 0;
       text-align: center;

frontend/src/styles/z_media-queries.scss

@@ -499,6 +499,12 @@
         }
       }
     }
+    .group.estimatedWordsTyped {
+      flex-direction: column;
+      .title {
+        margin-right: unset;
+      }
+    }
   }
   .badge::after,
   .badge::before {

frontend/src/ts/pages/account.ts

@@ -273,6 +273,8 @@ function fillContent(): void {
     max: 0,
   };
 
+  let totalEstimatedWords = 0;
+
   // let totalSeconds = 0;
   totalSecondsFiltered = 0;
 
@@ -510,6 +512,10 @@ function fillContent(): void {
       //filters done
       //=======================================
 
+      totalEstimatedWords += Math.round(
+        (result.wpm / 60) * result.testDuration
+      );
+
       const resultDate = new Date(result.timestamp);
       resultDate.setSeconds(0);
       resultDate.setMinutes(0);
@@ -662,6 +668,8 @@ function fillContent(): void {
   loadMoreLines();
   ////////
 
+  console.log(totalEstimatedWords);
+
   const activityChartData_amount: MonkeyTypes.ActivityChartDataPoint[] = [];
   const activityChartData_time: MonkeyTypes.ActivityChartDataPoint[] = [];
   const activityChartData_avgWpm: MonkeyTypes.ActivityChartDataPoint[] = [];
@@ -960,6 +968,8 @@ function fillContent(): void {
     } ${Config.alwaysShowCPM ? "cpm" : "wpm"}.`
   );
 
+  $(".pageAccount .estimatedWordsTyped .val").text(totalEstimatedWords);
+
   applyHistorySmoothing();
   ChartController.accountActivity.updateColors();
   LoadingPage.updateBar(100, true);

frontend/static/html/pages/account.html

@@ -459,6 +459,10 @@
         <canvas id="accountActivityChart"></canvas>
       </div>
     </div>
+    <div class="group estimatedWordsTyped">
+      <div class="title">estimated words typed</div>
+      <div class="val">-</div>
+    </div>
     <div class="triplegroup stats">
       <div class="group testsStarted">
         <div class="title">tests started</div>