WIP: Some changes to make the android wrapper

capacitor.config.ts

@@ -0,0 +1,9 @@
+import type { CapacitorConfig } from '@capacitor/cli';
+
+const config: CapacitorConfig = {
+  appId: 'org.mapcomplete',
+  appName: 'MapComplete',
+  webDir: 'dist'
+};
+
+export default config;

package.json

@@ -156,6 +156,9 @@
     "not op_mini all"
   ],
   "dependencies": {
+    "@capacitor/android": "^6.1.2",
+    "@capacitor/core": "^6.1.2",
+    "@capacitor/geolocation": "^6.0.1",
     "@comunica/core": "^3.0.1",
     "@comunica/query-sparql": "^3.0.1",
     "@comunica/query-sparql-link-traversal": "^0.3.0",
@@ -235,6 +238,7 @@
     "@babeard/svelte-heroicons": "^2.0.0-rc.0",
     "@babel/polyfill": "^7.10.4",
     "@babel/preset-env": "7.13.8",
+    "@capacitor/cli": "^6.1.2",
     "@monaco-editor/loader": "^1.4.0",
     "@parcel/service-worker": "^2.6.0",
     "@rollup/plugin-json": "^6.0.0",

scripts/build.sh

@@ -25,7 +25,7 @@ else
 fi
 
 
-export NODE_OPTIONS=--max-old-space-size=16000
+export NODE_OPTIONS=--max-old-space-size=20000
 which vite
 vite --version
 vite build --sourcemap || { echo 'Vite build failed' ; exit 1; }

src/Logic/State/GeoLocationState.ts

@@ -3,6 +3,7 @@ import { LocalStorageSource } from "../Web/LocalStorageSource"
 import { QueryParameters } from "../Web/QueryParameters"
 import { Translation } from "../../UI/i18n/Translation"
 import Translations from "../../UI/i18n/Translations"
+import { Geolocation } from "@capacitor/geolocation"
 
 export type GeolocationPermissionState = "prompt" | "requested" | "granted" | "denied"
 
@@ -24,7 +25,7 @@ export class GeoLocationState {
      * 'denied' means that we don't have access
      */
     public readonly permission: UIEventSource<GeolocationPermissionState> = new UIEventSource(
-        "prompt"
+        "prompt",
     )
 
     /**
@@ -69,6 +70,7 @@ export class GeoLocationState {
      * A human explanation of the current gps state, to be shown on the home screen or as tooltip
      */
     public readonly gpsStateExplanation: Store<Translation>
+
     constructor() {
         const self = this
 
@@ -128,7 +130,7 @@ export class GeoLocationState {
                 }
                 return Translations.t.general.waitingForLocation
             },
-            [this.allowMoving, this.permission, this.currentGPSLocation]
+            [this.allowMoving, this.permission, this.currentGPSLocation],
         )
     }
 
@@ -201,29 +203,46 @@ export class GeoLocationState {
      * @private
      */
     private async startWatching() {
+        console.log("Starts watching", navigator.geolocation, Geolocation)
         const self = this
-        navigator.geolocation.watchPosition(
-            function (position) {
-                self._gpsAvailable.set(true)
-                self.currentGPSLocation.setData(position.coords)
-                self._previousLocationGrant.setData(true)
-            },
-            function (e) {
-                if (e.code === 2 || e.code === 3) {
-                    self._gpsAvailable.set(false)
-                    return
-                }
-                self._gpsAvailable.set(true) // We go back to the default assumption that the location is physically available
-                if (e.code === 1) {
-                    self.permission.set("denied")
-                    self._grantedThisSession.setData(false)
-                    return
-                }
-                console.warn("Could not get location with navigator.geolocation due to", e)
-            },
-            {
-                enableHighAccuracy: true,
-            }
-        )
+        try {
+            await Geolocation.requestPermissions({ permissions: ["location"] })
+            console.log("Requested permission")
+        } catch (e) {
+            // pass
+        }
+        try {
+            await Geolocation.watchPosition(
+                {
+                    enableHighAccuracy: true,
+                    maximumAge: 120000,
+                },
+                (position: GeolocationPosition, error: GeolocationPositionError) => {
+                    if (error) {
+                        if (error.code === 2 || error.code === 3) {
+                            self._gpsAvailable.set(false)
+                            return
+                        }
+                        self._gpsAvailable.set(true) // We go back to the default assumption that the location is physically available
+                        if (error.code === 1) {
+                            self.permission.set("denied")
+                            self._grantedThisSession.setData(false)
+                            return
+                        }
+                        console.warn("Could not get location with navigator.geolocation due to", error)
+                    }
+
+
+                    console.log("Got position:", position, JSON.stringify(position))
+                    if (!position) {
+                        return
+                    }
+                    this._gpsAvailable.set(true)
+                    this.currentGPSLocation.setData(position.coords)
+                    this._previousLocationGrant.setData(true)
+                })
+        } catch (e) {
+            console.error("Could not get geolocation due to", e)
+        }
     }
 }

src/index.manifest

@@ -1,13 +1,20 @@
 {
   "name": "MapComplete",
   "short_name": "MapComplete",
+  "id":"mapcomplete",
   "start_url": "index.html",
   "lang": "en",
   "display": "standalone",
-  "background_color": "#fff",
-  "theme_color": "#fff",
+  "background_color": "#ffffff",
+  "theme_color": "#ffffff",
   "description": "A thematic map viewer and editor based on OpenStreetMap",
-  "orientation": "portrait-primary, landscape-primary",
+  "orientation": "portrait-primary",
+    "display_override": [
+      "standalone",
+      "minimal-ui",
+      "browser",
+      "window-controls-overlay"
+    ],
   "icons": [
     {
       "src": "assets/generated/images/assets_svg_mapcomplete_logo72.png",