Add option to generate overlay URL

This is going to be expanded upon in future releases, for now it's hardcoded to use just the previous time overlay

src/index.js

@@ -6,7 +6,7 @@ import fetchData from "./fetchData";
 import {updateHighTime} from "./highTime";
 import {updateLowTime} from "./lowTime";
 import {addLoader, removeLoader} from "./loader";
-import {allowOverlay, forceOverlayOff, isOverlaySelected} from "./overlay";
+import {allowOverlay, forceOverlayOff, forceOverlayOn, isOverlayAllowed, isOverlaySelected} from "./overlay";
 import TokenChart from "./tokenChart";
 import Datum from "./datum";
 
@@ -212,6 +212,15 @@ function detectZeroQuery(urlSearchParams) {
     toggleStartYAtZero();
 }
 
+function detectOverlayQuery(urlSearchParams) {
+    const enableOverlay = urlSearchParams.get('overlay') === 'previous_time';
+    if (enableOverlay) {
+        forceOverlayOn();
+    } else {
+        forceOverlayOff();
+    }
+}
+
 function detectURLQuery() {
     const urlSearchParams = new URLSearchParams(window.location.search);
     if (urlSearchParams.has('region')) {
@@ -226,6 +235,9 @@ function detectURLQuery() {
     if (urlSearchParams.has('startAtZero')) {
         detectZeroQuery(urlSearchParams)
     }
+    if (urlSearchParams.has('overlay')) {
+        detectOverlayQuery(urlSearchParams);
+    }
 }
 
 function buildDeepLinksURL() {
@@ -242,6 +254,9 @@ function buildDeepLinksURL() {
     if (startYAtZero !== false){
         url += `startAtZero=${startYAtZero}&`
     }
+    if (isOverlaySelected()){
+        url += `overlay=previous_time&`
+    }
     return url
 }
 

src/overlay.js

@@ -19,9 +19,22 @@ function forceOverlayOff(){
     periodOverlayField.style.display = 'none';
 }
 
+function forceOverlayOn(){
+    const overlaySetting = document.getElementById("period-overlay");
+    const periodOverlayField = document.getElementById("period-overlay-options");
+    const advancedOptionsField = document.getElementById("advanced-options");
+    overlaySetting.checked = true;
+    advancedOptionsField.style.display = 'flex';
+    periodOverlayField.style.display = 'flex';
+}
+
+function isOverlayAllowed(timeSelection) {
+    return !(timeSelection === "all")
+}
+
 function allowOverlay(){
     const periodOverlayField = document.getElementById("period-overlay-options");
     periodOverlayField.style.display = 'flex';
 }
 
-export {isOverlaySelected, getOverlayTime, setOverlayLabelTime, forceOverlayOff, allowOverlay};
+export {isOverlaySelected, getOverlayTime, setOverlayLabelTime, forceOverlayOff, forceOverlayOn, isOverlayAllowed, allowOverlay};