From 87ef0d1918f07af593f235f2d62128297577bc7f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?P=C5=91cze=20Bence?= Date: Tue, 2 Jun 2020 21:44:01 +0200 Subject: [PATCH] MAPG-102 query pano data from backend in map editor --- public/index.php | 1 + public/static/js/map_editor.js | 30 +++++++++++++++++-------- src/Controller/MapAdminController.php | 32 +++++++++++++++++++++++++++ 3 files changed, 54 insertions(+), 9 deletions(-) diff --git a/public/index.php b/public/index.php index 6d774ed..829da88 100644 --- a/public/index.php +++ b/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)); diff --git a/public/static/js/map_editor.js b/public/static/js/map_editor.js index 9f790a4..bd83db8 100644 --- a/public/static/js/map_editor.js +++ b/public/static/js/map_editor.js @@ -4,18 +4,29 @@ panorama: null, selectedMarker: null, - loadPano: function (data, status) { - document.getElementById('loading').style.visibility = 'hidden'; + 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) { - document.getElementById('noPano').style.visibility = 'visible'; - return; - } + 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(); - sv.getPanorama({ location: marker.getLatLng(), preference: google.maps.StreetViewPreference.NEAREST, source: google.maps.StreetViewSource.OUTDOOR }, MapEditor.loadPano); + MapEditor.getPlace(marker.placeId); }, 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'), { diff --git a/src/Controller/MapAdminController.php b/src/Controller/MapAdminController.php index 39c8bd5..b2485ea 100644 --- a/src/Controller/MapAdminController.php +++ b/src/Controller/MapAdminController.php @@ -1,9 +1,11 @@ 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');