MAPG-102 query pano data from backend in map editor

public/index.php

@@ -22,6 +22,7 @@ Container::$routeCollection->group('game', function (MapGuesser\Routing\RouteCol
 Container::$routeCollection->group('admin', function (MapGuesser\Routing\RouteCollection $routeCollection) {
     $routeCollection->get('admin.maps', 'maps', [MapGuesser\Controller\MapAdminController::class, 'getMaps']);
     $routeCollection->get('admin.mapEditor', 'mapEditor/{mapId}', [MapGuesser\Controller\MapAdminController::class, 'getMapEditor']);
+    $routeCollection->get('admin.place', 'place.json/{placeId}', [MapGuesser\Controller\MapAdminController::class, 'getPlace']);
 });
 
 $match = Container::$routeCollection->match($method, explode('/', $url));

public/static/js/map_editor.js

@@ -4,18 +4,29 @@
         panorama: null,
         selectedMarker: null,
 
-        loadPano: function (data, status) {
+        getPlace: function(placeId) {
+            var xhr = new XMLHttpRequest();
+            xhr.responseType = 'json';
+            xhr.onload = function () {
                 document.getElementById('loading').style.visibility = 'hidden';
 
-            if (status !== google.maps.StreetViewStatus.OK) {
+                if (!this.response.panoId) {
                     document.getElementById('noPano').style.visibility = 'visible';
                     return;
                 }
 
+                MapEditor.loadPano(this.response.panoId);
+            };
+
+            xhr.open('GET', '/admin/place.json/' + placeId, true);
+            xhr.send();
+        },
+
+        loadPano: function (panoId) {
             MapEditor.panorama.setVisible(true);
             MapEditor.panorama.setPov({ heading: 0, pitch: 0 });
             MapEditor.panorama.setZoom(0);
-            MapEditor.panorama.setPano(data.location.pano);
+            MapEditor.panorama.setPano(panoId);
         },
 
         select: function (marker) {
@@ -41,8 +52,7 @@
 
             MapEditor.panorama.setVisible(false);
 
-            var sv = new google.maps.StreetViewService();
+            MapEditor.getPlace(marker.placeId);
-            sv.getPanorama({ location: marker.getLatLng(), preference: google.maps.StreetViewPreference.NEAREST, source: google.maps.StreetViewSource.OUTDOOR }, MapEditor.loadPano);
         },
 
         resetSelected: function () {
@@ -84,6 +94,8 @@
             .on('click', function () {
                 MapEditor.select(this);
             });
+
+        marker.placeId = places[i].id;
     }
 
     MapEditor.panorama = new google.maps.StreetViewPanorama(document.getElementById('panorama'), {

src/Controller/MapAdminController.php

@@ -1,9 +1,11 @@
 <?php namespace MapGuesser\Controller;
 
 use MapGuesser\Database\Query\Select;
+use MapGuesser\Http\Request;
 use MapGuesser\Interfaces\Database\IResultSet;
 use MapGuesser\Interfaces\Response\IContent;
 use MapGuesser\Response\HtmlContent;
+use MapGuesser\Response\JsonContent;
 use MapGuesser\Util\Geo\Bounds;
 
 class MapAdminController
@@ -25,6 +27,36 @@ class MapAdminController
         return new HtmlContent('admin/map_editor', $data);
     }
 
+    public function getPlace(array $parameters) {
+        $placeId = (int) $parameters['placeId'];
+
+        $select = new Select(\Container::$dbConnection, 'places');
+        $select->columns(['id', 'lat', 'lng']);
+        $select->whereId($placeId);
+
+        $place = $select->execute()->fetch(IResultSet::FETCH_ASSOC);
+
+        $request = new Request('https://maps.googleapis.com/maps/api/streetview/metadata', Request::HTTP_GET);
+        $request->setQuery([
+            'key' => $_ENV['GOOGLE_MAPS_SERVER_API_KEY'],
+            'location' => $place['lat'] . ',' . $place['lng'],
+            'source' => 'outdoor'
+        ]);
+
+        $response = $request->send();
+
+        $panoData = json_decode($response->getBody(), true);
+
+        if ($panoData['status'] !== 'OK') {
+            $panoId = null;
+        } else {
+            $panoId = $panoData['pano_id'];
+        }
+
+        $data = ['panoId' => $panoId];
+        return new JsonContent($data);
+    }
+
     private function getMapBounds(int $mapId): Bounds
     {
         $select = new Select(\Container::$dbConnection, 'maps');