mirror of
https://forge.chapril.org/tykayn/osm-commerces
synced 2025-10-04 17:04:53 +02:00
up recherche home avec nominatim
This commit is contained in:
parent
7f79ec3a9f
commit
c89751b45c
7 changed files with 601 additions and 220 deletions
5
.idea/codeStyles/codeStyleConfig.xml
generated
Normal file
5
.idea/codeStyles/codeStyleConfig.xml
generated
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
<component name="ProjectCodeStyleConfiguration">
|
||||||
|
<state>
|
||||||
|
<option name="PREFERRED_PROJECT_CODE_STYLE" value="Default" />
|
||||||
|
</state>
|
||||||
|
</component>
|
15
.idea/php.xml
generated
15
.idea/php.xml
generated
|
@ -10,6 +10,11 @@
|
||||||
<option name="highlightLevel" value="WARNING" />
|
<option name="highlightLevel" value="WARNING" />
|
||||||
<option name="transferred" value="true" />
|
<option name="transferred" value="true" />
|
||||||
</component>
|
</component>
|
||||||
|
<component name="PhpCodeSniffer">
|
||||||
|
<phpcs_settings>
|
||||||
|
<phpcs_by_interpreter asDefaultInterpreter="true" interpreter_id="9bdd9bda-8cdb-43f2-af13-070085f7956e" timeout="30000" />
|
||||||
|
</phpcs_settings>
|
||||||
|
</component>
|
||||||
<component name="PhpIncludePathManager">
|
<component name="PhpIncludePathManager">
|
||||||
<include_path>
|
<include_path>
|
||||||
<path value="$PROJECT_DIR$/vendor/phpunit/phpunit" />
|
<path value="$PROJECT_DIR$/vendor/phpunit/phpunit" />
|
||||||
|
@ -155,6 +160,11 @@
|
||||||
</include_path>
|
</include_path>
|
||||||
</component>
|
</component>
|
||||||
<component name="PhpProjectSharedConfiguration" php_language_level="8.2" />
|
<component name="PhpProjectSharedConfiguration" php_language_level="8.2" />
|
||||||
|
<component name="PhpStan">
|
||||||
|
<PhpStan_settings>
|
||||||
|
<phpstan_by_interpreter asDefaultInterpreter="true" interpreter_id="9bdd9bda-8cdb-43f2-af13-070085f7956e" timeout="60000" />
|
||||||
|
</PhpStan_settings>
|
||||||
|
</component>
|
||||||
<component name="PhpStanOptionsConfiguration">
|
<component name="PhpStanOptionsConfiguration">
|
||||||
<option name="transferred" value="true" />
|
<option name="transferred" value="true" />
|
||||||
</component>
|
</component>
|
||||||
|
@ -163,6 +173,11 @@
|
||||||
<PhpUnitSettings configuration_file_path="$PROJECT_DIR$/phpunit.xml.dist" custom_loader_path="$PROJECT_DIR$/vendor/autoload.php" use_configuration_file="true" />
|
<PhpUnitSettings configuration_file_path="$PROJECT_DIR$/phpunit.xml.dist" custom_loader_path="$PROJECT_DIR$/vendor/autoload.php" use_configuration_file="true" />
|
||||||
</phpunit_settings>
|
</phpunit_settings>
|
||||||
</component>
|
</component>
|
||||||
|
<component name="Psalm">
|
||||||
|
<Psalm_settings>
|
||||||
|
<psalm_fixer_by_interpreter asDefaultInterpreter="true" interpreter_id="9bdd9bda-8cdb-43f2-af13-070085f7956e" timeout="60000" />
|
||||||
|
</Psalm_settings>
|
||||||
|
</component>
|
||||||
<component name="PsalmOptionsConfiguration">
|
<component name="PsalmOptionsConfiguration">
|
||||||
<option name="transferred" value="true" />
|
<option name="transferred" value="true" />
|
||||||
</component>
|
</component>
|
||||||
|
|
|
@ -1967,7 +1967,7 @@ final class AdminController extends AbstractController
|
||||||
|
|
||||||
// Set OSM object type and OSM ID from the Place
|
// Set OSM object type and OSM ID from the Place
|
||||||
$demande->setOsmObjectType($place->getOsmKind());
|
$demande->setOsmObjectType($place->getOsmKind());
|
||||||
$demande->setOsmId((int)$place->getOsmId());
|
$demande->setOsmId($place->getOsmId());
|
||||||
|
|
||||||
$this->entityManager->persist($demande);
|
$this->entityManager->persist($demande);
|
||||||
$this->entityManager->flush();
|
$this->entityManager->flush();
|
||||||
|
|
|
@ -148,10 +148,11 @@ class PublicController extends AbstractController
|
||||||
|
|
||||||
// Save the OSM ID if provided
|
// Save the OSM ID if provided
|
||||||
if (isset($data['osmId']) && !empty($data['osmId'])) {
|
if (isset($data['osmId']) && !empty($data['osmId'])) {
|
||||||
$demande->setOsmId((int)$data['osmId']);
|
$demande->setOsmId($data['osmId']);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Check if a Place exists with the same OSM ID and type
|
// Check if a Place exists with the same OSM ID and type
|
||||||
|
$place = null;
|
||||||
if ($demande->getOsmId() && $demande->getOsmObjectType()) {
|
if ($demande->getOsmId() && $demande->getOsmObjectType()) {
|
||||||
$existingPlace = $this->entityManager->getRepository(Place::class)->findOneBy([
|
$existingPlace = $this->entityManager->getRepository(Place::class)->findOneBy([
|
||||||
'osm_kind' => $demande->getOsmObjectType(),
|
'osm_kind' => $demande->getOsmObjectType(),
|
||||||
|
@ -162,6 +163,45 @@ class PublicController extends AbstractController
|
||||||
// Link the Place UUID to the Demande
|
// Link the Place UUID to the Demande
|
||||||
$demande->setPlaceUuid($existingPlace->getUuidForUrl());
|
$demande->setPlaceUuid($existingPlace->getUuidForUrl());
|
||||||
$demande->setPlace($existingPlace);
|
$demande->setPlace($existingPlace);
|
||||||
|
$place = $existingPlace;
|
||||||
|
} else {
|
||||||
|
// Create a new Place if one doesn't exist
|
||||||
|
$place = new Place();
|
||||||
|
$place->setOsmId((string)$demande->getOsmId());
|
||||||
|
$place->setOsmKind($demande->getOsmObjectType());
|
||||||
|
|
||||||
|
// Get OSM data from Overpass API
|
||||||
|
$commerce_overpass = $this->motocultrice->get_osm_object_data($demande->getOsmObjectType(), $demande->getOsmId());
|
||||||
|
|
||||||
|
if ($commerce_overpass) {
|
||||||
|
// Update the Place with OSM data
|
||||||
|
$place->update_place_from_overpass_data($commerce_overpass);
|
||||||
|
|
||||||
|
// Link the Place to the Demande
|
||||||
|
$demande->setPlaceUuid($place->getUuidForUrl());
|
||||||
|
$demande->setPlace($place);
|
||||||
|
|
||||||
|
// Persist the Place
|
||||||
|
$this->entityManager->persist($place);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Link the Place to a Stat object using the INSEE code
|
||||||
|
if ($place && $demande->getInsee()) {
|
||||||
|
$stats = $place->getStats();
|
||||||
|
if (!$stats) {
|
||||||
|
$stats_exist = $this->entityManager->getRepository(Stats::class)->findOneBy(['zone' => $demande->getInsee()]);
|
||||||
|
if ($stats_exist) {
|
||||||
|
$stats = $stats_exist;
|
||||||
|
} else {
|
||||||
|
$stats = new Stats();
|
||||||
|
$stats->setZone((string)$demande->getInsee());
|
||||||
|
$this->entityManager->persist($stats);
|
||||||
|
}
|
||||||
|
|
||||||
|
$stats->addPlace($place);
|
||||||
|
$place->setStats($stats);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -41,8 +41,8 @@ class Demande
|
||||||
#[ORM\Column(length: 10, nullable: true)]
|
#[ORM\Column(length: 10, nullable: true)]
|
||||||
private ?string $osmObjectType = null;
|
private ?string $osmObjectType = null;
|
||||||
|
|
||||||
#[ORM\Column(nullable: true)]
|
#[ORM\Column(nullable: true, type: 'string', length: 255)]
|
||||||
private ?int $osmId = null;
|
private ?string $osmId = null;
|
||||||
|
|
||||||
public function __construct()
|
public function __construct()
|
||||||
{
|
{
|
||||||
|
@ -163,12 +163,12 @@ class Demande
|
||||||
return $this;
|
return $this;
|
||||||
}
|
}
|
||||||
|
|
||||||
public function getOsmId(): ?int
|
public function getOsmId(): ?string
|
||||||
{
|
{
|
||||||
return $this->osmId;
|
return $this->osmId;
|
||||||
}
|
}
|
||||||
|
|
||||||
public function setOsmId(?int $osmId): static
|
public function setOsmId(?string $osmId): static
|
||||||
{
|
{
|
||||||
$this->osmId = $osmId;
|
$this->osmId = $osmId;
|
||||||
|
|
||||||
|
|
|
@ -133,6 +133,13 @@
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
|
// Enable the labourage form
|
||||||
|
if (typeof enableLabourageForm === 'function') {
|
||||||
|
enableLabourageForm();
|
||||||
|
} else {
|
||||||
|
console.error('enableLabourageForm function not found');
|
||||||
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -112,6 +112,15 @@
|
||||||
background-color: #f5f5f5;
|
background-color: #f5f5f5;
|
||||||
color: #000;
|
color: #000;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#resultsMap {
|
||||||
|
height: 400px;
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 1rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
border-radius: 8px;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
@ -162,7 +171,8 @@
|
||||||
<i class="bi bi-globe text-primary" style="font-size: 3rem;"></i>
|
<i class="bi bi-globe text-primary" style="font-size: 3rem;"></i>
|
||||||
</div>
|
</div>
|
||||||
<h3 class="card-title h5 fw-bold">Visibilité Maximale</h3>
|
<h3 class="card-title h5 fw-bold">Visibilité Maximale</h3>
|
||||||
<p class="card-text">Vos informations apparaîtront sur TomTom, Apple Plans, Facebook, CoMaps et des
|
<p class="card-text">Vos informations apparaîtront sur TomTom, Apple Plans, Facebook, CoMaps et
|
||||||
|
des
|
||||||
centaines d'autres applications.</p>
|
centaines d'autres applications.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -222,9 +232,23 @@
|
||||||
<div class="form-text">
|
<div class="form-text">
|
||||||
<i class="bi bi-info-circle"></i> Exemple: Café de la Place, Lyon
|
<i class="bi bi-info-circle"></i> Exemple: Café de la Place, Lyon
|
||||||
</div>
|
</div>
|
||||||
|
<div class="mt-2 d-none">
|
||||||
|
<label class="form-label">Moteur de recherche :</label>
|
||||||
|
<div class="form-check form-check-inline">
|
||||||
|
<input class="form-check-input" type="radio" name="searchEngine" id="nominatim"
|
||||||
|
value="nominatim" checked>
|
||||||
|
<label class="form-check-label" for="nominatim">Nominatim</label>
|
||||||
|
</div>
|
||||||
|
<div class="form-check form-check-inline">
|
||||||
|
<input class="form-check-input" type="radio" name="searchEngine" id="addok"
|
||||||
|
value="addok">
|
||||||
|
<label class="form-check-label" for="addok">Addok</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="resultsList" class="mt-4"></div>
|
<div id="resultsList" class="mt-4"></div>
|
||||||
|
<div id="resultsMap"></div>
|
||||||
<div id="proposeLink" class="d-none"></div>
|
<div id="proposeLink" class="d-none"></div>
|
||||||
<div id="proposeMail" class="d-none">
|
<div id="proposeMail" class="d-none">
|
||||||
<div class="mb-3">
|
<div class="mb-3">
|
||||||
|
@ -375,19 +399,88 @@
|
||||||
|
|
||||||
const searchInput = document.querySelector('#researchShop');
|
const searchInput = document.querySelector('#researchShop');
|
||||||
const resultsList = document.querySelector('#resultsList');
|
const resultsList = document.querySelector('#resultsList');
|
||||||
|
const resultsMap = document.querySelector('#resultsMap');
|
||||||
resultsList.classList.add('list-group', 'mt-2');
|
resultsList.classList.add('list-group', 'mt-2');
|
||||||
|
|
||||||
|
// Initialize map
|
||||||
|
let map = null;
|
||||||
|
let markers = [];
|
||||||
|
|
||||||
|
function initMap() {
|
||||||
|
if (!map) {
|
||||||
|
map = new maplibregl.Map({
|
||||||
|
container: 'resultsMap',
|
||||||
|
style: 'https://api.maptiler.com/maps/streets/style.json?key={{ maptiler_token }}',
|
||||||
|
center: [2.213749, 46.227638], // Center of France
|
||||||
|
zoom: 5
|
||||||
|
});
|
||||||
|
|
||||||
|
// Add navigation controls
|
||||||
|
map.addControl(new maplibregl.NavigationControl());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function clearMarkers() {
|
||||||
|
// Remove all existing markers
|
||||||
|
markers.forEach(marker => marker.remove());
|
||||||
|
markers = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
function performSearch() {
|
||||||
|
clearTimeout(timeoutId);
|
||||||
|
resultsList.innerHTML = '';
|
||||||
|
resultsMap.style.display = 'none';
|
||||||
|
clearMarkers();
|
||||||
|
|
||||||
|
const query_input_user = searchInput.value;
|
||||||
|
|
||||||
|
if (query_input_user.length < 2) return;
|
||||||
|
|
||||||
|
// Get the selected search engine
|
||||||
|
const searchEngine = document.querySelector('input[name="searchEngine"]:checked').value;
|
||||||
|
|
||||||
|
let searchUrl;
|
||||||
|
if (searchEngine === 'nominatim') {
|
||||||
|
// Use Nominatim API
|
||||||
|
searchUrl = `https://nominatim.openstreetmap.org/search?q=${query_input_user}&format=json&limit=5&countrycodes=fr`;
|
||||||
|
} else {
|
||||||
|
// Use Addok API
|
||||||
|
searchUrl = `https://demo.addok.xyz/search?q=${query_input_user}&limit=5`;
|
||||||
|
}
|
||||||
|
|
||||||
|
fetch(searchUrl)
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add event listeners to search engine radio buttons
|
||||||
|
document.querySelectorAll('input[name="searchEngine"]').forEach(radio => {
|
||||||
|
radio.addEventListener('change', performSearch);
|
||||||
|
});
|
||||||
|
|
||||||
let timeoutId;
|
let timeoutId;
|
||||||
searchInput.addEventListener('input', function (e) {
|
searchInput.addEventListener('input', function (e) {
|
||||||
clearTimeout(timeoutId);
|
clearTimeout(timeoutId);
|
||||||
resultsList.innerHTML = '';
|
resultsList.innerHTML = '';
|
||||||
|
resultsMap.style.display = 'none';
|
||||||
|
clearMarkers();
|
||||||
|
|
||||||
if (e.target.value.length < 2) return;
|
if (e.target.value.length < 2) return;
|
||||||
|
|
||||||
const query_input_user = e.target.value;
|
const query_input_user = e.target.value;
|
||||||
|
|
||||||
timeoutId = setTimeout(() => {
|
timeoutId = setTimeout(() => {
|
||||||
fetch(`https://demo.addok.xyz/search?q=${query_input_user}&limit=5`)
|
// Get the selected search engine
|
||||||
|
const searchEngine = document.querySelector('input[name="searchEngine"]:checked').value;
|
||||||
|
|
||||||
|
let searchUrl;
|
||||||
|
if (searchEngine === 'nominatim') {
|
||||||
|
// Use Nominatim API
|
||||||
|
searchUrl = `https://nominatim.openstreetmap.org/search?q=${query_input_user}&format=json&limit=5&countrycodes=fr`;
|
||||||
|
} else {
|
||||||
|
// Use Addok API
|
||||||
|
searchUrl = `https://demo.addok.xyz/search?q=${query_input_user}&limit=5`;
|
||||||
|
}
|
||||||
|
|
||||||
|
fetch(searchUrl)
|
||||||
.then(response => response.json())
|
.then(response => response.json())
|
||||||
.then(data => {
|
.then(data => {
|
||||||
console.log(data);
|
console.log(data);
|
||||||
|
@ -397,15 +490,7 @@
|
||||||
ul.classList.add('list-group');
|
ul.classList.add('list-group');
|
||||||
resultsList.appendChild(ul);
|
resultsList.appendChild(ul);
|
||||||
|
|
||||||
// Show a message if there are no results
|
// This section will be handled in the code below
|
||||||
if (data.features.length === 0) {
|
|
||||||
const noResultsMessage = document.createElement('div');
|
|
||||||
noResultsMessage.classList.add('alert', 'alert-info', 'mt-3');
|
|
||||||
noResultsMessage.innerHTML = `
|
|
||||||
<i class="bi bi-info-circle"></i> Aucun résultat trouvé pour votre recherche.
|
|
||||||
`;
|
|
||||||
resultsList.appendChild(noResultsMessage);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Add "Not found" button
|
// Add "Not found" button
|
||||||
if (true) {
|
if (true) {
|
||||||
|
@ -422,6 +507,9 @@
|
||||||
document.getElementById('notFoundButton').addEventListener('click', () => {
|
document.getElementById('notFoundButton').addEventListener('click', () => {
|
||||||
// Clear results list
|
// Clear results list
|
||||||
resultsList.innerHTML = '';
|
resultsList.innerHTML = '';
|
||||||
|
// Hide map and clear markers
|
||||||
|
resultsMap.style.display = 'none';
|
||||||
|
clearMarkers();
|
||||||
|
|
||||||
// Show form to enter email
|
// Show form to enter email
|
||||||
const notFoundForm = document.createElement('div');
|
const notFoundForm = document.createElement('div');
|
||||||
|
@ -451,9 +539,15 @@
|
||||||
|
|
||||||
// Try to get the INSEE code from the first search result
|
// Try to get the INSEE code from the first search result
|
||||||
let insee = null;
|
let insee = null;
|
||||||
|
if (searchEngine === 'nominatim') {
|
||||||
|
if (data.length > 0 && data[0].address && data[0].address.postcode) {
|
||||||
|
insee = data[0].address.postcode;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
if (data.features && data.features.length > 0) {
|
if (data.features && data.features.length > 0) {
|
||||||
insee = data.features[0].properties.citycode;
|
insee = data.features[0].properties.citycode;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Create a Demande with the business name and email
|
// Create a Demande with the business name and email
|
||||||
fetch('/api/demande/create', {
|
fetch('/api/demande/create', {
|
||||||
|
@ -510,22 +604,84 @@
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
data.features.forEach(feature => {
|
// Process the results based on the search engine
|
||||||
|
if (searchEngine === 'nominatim') {
|
||||||
|
// Show a message if there are no results
|
||||||
|
if (data.length === 0) {
|
||||||
|
const noResultsMessage = document.createElement('div');
|
||||||
|
noResultsMessage.classList.add('alert', 'alert-info', 'mt-3');
|
||||||
|
noResultsMessage.innerHTML = `
|
||||||
|
<i class="bi bi-info-circle"></i> Aucun résultat trouvé pour votre recherche.
|
||||||
|
`;
|
||||||
|
resultsList.appendChild(noResultsMessage);
|
||||||
|
} else {
|
||||||
|
// Initialize map if we have results
|
||||||
|
initMap();
|
||||||
|
resultsMap.style.display = 'block';
|
||||||
|
|
||||||
|
// Calculate bounds for the map
|
||||||
|
const bounds = new maplibregl.LngLatBounds();
|
||||||
|
|
||||||
|
// Add markers for each result
|
||||||
|
data.forEach((result, index) => {
|
||||||
|
const lat = parseFloat(result.lat);
|
||||||
|
const lon = parseFloat(result.lon);
|
||||||
|
|
||||||
|
// Extend bounds
|
||||||
|
bounds.extend([lon, lat]);
|
||||||
|
|
||||||
|
// Create marker with result number
|
||||||
|
const marker = new maplibregl.Marker({color: '#007bff'})
|
||||||
|
.setLngLat([lon, lat])
|
||||||
|
.setPopup(new maplibregl.Popup().setHTML(`
|
||||||
|
<strong>${result.name || result.display_name}</strong><br>
|
||||||
|
${result.address ? result.address.city || '' : ''}
|
||||||
|
`));
|
||||||
|
|
||||||
|
// Add label with result number
|
||||||
|
const el = marker.getElement();
|
||||||
|
el.innerHTML = `<div style="position: absolute; top: -30px; left: 7px; background: white; border-radius: 50%; width: 20px; height: 20px; text-align: center; line-height: 20px; font-weight: bold; border: 2px solid #007bff;">${index + 1}</div>` + el.innerHTML;
|
||||||
|
|
||||||
|
marker.addTo(map);
|
||||||
|
markers.push(marker);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Fit map to bounds with padding
|
||||||
|
if (!bounds.isEmpty()) {
|
||||||
|
map.fitBounds(bounds, {padding: 50});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
data.forEach((result, index) => {
|
||||||
const li = document.createElement('li');
|
const li = document.createElement('li');
|
||||||
li.classList.add('list-group-item', 'cursor-pointer');
|
li.classList.add('list-group-item', 'cursor-pointer');
|
||||||
li.textContent = `${feature.properties.name}, ${feature.properties.city}`;
|
|
||||||
|
// Format the display text based on available properties
|
||||||
|
let displayText = result.display_name;
|
||||||
|
if (result.name) {
|
||||||
|
displayText = result.name;
|
||||||
|
if (result.address && result.address.city) {
|
||||||
|
displayText += `, ${result.address.city}`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add result number
|
||||||
|
li.innerHTML = `<span class="badge bg-primary me-2">${index + 1}</span> ${displayText}`;
|
||||||
|
|
||||||
li.addEventListener('click', () => {
|
li.addEventListener('click', () => {
|
||||||
resultsList.innerHTML = ''; // Cacher la liste
|
resultsList.innerHTML = ''; // Cacher la liste
|
||||||
const [lon, lat] = feature.geometry.coordinates;
|
resultsMap.style.display = 'none'; // Cacher la carte
|
||||||
|
clearMarkers(); // Supprimer les marqueurs
|
||||||
|
const lat = parseFloat(result.lat);
|
||||||
|
const lon = parseFloat(result.lon);
|
||||||
const query = `[out:json];
|
const query = `[out:json];
|
||||||
(
|
(
|
||||||
node["shop"](around:100,${lat},${lon});
|
node["shop"](around:10,${lat},${lon});
|
||||||
node["amenity"](around:100,${lat},${lon});
|
node["amenity"](around:10,${lat},${lon});
|
||||||
);
|
);
|
||||||
out body;`;
|
out body;`;
|
||||||
|
|
||||||
console.log('li clicked', li)
|
console.log('result li clicked', result);
|
||||||
|
|
||||||
fetch('https://overpass-api.de/api/interpreter', {
|
fetch('https://overpass-api.de/api/interpreter', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
|
@ -533,14 +689,19 @@
|
||||||
})
|
})
|
||||||
.then(response => response.json())
|
.then(response => response.json())
|
||||||
.then(osmData => {
|
.then(osmData => {
|
||||||
console.log('osmData', osmData)
|
console.log('osmData', osmData);
|
||||||
if (osmData.elements.length > 0) {
|
if (osmData.elements.length > 0) {
|
||||||
console.log('osmData.elements', osmData.elements)
|
console.log('osmData.elements', osmData.elements);
|
||||||
|
|
||||||
const place = osmData.elements[1];
|
const place = osmData.elements[0];
|
||||||
console.log('place', place)
|
console.log('place ', place);
|
||||||
console.log(`https://www.openstreetmap.org/${place.type}/${place.id}`, place.tags);
|
console.log(`https://www.openstreetmap.org/${place.type}/${place.id}`, place.tags);
|
||||||
|
|
||||||
|
// Get INSEE code from result if available
|
||||||
|
let insee = null;
|
||||||
|
if (result.address && result.address.postcode) {
|
||||||
|
insee = result.address.postcode;
|
||||||
|
}
|
||||||
|
|
||||||
// Create a Demande with the business name
|
// Create a Demande with the business name
|
||||||
fetch('/api/demande/create', {
|
fetch('/api/demande/create', {
|
||||||
|
@ -549,8 +710,10 @@
|
||||||
'Content-Type': 'application/json',
|
'Content-Type': 'application/json',
|
||||||
},
|
},
|
||||||
body: JSON.stringify({
|
body: JSON.stringify({
|
||||||
businessName: `${query_input_user} __ ${place.tags.name}` || `${feature.properties.name}, ${feature.properties.city}`,
|
businessName: `${query_input_user} __ ${place.tags.name}` || displayText,
|
||||||
insee: feature.properties.citycode
|
insee: insee,
|
||||||
|
osmObjectType: place.type,
|
||||||
|
osmId: place.id
|
||||||
}),
|
}),
|
||||||
})
|
})
|
||||||
.then(response => response.json())
|
.then(response => response.json())
|
||||||
|
@ -609,6 +772,157 @@
|
||||||
|
|
||||||
ul.appendChild(li);
|
ul.appendChild(li);
|
||||||
});
|
});
|
||||||
|
} else {
|
||||||
|
// Process Addok results
|
||||||
|
// Show a message if there are no results
|
||||||
|
if (data.features.length === 0) {
|
||||||
|
const noResultsMessage = document.createElement('div');
|
||||||
|
noResultsMessage.classList.add('alert', 'alert-info', 'mt-3');
|
||||||
|
noResultsMessage.innerHTML = `
|
||||||
|
<i class="bi bi-info-circle"></i> Aucun résultat trouvé pour votre recherche.
|
||||||
|
`;
|
||||||
|
resultsList.appendChild(noResultsMessage);
|
||||||
|
} else {
|
||||||
|
// Initialize map if we have results
|
||||||
|
initMap();
|
||||||
|
resultsMap.style.display = 'block';
|
||||||
|
|
||||||
|
// Calculate bounds for the map
|
||||||
|
const bounds = new maplibregl.LngLatBounds();
|
||||||
|
|
||||||
|
// Add markers for each result
|
||||||
|
data.features.forEach((feature, index) => {
|
||||||
|
const [lon, lat] = feature.geometry.coordinates;
|
||||||
|
|
||||||
|
// Extend bounds
|
||||||
|
bounds.extend([lon, lat]);
|
||||||
|
|
||||||
|
// Create marker with result number
|
||||||
|
const marker = new maplibregl.Marker({color: '#007bff'})
|
||||||
|
.setLngLat([lon, lat])
|
||||||
|
.setPopup(new maplibregl.Popup().setHTML(`
|
||||||
|
<strong>${feature.properties.name}</strong><br>
|
||||||
|
${feature.properties.city || ''}
|
||||||
|
`));
|
||||||
|
|
||||||
|
// Add label with result number
|
||||||
|
const el = marker.getElement();
|
||||||
|
el.innerHTML = `<div style="position: absolute; top: -30px; left: 7px; background: white; border-radius: 50%; width: 20px; height: 20px; text-align: center; line-height: 20px; font-weight: bold; border: 2px solid #007bff;">${index + 1}</div>` + el.innerHTML;
|
||||||
|
|
||||||
|
marker.addTo(map);
|
||||||
|
markers.push(marker);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Fit map to bounds with padding
|
||||||
|
if (!bounds.isEmpty()) {
|
||||||
|
map.fitBounds(bounds, {padding: 50});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
data.features.forEach((feature, index) => {
|
||||||
|
const li = document.createElement('li');
|
||||||
|
li.classList.add('list-group-item', 'cursor-pointer');
|
||||||
|
li.innerHTML = `<span class="badge bg-primary me-2">${index + 1}</span> ${feature.properties.name}, ${feature.properties.city}`;
|
||||||
|
|
||||||
|
li.addEventListener('click', () => {
|
||||||
|
resultsList.innerHTML = ''; // Cacher la liste
|
||||||
|
resultsMap.style.display = 'none'; // Cacher la carte
|
||||||
|
clearMarkers(); // Supprimer les marqueurs
|
||||||
|
const [lon, lat] = feature.geometry.coordinates;
|
||||||
|
const query = `[out:json];
|
||||||
|
(
|
||||||
|
node["shop"](around:100,${lat},${lon});
|
||||||
|
node["amenity"](around:100,${lat},${lon});
|
||||||
|
);
|
||||||
|
out body;`;
|
||||||
|
|
||||||
|
console.log('li clicked', li)
|
||||||
|
|
||||||
|
fetch('https://overpass-api.de/api/interpreter', {
|
||||||
|
method: 'POST',
|
||||||
|
body: query
|
||||||
|
})
|
||||||
|
.then(response => response.json())
|
||||||
|
.then(osmData => {
|
||||||
|
console.log('osmData', osmData)
|
||||||
|
if (osmData.elements.length > 0) {
|
||||||
|
console.log('osmData.elements', osmData.elements)
|
||||||
|
|
||||||
|
const place = osmData.elements[1];
|
||||||
|
console.log('place', place)
|
||||||
|
console.log(`https://www.openstreetmap.org/${place.type}/${place.id}`, place.tags);
|
||||||
|
|
||||||
|
|
||||||
|
// Create a Demande with the business name
|
||||||
|
fetch('/api/demande/create', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
},
|
||||||
|
body: JSON.stringify({
|
||||||
|
businessName: `${query_input_user} __ ${place.tags.name}` || `${feature.properties.name}, ${feature.properties.city}`,
|
||||||
|
insee: feature.properties.citycode,
|
||||||
|
osmObjectType: place.type,
|
||||||
|
osmId: place.id
|
||||||
|
}),
|
||||||
|
})
|
||||||
|
.then(response => response.json())
|
||||||
|
.then(data => {
|
||||||
|
if (data.success) {
|
||||||
|
const demandeId = data.id;
|
||||||
|
|
||||||
|
if (place.tags && (place.tags['contact:email'] || place.tags['email'])) {
|
||||||
|
document.querySelector('#proposeLink').classList.remove('d-none');
|
||||||
|
document.querySelector('#proposeMail').classList.add('d-none');
|
||||||
|
} else {
|
||||||
|
document.querySelector('#proposeMail').classList.remove('d-none');
|
||||||
|
document.querySelector('#proposeLink').classList.add('d-none');
|
||||||
|
|
||||||
|
const emailForm = document.querySelector('#proposeMail form');
|
||||||
|
emailForm.addEventListener('submit', (e) => {
|
||||||
|
e.preventDefault();
|
||||||
|
const email = emailForm.querySelector('#emailInput').value;
|
||||||
|
|
||||||
|
// Update the Demande with the email
|
||||||
|
fetch(`/api/demande/${demandeId}/email`, {
|
||||||
|
method: 'POST',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
},
|
||||||
|
body: JSON.stringify({
|
||||||
|
email: email
|
||||||
|
}),
|
||||||
|
})
|
||||||
|
.then(response => response.json())
|
||||||
|
.then(data => {
|
||||||
|
if (data.success) {
|
||||||
|
// Redirect to the original route for backward compatibility
|
||||||
|
window.location.href = `/propose-email/${email}/${place.type}/${place.id}`;
|
||||||
|
} else {
|
||||||
|
alert('Erreur: ' + data.message);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
console.error('Error:', error);
|
||||||
|
alert('Une erreur est survenue lors de la mise à jour de la demande.');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
alert('Erreur: ' + data.message);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
console.error('Error:', error);
|
||||||
|
alert('Une erreur est survenue lors de la création de la demande.');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
ul.appendChild(li);
|
||||||
|
});
|
||||||
|
}
|
||||||
});
|
});
|
||||||
}, 500);
|
}, 500);
|
||||||
});
|
});
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue