Merge pull request #6 from TravisL12/v095-total-distance

V095 total distance

manifest.json

@@ -1,6 +1,6 @@
 {
   "name": "Mouse Odometer",
-  "version": "0.9.2",
+  "version": "0.9.5",
   "manifest_version": 3,
   "description": "Keep track of the distance your mouse has moved!",
   "web_accessible_resources": [

public/scripts/application.js

@@ -37,14 +37,15 @@
 
   const getStorage = (cb) => {
     chrome.storage.sync.get(
-      ["currentDistance", "showOdometer", "currentDate"],
+      ["currentDistance", "showOdometer", "currentDate", "totalDistance"],
       cb
     );
   };
 
   class MouseOdometer {
     constructor() {
       this.currentDistance = 0;
+      this.totalDistance = 0;
       this.lastMove = { x: 0, y: 0 };
       this.throttledUpdate = throttle(this.updateStorage, STORAGE_UPDATE_DELAY);
       getStorage(this.buildOdometerWrapper.bind(this));
@@ -54,6 +55,7 @@
     buildOdometerWrapper(options) {
       this.currentDistance =
         options.currentDistance || this.currentDistance || 0;
+      this.totalDistance = options.totalDistance || this.totalDistance || 0;
 
       if (options.showOdometer) {
         this.odometerWrapper = document.createElement("div");
@@ -81,6 +83,7 @@
       const dy = Math.abs(oldY - newY);
       const move = Math.sqrt(dx ** 2 + dy ** 2);
       this.currentDistance += move;
+      this.totalDistance += move;
       this.throttledUpdate();
       this.renderDistance();
       this.lastMove = { x: newX, y: newY };
@@ -104,19 +107,25 @@
     // Sends distance to chrome.storage
     updateStorage() {
       chrome.runtime
-        .sendMessage({ latestDistance: this.currentDistance }, (response) => {
-          if (!response) {
-            return;
+        .sendMessage(
+          {
+            latestDistance: this.currentDistance,
+            totalDistance: this.totalDistance,
+          },
+          (response) => {
+            if (!response) {
+              return;
+            }
+
+            if (response?.isNewDay) {
+              this.currentDistance = 0;
+            }
+            const currentTier = response.currentTier;
+            this.odometerWrapper?.classList.add(
+              `odometer-text-color-${currentTier.background}`
+            );
           }
-
-          if (response?.isNewDay) {
-            this.currentDistance = 0;
-          }
-          const currentTier = response.currentTier;
-          this.odometerWrapper?.classList.add(
-            `odometer-text-color-${currentTier.background}`
-          );
-        })
+        )
         ?.bind(this);
     }
   }

public/scripts/background.js

@@ -18,11 +18,19 @@ chrome.runtime.onMessage.addListener((request, _, sendResponse) => {
       request.latestDistance > settings.currentDistance && !settings.isNewDay
         ? request.latestDistance
         : settings.currentDistance;
+    const newTotalDistance =
+      request.totalDistance > settings.totalDistance
+        ? request.totalDistance
+        : settings.totalDistance;
     const currentTier = findTier(newDistance);
     const iconPath = currentTier.path;
     chrome.action.setIcon({ path: { 128: iconPath } });
-    setStorage({ ...settings, currentDistance: newDistance });
-    sendResponse({ ...settings, currentTier });
+    setStorage({
+      ...settings,
+      currentDistance: newDistance,
+      totalDistance: newTotalDistance,
+    });
+    sendResponse({ ...settings, currentTier, totalDistance: newTotalDistance });
   });
   return true;
 });

public/scripts/options.js

@@ -5,7 +5,6 @@ import {
   APPLICATION_CLASSNAME,
   getFormattedDate,
   findAvgDistance,
-  sumDistances,
 } from "./utilities/helper.js";
 import { updateIcon, buildHistory } from "./utilities/historyGraph.js";
 
@@ -49,7 +48,8 @@ const pixelConversion = [
 ];
 
 export const updateDisplay = ({ options, date }) => {
-  const { currentDistance, previousDistances, maxDistance } = options;
+  const { currentDistance, previousDistances, maxDistance, totalDistance } =
+    options;
 
   const distance =
     date === "today"
@@ -88,18 +88,15 @@ showOdometerCheckbox.addEventListener("change", (event) => {
   setStorage({ showOdometer: event.target.checked });
 });
 
-const calcTotalDistance = (prevDistances, currentDistance) => {
-  const total = sumDistances(prevDistances);
-  totalDistanceCalculated = Math.round(total + currentDistance);
-  toggleTotalDistanceConversions();
-};
-
 getStorage((options) => {
   if (options.previousDistances) {
     buildHistory(options);
   }
   conversionIndex = options.conversionIndex || 0;
-  calcTotalDistance(options.previousDistances, options.currentDistance);
+  totalDistanceCalculated = options.totalDistance
+    ? Math.round(options.totalDistance)
+    : 0;
+  toggleTotalDistanceConversions();
   const currentTier = findTier(options.currentDistance);
   updateIcon(currentTier.path);
   odometerContainer.classList.add(`background-${currentTier.background}`);

public/scripts/utilities/helper.js

@@ -6,6 +6,7 @@ export const SETTING_VALUES = [
   "previousDistances",
   "conversionIndex",
   "maxDistance",
+  "totalDistance",
 ];
 
 const WHITE = "white";
@@ -60,6 +61,7 @@ export const formatDate = (date) => {
 };
 
 const DEFAULT_VALUES = {
+  totalDistance: 0,
   showOdometer: true,
   currentDistance: 0,
   currentDate: formatDate(new Date()),
@@ -101,6 +103,11 @@ export const buildSettings = (options) => {
     options.previousDistances?.slice(`-${MAX_DAY_HISTORY}`) ||
     DEFAULT_VALUES.previousDistances;
 
+  const totalDistance =
+    options.totalDistance > 0
+      ? options.totalDistance
+      : sumDistances(previousDistances) + currentDistance ||
+        DEFAULT_VALUES.totalDistance;
   const defaultMaxDist = { date, distance: currentDistance };
   const previousMaxDist = findMaxDistance(previousDistances);
 
@@ -135,6 +142,7 @@ export const buildSettings = (options) => {
     previousDistances,
     isNewDay,
     maxDistance,
+    totalDistance,
   };
 };