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

(cherry picked from commit 14b80dfea6)

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};