From 7f03b0bca4b06d16318d08a6bd02085be4658a8b Mon Sep 17 00:00:00 2001
From: evlist <vdv@dyomedea.com>
Date: Wed, 2 Nov 2022 22:33:03 +0100
Subject: [PATCH] Cherry picking 57d17a1fa6 (Requesting a wake lock so that the
 screen is not dimmed while using the app.)

---
 src/App.tsx | 30 +++++++++++++++++++++++++++++-
 1 file changed, 29 insertions(+), 1 deletion(-)

diff --git a/src/App.tsx b/src/App.tsx
index b5041ed..ab2bb63 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -40,6 +40,34 @@ import CurrentLocation from './components/map/CurrentLocation';
 
 setupIonicReact();
 
+// See https://stackoverflow.com/questions/71538643/property-wakelock-does-not-exist-on-type-navigator
+const requestWakeLock = async () => {
+  const anyNav: any = navigator;
+  if ('wakeLock' in navigator) {
+    try {
+      const wakeLock = await anyNav['wakeLock'].request('screen');
+    } catch (err: any) {
+      // The wake lock request fails - usually system-related, such as low battery.
+      console.log(`Wake lock request failed: ${err.name}, ${err.message}`);
+    }
+  } else {
+    console.log('No wake lock support here...');
+  }
+};
+
+const handleVisibilityChange = () => {
+  if (document.hidden) {
+    console.log('Application hidden');
+  } else {
+    console.log('Application visible');
+    requestWakeLock();
+  }
+};
+
+// See https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API
+document.addEventListener('visibilitychange', handleVisibilityChange, false);
+requestWakeLock();
+
 const initialScope: MapScope = {
   center: { lat: -37.8403508, lon: 77.5539501 },
   zoom: 13,
@@ -71,7 +99,7 @@ const App: React.FC = () => {
             scope={scope}
             setScope={debounce(setScope, 1000)}
             numberOfTiledLayers={5}
-            markers={[<CurrentLocation key='currentLocation'/>]}
+            markers={[<CurrentLocation key='currentLocation' />]}
           />
         </IonApp>
       </IonContent>