diff --git a/assets/controllers/map_controller.js b/assets/controllers/map_controller.js index 13d80fe..f3f6d1a 100644 --- a/assets/controllers/map_controller.js +++ b/assets/controllers/map_controller.js @@ -1,13 +1,63 @@ import { Controller } from '@hotwired/stimulus'; +import L from "leaflet"; + /** */ export default class extends Controller { - static targets = [ 'map',]; - static values = { - state: Number, - }; + static targets = [ 'map', 'modal', 'coords', 'name', 'container']; initialize() { + this.setIcon(); + this.coordinates = this.coordsTarget.textContent.split(', '); + + const map = L.map(this.mapTarget.id, { + attributionControl: false, + minZoom: 5, + }).setView(this.coordinates, 17); + + map.crs = L.CRS.EPSG4326; + + this.map = map; + this.addOsMap(); + this.addMarker(); + } + + open() { + this.modalTarget.classList.add('is-active'); + let map = this.map; + + map.invalidateSize(); + } + + close() { + this.modalTarget.classList.remove('is-active'); + } + + addOsMap() { + let osmap = new L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', { + maxNativeZoom : 22, + maxZoom: 22, + attribution: '© OpenStreetMap contributors' + }); + + osmap.addTo(this.map); + } + + setIcon() { + this.icon = L.icon({ + iconUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/images/marker-icon.png', + shadowUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/images/marker-shadow.png' + }); + } + + addMarker() { + L.marker( + this.coordinates, + {icon: this.icon} + ) + .bindTooltip(this.nameTarget.textContent) + .openTooltip() + .addTo(this.map); } } diff --git a/assets/styles/app.css b/assets/styles/app.css index 27a418c..982bb19 100755 --- a/assets/styles/app.css +++ b/assets/styles/app.css @@ -1,6 +1,7 @@ @import url('../fonts/stylesheet.css'); @import url('../fontawesome-free-6.6.0-web/css/all.min.css'); @import url('../vendor/bulma/css/bulma.min.css'); +@import url('../vendor/leaflet/dist/leaflet.min.css'); :root { --arcoa-blue: rgba(66,135,199,0.98); diff --git a/config/packages/security.yaml b/config/packages/security.yaml index 59cdd56..c793a95 100644 --- a/config/packages/security.yaml +++ b/config/packages/security.yaml @@ -40,6 +40,7 @@ security: - { path: ^/bibliography, roles: ROLE_USER } - { path: ^/collection, roles: ROLE_USER } - { path: ^/collector, roles: ROLE_USER } + - { path: ^/conservation_place, roles: ROLE_USER } - { path: ^/document, roles: ROLE_USER } - { path: ^/object, roles: ROLE_USER } - { path: ^/site, roles: ROLE_USER } diff --git a/src/Controller/ConservationPlaceController.php b/src/Controller/ConservationPlaceController.php index 3ea8a3e..0f077ab 100644 --- a/src/Controller/ConservationPlaceController.php +++ b/src/Controller/ConservationPlaceController.php @@ -17,6 +17,13 @@ class ConservationPlaceController extends AbstractController #[Route('/conservation_place/{id<\d+>}', name: 'app_conservation_place')] public function index(ConservationPlace $conservationPlace, EntityManagerInterface $em): Response { + $repo = $em->getRepository(ConservationPlace::class); + + $coords = $repo->coordinates($conservationPlace->getId()); + + $conservationPlace->setLat((float) $coords['lat']); + $conservationPlace->setLng((float) $coords['lng']); + return $this->render('conservation_place/index.html.twig', [ 'controller_name' => 'ConservationPlaceController', 'record' => $conservationPlace, diff --git a/src/Entity/ConservationPlace.php b/src/Entity/ConservationPlace.php index c7d5ed4..26960a0 100644 --- a/src/Entity/ConservationPlace.php +++ b/src/Entity/ConservationPlace.php @@ -29,7 +29,9 @@ class ConservationPlace implements RecordInterface private ?string $place = null; //#[ORM\Column(name: 'coord_cons', type: Types::TEXT)] - private ?string $coordinates = null; + private ?float $lat = null; + + private ?float $lng = null; #[ORM\Column(name: 'reg_cons', type: Types::TEXT)] private ?string $region = null; @@ -309,4 +311,28 @@ class ConservationPlace implements RecordInterface return $this; } + + public function getLat(): float + { + return $this->lat; + } + + public function setLat(float $lat): static + { + $this->lat = $lat; + + return $this; + } + + public function getLng(): float + { + return $this->lng; + } + + public function setLng(float $lng): static + { + $this->lng = $lng; + + return $this; + } } diff --git a/src/Repository/ConservationPlaceRepository.php b/src/Repository/ConservationPlaceRepository.php index 6942416..13cdf06 100644 --- a/src/Repository/ConservationPlaceRepository.php +++ b/src/Repository/ConservationPlaceRepository.php @@ -75,4 +75,22 @@ class ConservationPlaceRepository extends ServiceEntityRepository return new ArrayCollection($query->getResult()); } + + public function coordinates(int $id): ?array + { + $conn = $this->getEntityManager()->getConnection(); + + $sql = ' + SELECT + ST_X(coord_cons) as lng, + ST_Y(coord_cons) as lat + FROM conservation_place cp + WHERE cp.id = :id + '; + + $result = $conn->executeQuery($sql, ['id' => $id]); + + + return $result->fetchAssociative(); + } } diff --git a/templates/conservation_place/index.html.twig b/templates/conservation_place/index.html.twig index e994c96..d981f11 100644 --- a/templates/conservation_place/index.html.twig +++ b/templates/conservation_place/index.html.twig @@ -3,7 +3,7 @@ {% block title %}Conservation place - {{ record.place }} | ArCOA{% endblock %} {% block rightpanel %} -