Displaying the current location on the whiteboard.

src/store/map.ts

@@ -21,7 +21,7 @@ export interface MapScope {
 }
 var initialMapScope: MapScope = {
   center: { lat: -37.8403508, lon: 77.5539501 },
-  zoom: 17,
+  zoom: 15,
 };
 
 // Derived properties
@@ -45,37 +45,21 @@ export interface WhiteboardState {
   translation: Point;
 }
 
+// Current location
+
+export interface CurrentLocationState {
+  geo: geoPoint;
+  whiteboard: Point;
+}
+
 // Global state
 export interface MapState {
   scope: MapScope;
   tiles: TilesDescription;
   slippy: SlippyState;
   whiteboard: WhiteboardState;
+  currentLocation: CurrentLocationState;
 }
-/*
-
-const nbTilesY = _.ceil(mapState.viewport.height / tileSize) + 4;
-  const nbTilesX = _.ceil(mapState.viewport.width / tileSize) + 4;
-  const [tileCenterY, reminderY] = lat2tile(
-    mapState.scope.center.lat,
-    mapState.scope.zoom
-  );
-  const [tileCenterX, reminderX] = lon2tile(
-    mapState.scope.center.lon,
-    mapState.scope.zoom
-  );
-  const firstTileY = tileCenterY - _.round(nbTilesY / 2);
-  const firstTileX = tileCenterX - _.round(nbTilesX / 2);
-  const locationY = (tileCenterY + reminderY - firstTileY) * tileSize;
-  const locationX = (tileCenterX + reminderX - firstTileX) * tileSize;
-  const targetLocationY = mapState.viewport.height / 2;
-  const targetLocationX = mapState.viewport.width / 2;
-  const deltaY = targetLocationY - locationY;
-  const deltaX = targetLocationX - locationX;
-
-
-*/
-
 export var initialMapState: MapState = {
   scope: initialMapScope,
   slippy: {
@@ -103,6 +87,16 @@ export var initialMapState: MapState = {
       y: 0,
     },
   },
+  currentLocation: {
+    geo: {
+      lat: 0,
+      lon: 0,
+    },
+    whiteboard: {
+      x: 0,
+      y: 0,
+    },
+  },
 };
 
 const evaluateWhiteboardViewBox = (
@@ -211,6 +205,18 @@ const mapSlice = createSlice({
       state.scope.center.lon = action.payload.lon;
       evaluateStateFromScope(state);
     },
+    setCurrent: (state, action) => {
+      state.currentLocation.geo.lat = action.payload.lat;
+      state.currentLocation.geo.lon = action.payload.lon;
+      state.currentLocation.whiteboard.x = lon2tile(
+        state.currentLocation.geo.lon,
+        zoom0
+      );
+      state.currentLocation.whiteboard.y = lat2tile(
+        state.currentLocation.geo.lat,
+        zoom0
+      );
+    },
     shift: (state, action) => {
       state.slippy.translation.x =
         state.slippy.translation.x + action.payload.x;