Temporary measures to make wiring into the street view easier

client/src/components/screens/GamePanel/GamePanel.jsx

@@ -51,7 +51,11 @@ export default () => {
   return (
     <Container>
       <StreetViewWrapper>
-        <PositionedStreetView position={targetPoint} resetPosition={targetPoint} />
+        <PositionedStreetView 
+          startPosition={targetPoint}
+          resetPosition={targetPoint}
+          onPanoMoved={(lat, lng, head, pitch) => console.log(`${lat}, ${lng}, ${head}, ${pitch}`)}
+        />
       </StreetViewWrapper>
       <GuessPane
         onTimeout={handleSubmitGuess}

client/src/components/screens/GamePanel/PositionedStreetView.jsx

@@ -1,7 +1,6 @@
-import React, { useRef, useEffect } from "react";
-import usePano from "./usePano";
+import React, { useRef, useEffect, useCallback } from "react";
 import styled from "styled-components";
-import { savePointToLocalStorage } from "../../../domain/localStorageMethods";
+import usePano from "./usePano";
 
 const Container = styled.div`
   position: relative;
@@ -33,17 +32,25 @@ const ResetButton = styled.div`
   }
 `
 
-export default ({ position, resetPosition }) => {
+export default ({ startPosition, resetPosition, onPanoMoved }) => {
   const panoDivRef = useRef(null);
-  const panoRef = usePano(panoDivRef, position);
+  const panoRef = usePano(panoDivRef, { lat: 0, lng: 0 });
+  useEffect(() => {
+    if (panoRef.current) {
+      panoRef.current.setPosition(startPosition);
+    }
+  }, [panoRef, startPosition]);
+  const panoChangeCallback = useCallback(() => {
+    const pos = panoRef.current.getPosition();
+    const pov = panoRef.current.getPov();
+    onPanoMoved(pos.lat(), pos.lng(), pov.heading, pov.pitch);
+  }, [panoRef, onPanoMoved]);
   useEffect(() => {
     if (panoRef.current) {
-      panoRef.current.addListener("position_changed", () => {
-        const pos = panoRef.current.getPosition();
-        savePointToLocalStorage(pos.lat(), pos.lng());
-      });
+      panoRef.current.addListener("position_changed", panoChangeCallback);
+      panoRef.current.addListener("pov_changed", panoChangeCallback);
     }
-  }, [panoRef]);
+  }, [panoRef, panoChangeCallback]);
 
   return (
     <Container>