florian.llimos/cartographie_bbe
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix: modify function name and update the code with the prod code

Browse Source
This commit is contained in:
florian.llimos 2025-02-19 12:33:23 +01:00
parent 9c9568430d
commit f4cadad915
3 changed files with 402 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
cartographie/css/style.css → cartographie/css/cartographie.css
View File

331
cartographie/function.php
View File

@ -1,26 +1,31 @@
<?php <?php
/** /**
* Cartographie Leaflet
* *
* @package Cartographie * @package Cartographie
* @author Digitanie * @author Digitanie
* @copyright 2024 Digitanie * @copyright 2024 Digitanie
* @license GPL-2.0-or-later
* *
* @wordpress-plugin * @wordpress-plugin
* Plugin Name: Cartographie * Plugin Name: Cartographie
* Plugin URI: https://digitanie.org
* Description: Plugin pour la cartographie. * Description: Plugin pour la cartographie.
* Version: 1.0.0 * Version: 1.0.0
* Author: Digitanie * Author: Digitanie
* Author URI: https://digitanie.org * Author URI: https://digitanie.org
* Text Domain: cartographie * Text Domain: cartographie
* License: GPL v2 or later
* License URI: http://www.gnu.org/licenses/gpl-2.0.txt
*/ */
add_shortcode('cartographie', 'display_hello_world_page'); add_shortcode('cartographie', 'cartographie');
function display_hello_world_page() { function cartographie() {
ob_start(); ob_start();
?> ?>
<div id="container-filter"> <div id="container-filter">
<div id="container-filter-avancement"> <div id="container-filter-avancement">
<div class="container-title-filter"> <div class="container-title-filter">
<h5 id="avancement-button">Status</h5> <h5 id="avancement-button">Status</h5>
@ -82,29 +87,29 @@ function display_hello_world_page() {
<p>Plateforme logistique</p> <p>Plateforme logistique</p>
</div> </div>
</div> </div>
<div id=""><p id="modal-title"></p></div>
</div> </div>
<div id='map' class='map-container'> <div id='map' class='map-container'>
<div id="full-screen"> <div id="full-screen">
<img src="https://cdn-icons-png.flaticon.com/128/3413/3413667.png"> <img src="/wp-content/plugins/cartographie/media/full-screen.png">
</div> </div>
<?php <?php
return ob_get_clean(); return ob_get_clean();
} }
add_action('wp_enqueue_scripts', 'hello_world_enqueue_assets'); add_action('wp_enqueue_scripts', 'preload');
function hello_world_enqueue_assets() {
function preload() {
if (has_shortcode(get_post()->post_content, 'cartographie')) { if (has_shortcode(get_post()->post_content, 'cartographie')) {
wp_enqueue_style( wp_enqueue_style(
'leaflet-css', 'leaflet-css',
'https://unpkg.com/leaflet@1.9.3/dist/leaflet.css', plugin_dir_url(__FILE__) . 'css/leaflet.css',
array(), array(),
'1.9.3' '1.9.3'
); );
wp_enqueue_script( wp_enqueue_script(
'leaflet-js', 'leaflet-js',
'https://unpkg.com/leaflet@1.9.3/dist/leaflet.js', plugin_dir_url(__FILE__) . 'js/leaflet.js',
array(), array(),
'1.9.3', '1.9.3',
true true
@ -112,28 +117,35 @@ function hello_world_enqueue_assets() {
wp_enqueue_style( wp_enqueue_style(
'leaflet-markercluster-css', 'leaflet-markercluster-css',
'https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.Default.css' plugin_dir_url(__FILE__) . 'css/MarkerCluster.Default.css',
array(),
'1.5.3'
); );
wp_enqueue_script( wp_enqueue_script(
'leaflet-markercluster-js', 'leaflet-markercluster-js',
'https://unpkg.com/leaflet.markercluster@1.5.3/dist/leaflet.markercluster.js', plugin_dir_url(__FILE__) . 'js/leaflet.markercluster.js',
array('leaflet-js', 'jquery'), array('leaflet-js', 'jquery'),
null, '1.5.3',
true true
); );
wp_enqueue_script( wp_enqueue_script(
'hello-world-script', 'cartographie-script',
plugin_dir_url(__FILE__) . 'js/main.js', plugin_dir_url(__FILE__) . 'js/main.js',
array('leaflet-js', 'leaflet-markercluster-js'), array('leaflet-js', 'leaflet-markercluster-js'),
'1.0', '1.0',
true true
); );
wp_localize_script( 'cartographie-script', 'wpApiSettings', array(
'root' => esc_url_raw( rest_url() ),
'nonce' => wp_create_nonce( 'wp_rest' )
) );
wp_enqueue_style( wp_enqueue_style(
'hello-world-style', 'cartographie-style',
plugin_dir_url(__FILE__) . 'css/style.css', plugin_dir_url(__FILE__) . 'css/cartographie.css',
array(), array(),
'1.0' '1.0'
); );
@ -141,16 +153,17 @@ function hello_world_enqueue_assets() {
} }
add_action('rest_api_init', function() { add_action('rest_api_init', function() {
register_rest_route('custom/v1', '/markers', array( register_rest_route('custom/v1', '/markers', array(
'methods' => 'GET', 'methods' => "GET",
'callback' => 'get_cartographie_markers', 'permission_callback' => '__return_true',
'callback' => 'get_cartographie_markers'
)); ));
}); });
function get_cartographie_markers() { function get_cartographie_markers() {
global $wpdb; global $wpdb;
$table_name = $wpdb->prefix . 'posts'; $table_name = $wpdb->prefix . 'posts';
$results = $wpdb->get_results(" $results = $wpdb->get_results("
SELECT wp_posts.ID, wp_posts.post_title, wp_term_taxonomy.taxonomy, SELECT wp_posts.ID, wp_posts.post_title, wp_term_taxonomy.taxonomy,
GROUP_CONCAT(wp_terms.term_id ORDER BY wp_terms.term_id) AS term_ids, GROUP_CONCAT(wp_terms.term_id ORDER BY wp_terms.term_id) AS term_ids,
@ -176,6 +189,7 @@ $image_results = $wpdb->get_results("
"); ");
$image_data = []; $image_data = [];
foreach ($image_results as $image_row) { foreach ($image_results as $image_row) {
$image_data[$image_row->ID] = [ $image_data[$image_row->ID] = [
'image_id' => $image_row->image_id, 'image_id' => $image_row->image_id,
@ -190,14 +204,12 @@ foreach ($results as $row) {
]; ];
} }
// Ajouter les termes (taxonomies)
if ($row->taxonomy == "categorielabel") { if ($row->taxonomy == "categorielabel") {
$structured_data[$row->ID][$row->taxonomy] = explode(",", $row->term_names); $structured_data[$row->ID][$row->taxonomy] = explode(",", $row->term_names);
} else { } else {
$structured_data[$row->ID][$row->taxonomy] = $row->term_names; $structured_data[$row->ID][$row->taxonomy] = $row->term_names;
} }
// Ajouter l'image mise en avant si elle existe
if (isset($image_data[$row->ID])) { if (isset($image_data[$row->ID])) {
$structured_data[$row->ID]['image'] = $image_data[$row->ID]; $structured_data[$row->ID]['image'] = $image_data[$row->ID];
} }
@ -205,5 +217,282 @@ foreach ($results as $row) {
return $structured_data; return $structured_data;
}
function wpm_custom_post_type() {
$labels = array(
'name' => _x( 'Cartographie', 'Post Type General Name'),
'singular_name' => _x( 'Cartographie', 'Post Type Singular Name'),
'menu_name' => __( 'Cartographie'),
'all_items' => __( 'Tous les marqueurs'),
'view_item' => __( 'Voir les marqueurs'),
'add_new_item' => __( 'Ajouter un nouveau marqueur'),
'add_new' => __( 'Ajouter'),
'edit_item' => __( 'Editer le marqueur'),
'update_item' => __( 'Modifier le marqueur'),
'search_items' => __( 'Rechercher un marqueur'),
'not_found' => __( 'Non trouvée'),
'not_found_in_trash' => __( 'Non trouvée dans la corbeille'),
);
$args = array(
'label' => __( 'Cartographie'),
'description' => __( 'Tous sur les markers de la cartographie'),
'labels' => $labels,
'menu_icon' => 'dashicons-video-alt2',
'supports' => array( 'title', 'editor', 'excerpt', 'author', 'thumbnail', 'comments', 'revisions', 'custom-fields', ),
'show_in_rest' => true,
'rest_base' => 'markers',
'rest_controller_class' => 'WP_REST_Posts_Controller',
'hierarchical' => false,
'public' => true,
'has_archive' => true,
'rewrite' => array( 'slug' => 'cartographie'),
);
register_post_type( 'markercartographie', $args );
}
add_action( 'init', 'wpm_custom_post_type', 0 );
add_action( 'init', 'wpm_add_taxonomies', 0 );
function wpm_add_taxonomies() {
$labels_annee = array(
'name' => _x( 'Année', 'taxonomy general name'),
'singular_name' => _x( 'Année', 'taxonomy singular name'),
'search_items' => __( 'Chercher une année'),
'all_items' => __( 'Toutes les années'),
'edit_item' => __( "Editer l'année"),
'update_item' => __( "Mettre à jour l'année"),
'add_new_item' => __( 'Ajouter une nouvelle année'),
'new_item_name' => __( 'Valeur de la nouvelle année'),
'separate_items_with_commas' => __( 'Séparer les réalisateurs avec une virgule'),
'menu_name' => __( 'Année'),
);
$labels_latitude = array(
'name' => _x( 'Latitude', 'taxonomy general name'),
'singular_name' => _x( 'Latitude', 'taxonomy singular name'),
'search_items' => __( 'Chercher une latitude'),
'all_items' => __( 'Toutes les latitudes'),
'edit_item' => __( 'Editer la latitude'),
'update_item' => __( 'Mettre à jour la latitude'),
'add_new_item' => __( 'Ajouter une nouvelle latitude'),
'new_item_name' => __( 'Valeur de la nouvelle latitude'),
'separate_items_with_commas' => __( 'Séparer les réalisateurs avec une virgule'),
'menu_name' => __( 'Latitude'),
);
$labels_longitude = array(
'name' => _x( 'Longitude', 'taxonomy general name'),
'singular_name' => _x( 'Longitude', 'taxonomy singular name'),
'search_items' => __( 'Chercher une longitude'),
'all_items' => __( 'Toutes les longitude'),
'edit_item' => __( 'Editer la longitude'),
'update_item' => __( 'Mettre à jour la longitude'),
'add_new_item' => __( 'Ajouter une nouvelle longitude'),
'new_item_name' => __( 'Valeur de la nouvelle longitude'),
'separate_items_with_commas' => __( 'Séparer les réalisateurs avec une virgule'),
'menu_name' => __( 'Longitude'),
);
$labels_codepstl = array(
'name' => _x( 'Code postal', 'taxonomy general name'),
'singular_name' => _x( 'Code postal', 'taxonomy singular name'),
'search_items' => __( 'Chercher une longitude'),
'all_items' => __( 'Tous les codes postaux'),
'edit_item' => __( 'Editer le code postal'),
'update_item' => __( 'Mettre à jour le code postal'),
'add_new_item' => __( 'Ajouter un nouveau code postal'),
'new_item_name' => __( 'Valeur du nouveau code postal'),
'separate_items_with_commas' => __( 'Séparer les réalisateurs avec une virgule'),
'menu_name' => __( 'Code postal'),
);
$labels_ville = array(
'name' => _x( 'Ville', 'taxonomy general name'),
'singular_name' => _x( 'Ville', 'taxonomy singular name'),
'search_items' => __( 'Chercher une ville'),
'all_items' => __( 'Toutes les villes'),
'edit_item' => __( 'Editer la ville'),
'update_item' => __( 'Mettre à jour la ville'),
'add_new_item' => __( 'Ajouter une nouvelle ville'),
'new_item_name' => __( 'Valeur de la nouvelle ville'),
'separate_items_with_commas' => __( 'Séparer les réalisateurs avec une virgule'),
'menu_name' => __( 'Ville'),
);
$labels_cat_serie = array(
'name' => _x( "Domaine d'activité", 'taxonomy general name'),
'singular_name' => _x( "Domaine d'activité", 'taxonomy singular name'),
'search_items' => __( "Rechercher un domaine d'activité"),
'all_items' => __( "Tous les domaines d'activités"),
'edit_item' => __( "Editer un domaine d'activité"),
'update_item' => __( "Mettre à jour un domaine d'activité"),
'add_new_item' => __( "Ajouter un nouveau domaine d'activité"),
'new_item_name' => __( "Nom du nouveau domaine d'activité"),
'add_or_remove_items' => __( "Ajouter ou supprimer un domaine d'activité"),
'choose_from_most_used' => __( "Choisir parmi les domaines d'activité les plus utilisées"),
'not_found' => __( "Pas de domaine d'activité trouvées"),
'menu_name' => __( "Domaine d'activité"),
);
$labels_label_serie = array(
'name' => _x( 'Label', 'taxonomy general name'),
'singular_name' => _x( 'Label', 'taxonomy singular name'),
'search_items' => __( 'Rechercher un label'),
'popular_items' => __( 'Labels populaires'),
'all_items' => __( 'Tous les labels'),
'edit_item' => __( 'Editer un label'),
'update_item' => __( 'Mettre à jour un label'),
'add_new_item' => __( 'Ajouter un nouveau label'),
'new_item_name' => __( 'Nom du nouveau label'),
'add_or_remove_items' => __( 'Ajouter ou supprimer un label'),
'choose_from_most_used' => __( 'Choisir parmi les labels les plus utilisées'),
'not_found' => __( 'Pas de label trouvées'),
'menu_name' => __( 'Label'),
);
$labels_avancement_serie = array(
'name' => _x( 'Avancement du projet', 'taxonomy general name'),
'singular_name' => _x( 'Avancement du projet', 'taxonomy singular name'),
'search_items' => __( 'Rechercher un avancement de projet'),
'popular_items' => __( 'Avancement de projet populaires'),
'all_items' => __( 'Tous les avancement de projet'),
'edit_item' => __( 'Editer un avancement de projet'),
'update_item' => __( 'Mettre à jour un avancement de projet'),
'add_new_item' => __( 'Ajouter un nouvel avancement de projet'),
'new_item_name' => __( 'Nom du nouveau avancement de projet'),
'add_or_remove_items' => __( 'Ajouter ou supprimer un avancement de projet'),
'choose_from_most_used' => __( 'Choisir parmi les avancement de projet les plus utilisées'),
'not_found' => __( "Pas d'avancemenet de projet trouvées"),
'menu_name' => __( 'Avancement du projet'),
);
$labels_associe = array(
'name' => _x( 'Associé BBE', 'taxonomy general name'),
'singular_name' => _x( 'Associé BBE', 'taxonomy singular name'),
'search_items' => __( 'Chercher une association'),
'all_items' => __( 'Toutes les associations'),
'edit_item' => __( "Editer l'association"),
'update_item' => __( 'Mettre à jour l année'),
'add_new_item' => __( 'Ajouter une nouvelle association'),
'new_item_name' => __( 'Valeur de la nouvelle association'),
'separate_items_with_commas' => __( 'Séparer les réalisateurs avec une virgule'),
'menu_name' => __( 'Associé-e BBE'),
);
$args_cat_serie = array(
'hierarchical' => true,
'labels' => $labels_cat_serie,
'show_ui' => true,
'show_in_rest' => true,
'show_admin_column' => true,
'query_var' => true,
'public' => true,
'rewrite' => array( 'slug' => 'categories-series' ),
);
$args_label_serie = array(
'hierarchical' => true,
'labels' => $labels_label_serie,
'show_ui' => true,
'show_in_rest' => true,
'show_admin_column' => true,
'query_var' => true,
'public' => true,
'rewrite' => array( 'slug' => 'categories-label' ),
);
$args_avancement_serie = array(
'hierarchical' => true,
'labels' => $labels_avancement_serie,
'show_ui' => true,
'show_in_rest' => true,
'show_admin_column' => true,
'query_var' => true,
'public' => true,
'rewrite' => array( 'slug' => 'categories-avancement' ),
);
$args_associe = array(
'hierarchical' => false,
'labels' => $labels_associe,
'show_ui' => true,
'show_in_rest' => true,
'show_admin_column' => true,
'query_var' => true,
'public' => true,
'rewrite' => array( 'slug' => 'associe' ),
);
$args_ville = array(
'hierarchical' => false,
'labels' => $labels_ville,
'show_ui' => true,
'show_in_rest' => true,
'show_admin_column' => true,
'query_var' => true,
'public' => true,
'rewrite' => array( 'slug' => 'ville' ),
);
$args_codepstl = array(
'hierarchical' => false,
'labels' => $labels_codepstl,
'show_ui' => true,
'show_in_rest' => true,
'show_admin_column' => true,
'query_var' => true,
'public' => true,
'rewrite' => array( 'slug' => 'codepstl' ),
);
$args_latitude = array(
'hierarchical' => false,
'labels' => $labels_latitude,
'show_ui' => true,
'show_in_rest' => true,
'show_admin_column' => true,
'query_var' => true,
'public' => true,
'rewrite' => array( 'slug' => 'latitude' ),
);
$args_annee = array(
'hierarchical' => false,
'labels' => $labels_annee,
'show_ui' => true,
'show_in_rest' => true,
'show_admin_column' => true,
'query_var' => true,
'public' => true,
'rewrite' => array( 'slug' => 'annees' ),
);
$args_longitude = array(
'hierarchical' => false,
'labels' => $labels_longitude,
'show_ui' => true,
'show_in_rest' => true,
'show_admin_column' => true,
'query_var' => true,
'public' => true,
'rewrite' => array( 'slug' => 'longitude' ),
);
register_taxonomy( 'associe', 'markercartographie', $args_associe );
register_taxonomy( 'categoriesseries', 'markercartographie', $args_cat_serie );
register_taxonomy( 'avancementduprojet', 'markercartographie', $args_avancement_serie );
register_taxonomy( 'categoriesseries', 'markercartographie', $args_cat_serie );
register_taxonomy( 'categorielabel', 'markercartographie', $args_label_serie );
register_taxonomy( 'categorielabel', 'markercartographie', $args_label_serie );
register_taxonomy( 'ville', 'markercartographie', $args_ville );
register_taxonomy( 'annees', 'markercartographie', $args_annee );
register_taxonomy( 'codepstl', 'markercartographie', $args_codepstl );
register_taxonomy( 'longitude', 'markercartographie', $args_longitude );
register_taxonomy( 'latitude', 'markercartographie', $args_latitude );
} }

158
cartographie/js/main.js
View File

@ -1,11 +1,12 @@
jQuery(document).ready(function($) { jQuery(document).ready(function($) {
var map = L.map('map', { var map = L.map('map', {
center: [48.577742, 0.060471], center: [48.577742, 0.060471],
zoom: 8, zoom: 8,
maxZoom: 18, maxZoom: 18,
minZoom: 8 minZoom: 8
}); });
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map); }).addTo(map);
@ -21,15 +22,16 @@ jQuery(document).ready(function($) {
}); });
} }
}); });
let allMarkers = []; let allMarkers = [];
function addMarkers(data) { function addMarkers(data) {
markersCluster.clearLayers(); markersCluster.clearLayers();
allMarkers = []; allMarkers = [];
const values = Object.values(data); const values = Object.values(data);
for (const item of values) { for (const item of values) {
let itemNom = item.name; let itemNom = item.name;
var itemDomaine = item.categoriesseries ?? null; var itemDomaine = item.categoriesseries ?? null;
let itemCodePostal = item.codepstl ?? null; let itemCodePostal = item.codepstl ?? null;
@ -41,16 +43,15 @@ jQuery(document).ready(function($) {
let itemAssocie = item.associe ?? null; let itemAssocie = item.associe ?? null;
let itemLabel = item.categorielabel ?? null; let itemLabel = item.categorielabel ?? null;
let itemPhoto = item.image.image_url ?? null; let itemPhoto = item.image.image_url ?? null;
if (itemLongitude === null || itemLatitude === null) { if (itemLongitude === null || itemLatitude === null) {
continue; continue;
} }
const iconBaseUrl = '/wp-content/plugins/cartographie/media/'; const iconBaseUrl = '/wp-content/plugins/cartographie/media/';
const iconSize = [50, 50]; const iconSize = [50, 50];
const iconAnchor = [16, 32]; const iconAnchor = [16, 32];
const popupAnchor = [0, -32]; const popupAnchor = [0, -32];
const domaineIcons = { const domaineIcons = {
"Lieux de plantation": "lieux_de_plantation.svg", "Lieux de plantation": "lieux_de_plantation.svg",
"Producteur de bois": "producteur_de_bois.svg", "Producteur de bois": "producteur_de_bois.svg",
@ -58,7 +59,7 @@ jQuery(document).ready(function($) {
"Acheteur de chaleur": "chaufferie_vente_chaleur.svg", "Acheteur de chaleur": "chaufferie_vente_chaleur.svg",
"Plateforme logistique": "plateformes_logistiques.svg" "Plateforme logistique": "plateformes_logistiques.svg"
}; };
let iconUrl = domaineIcons[itemDomaine] ? `${iconBaseUrl}${domaineIcons[itemDomaine]}` : null; let iconUrl = domaineIcons[itemDomaine] ? `${iconBaseUrl}${domaineIcons[itemDomaine]}` : null;
let defaultIcon = iconUrl let defaultIcon = iconUrl
? new L.Icon({ ? new L.Icon({
@ -68,9 +69,8 @@ jQuery(document).ready(function($) {
popupAnchor popupAnchor
}) })
: new L.Icon.Default(); : new L.Icon.Default();
let imageUrls = []; let imageUrls = [];
if (Array.isArray(itemLabel)) { if (Array.isArray(itemLabel)) {
if (itemLabel.includes("Label haie") && itemLabel.includes("Label végétal local")) { if (itemLabel.includes("Label haie") && itemLabel.includes("Label végétal local")) {
imageUrls.push('/wp-content/plugins/cartographie/media/logo.png'); imageUrls.push('/wp-content/plugins/cartographie/media/logo.png');
@ -81,7 +81,7 @@ jQuery(document).ready(function($) {
imageUrls.push('/wp-content/plugins/cartographie/media/logo.png'); imageUrls.push('/wp-content/plugins/cartographie/media/logo.png');
} }
} }
let popupContent = ` let popupContent = `
<div class='modal-container ${itemDomaine === "Lieux de plantation" ? "modal-border-green" : ""} ${itemDomaine === "Acheteur de chaleur" ? "modal-border-yellow" : ""} ${itemDomaine === "Producteur de bois" ? "modal-border-black" : ""} ${itemDomaine === "Plateforme logistique" ? "modal-border-blue" : ""} ${itemDomaine === "Acheteur de bois" ? "modal-border-red" : ""}'> <div class='modal-container ${itemDomaine === "Lieux de plantation" ? "modal-border-green" : ""} ${itemDomaine === "Acheteur de chaleur" ? "modal-border-yellow" : ""} ${itemDomaine === "Producteur de bois" ? "modal-border-black" : ""} ${itemDomaine === "Plateforme logistique" ? "modal-border-blue" : ""} ${itemDomaine === "Acheteur de bois" ? "modal-border-red" : ""}'>
<div class="modal-container-header"> <div class="modal-container-header">
@ -101,20 +101,20 @@ jQuery(document).ready(function($) {
</div> </div>
</div> </div>
`; `;
let marker = L.marker([itemLatitude, itemLongitude], { icon: defaultIcon }) let marker = L.marker([itemLatitude, itemLongitude], { icon: defaultIcon })
.bindPopup(popupContent, { .bindPopup(popupContent, {
autoPan: true, // Active le recadrage automatique autoPan: true, // Active le recadrage automatique
autoPanPadding: [200, 30], // Définit le padding autour du popup autoPanPadding: [200, 30], // Définit le padding autour du popup
keepInView: true // Assure que le popup reste visible à l'écran keepInView: true // Assure que le popup reste visible à l'écran
}); });
// Ajout du comportement dynamique lors de l'ouverture de la popup // Ajout du comportement dynamique lors de l'ouverture de la popup
marker.on('popupopen', function (e) { marker.on('popupopen', function (e) {
const popup = e.popup; const popup = e.popup;
const mapBounds = map.getBounds(); const mapBounds = map.getBounds();
const popupPosition = popup.getLatLng(); const popupPosition = popup.getLatLng();
// Ajuste les marges dynamiques // Ajuste les marges dynamiques
const autoPanPadding = { const autoPanPadding = {
top: 100, // 100px depuis le haut top: 100, // 100px depuis le haut
@ -122,7 +122,6 @@ jQuery(document).ready(function($) {
left: 200, // 50px à gauche left: 200, // 50px à gauche
right: 200 // 50px à droite right: 200 // 50px à droite
}; };
// Vérifie si le popup est hors de la vue et recadre la carte // Vérifie si le popup est hors de la vue et recadre la carte
if (!mapBounds.contains(popupPosition)) { if (!mapBounds.contains(popupPosition)) {
map.panTo(popupPosition, { map.panTo(popupPosition, {
@ -131,45 +130,64 @@ jQuery(document).ready(function($) {
}); });
} }
}); });
marker.bindPopup(popupContent, {
autoPan: false, // Désactive le recadrage automatique pour éviter un conflit
keepInView: true, // Assure que la popup reste visible
offset: L.point(0, -20) // Décale légèrement la popup au-dessus du marqueur
});
// Écoute l'événement `popupopen`
marker.on('popupopen', function (e) {
const map = e.target._map; // Récupère la carte
const popupLatLng = e.popup.getLatLng(); // Position du popup (marqueur)
const popupOffset = e.popup.options.offset; // Décalage défini dans les options
// Calcul du décalage supplémentaire (margin-left de 50px)
const additionalOffset = -170; // Décalage en pixels (pour le margin-left)
// Convertir le décalage en coordonnées de la carte
const projectedPoint = map.project(popupLatLng).subtract(popupOffset).subtract([additionalOffset, 0]);
const newCenter = map.unproject(projectedPoint);
// Centre la carte sur la position ajustée
map.setView(newCenter, map.getZoom(), {
animate: true // Animation fluide
});
});
// Gestion de l'icône active lors de l'ouverture et de la fermeture de la popup // Gestion de l'icône active lors de l'ouverture et de la fermeture de la popup
marker.on('popupopen', function () { marker.on('popupopen', function () {
marker.setIcon(activeMarkerIcon); marker.setIcon(activeMarkerIcon);
}); });
marker.on('popupclose', function () { marker.on('popupclose', function () {
marker.setIcon(defaultIcon); marker.setIcon(defaultIcon);
}); });
// Ajout du marqueur au cluster // Ajout du marqueur au cluster
allMarkers.push(marker); allMarkers.push(marker);
markersCluster.addLayer(marker); markersCluster.addLayer(marker);
let activeIconUrl = '';
let activeIconUrl = ''; if (itemDomaine === "Lieux de plantation") {
if (itemDomaine === "Lieux de plantation") { activeIconUrl = '/wp-content/plugins/cartographie/media/lieux_de_plantation_actif.svg';
activeIconUrl = '/wp-content/plugins/cartographie/media/lieux_de_plantation_actif.svg'; } else if (itemDomaine === "Producteur de bois"){
} else if (itemDomaine === "Producteur de bois"){ activeIconUrl = '/wp-content/plugins/cartographie/media/producteur_de_bois_actif.svg';
activeIconUrl = '/wp-content/plugins/cartographie/media/producteur_de_bois_actif.svg'; } else if (itemDomaine === "Acheteur de bois"){
} else if (itemDomaine === "Acheteur de bois"){ activeIconUrl = '/wp-content/plugins/cartographie/media/chaufferie_bois_clients_actif.svg';
activeIconUrl = '/wp-content/plugins/cartographie/media/chaufferie_bois_clients_actif.svg'; } else if (itemDomaine === "Acheteur de chaleur"){
} else if (itemDomaine === "Acheteur de chaleur"){ activeIconUrl = '/wp-content/plugins/cartographie/media/chaufferie_vente_chaleur_actif.svg';
activeIconUrl = '/wp-content/plugins/cartographie/media/chaufferie_vente_chaleur_actif.svg'; } else if (itemDomaine === "Plateforme logistique"){
} else if (itemDomaine === "Plateforme logistique"){ activeIconUrl = '/wp-content/plugins/cartographie/media/plateformes_logistiques_actif.svg';
activeIconUrl = '/wp-content/plugins/cartographie/media/plateformes_logistiques_actif.svg';
}
let activeMarkerIcon = new L.Icon({
iconUrl: activeIconUrl,
iconSize: [50, 50],
iconAnchor: [16, 32],
popupAnchor: [0, -32]
});
allMarkers.push(marker);
markersCluster.addLayer(marker);
} }
let activeMarkerIcon = new L.Icon({
iconUrl: activeIconUrl,
iconSize: [50, 50],
iconAnchor: [16, 32],
popupAnchor: [0, -32]
});
allMarkers.push(marker);
markersCluster.addLayer(marker);
}
map.addLayer(markersCluster); map.addLayer(markersCluster);
} }
@ -179,27 +197,28 @@ jQuery(document).ready(function($) {
function mapFullScreen() { function mapFullScreen() {
if (!theMap.classList.contains("map-full-screen")) { if (!theMap.classList.contains("map-full-screen")) {
theMap.classList.add("map-full-screen"); theMap.classList.add("map-full-screen");
document.querySelector("#full-screen > img").src = "https://cdn-icons-png.flaticon.com/128/1828/1828778.png"; document.querySelector("#full-screen > img").src = "/wp-content/plugins/cartographie/media/close.png";
document.querySelector("#full-screen > img").style.padding = "15px"; document.querySelector("#full-screen > img").style.padding = "15px";
// Redimensionner la carte Leaflet après être passé en plein écran // Redimensionner la carte Leaflet après être passé en plein écran
map.invalidateSize(); // Demande à Leaflet de recalculer la taille de la carte map.invalidateSize(); // Demande à Leaflet de recalculer la taille de la carte
} else if (theMap.classList.contains("map-full-screen")) { } else if (theMap.classList.contains("map-full-screen")) {
theMap.classList.remove("map-full-screen"); theMap.classList.remove("map-full-screen");
document.querySelector("#full-screen > img").src = "https://cdn-icons-png.flaticon.com/128/3413/3413667.png"; document.querySelector("#full-screen > img").src = "/wp-content/plugins/cartographie/media/full-screen.png";
document.querySelector("#full-screen > img").style.padding = "10px"; document.querySelector("#full-screen > img").style.padding = "10px";
// Redimensionner la carte Leaflet après avoir quitté le plein écran // Redimensionner la carte Leaflet après avoir quitté le plein écran
map.invalidateSize(); map.invalidateSize();
} }
} }
btnFullScreen.addEventListener("click", mapFullScreen); btnFullScreen.addEventListener("click", mapFullScreen);
let api_root = window.location.origin + '?rest_route=/';
$.ajax({ $.ajax({
url: '/wp-json/custom/v1/markers', url: api_root + "custom/v1/markers",
method: 'GET', method: "GET",
dataType: 'json', timeout: 0,
headers: {
"Authorization": "Basic ZGlnaXRhbmllOmlOdVkgZkJyVyBRelRDIDVGaTcgVTVzOCBEU2ZZ"
},
success: function(data) { success: function(data) {
initialMarkerData = data; initialMarkerData = data;
addMarkers(data); addMarkers(data);
@ -209,21 +228,21 @@ jQuery(document).ready(function($) {
} }
}); });
function filterMarkers() { function filterMarkers() {
var statusFilters = { var statusFilters = {
'En cours': $('#en-cours').hasClass('filter-active'), 'En cours': $('#en-cours').hasClass('filter-active'),
'Terminé': $('#projets-finis').hasClass('filter-active'), 'Terminé': $('#projets-finis').hasClass('filter-active'),
'Prévu': $('#prevu').hasClass('filter-active'), 'Prévu': $('#prevu').hasClass('filter-active'),
}; };
var associeFilterActive = $('#toggle-associe').hasClass('filter-active'); var associeFilterActive = $('#toggle-associe').hasClass('filter-active');
var labelFilters = { var labelFilters = {
'aucun': $('#label-aucun').hasClass('filter-active'), 'aucun': $('#label-aucun').hasClass('filter-active'),
'haie': $('#label-haie').hasClass('filter-active'), 'haie': $('#label-haie').hasClass('filter-active'),
'vegetal': $('#label-vegetal').hasClass('filter-active'), 'vegetal': $('#label-vegetal').hasClass('filter-active'),
}; };
var domaineFilters = { var domaineFilters = {
'Lieux de plantation': $('#lieux-de-plantation').hasClass('filter-active'), 'Lieux de plantation': $('#lieux-de-plantation').hasClass('filter-active'),
'Acheteur de bois': $('#chaufferies-bois-clients').hasClass('filter-active'), 'Acheteur de bois': $('#chaufferies-bois-clients').hasClass('filter-active'),
@ -231,47 +250,58 @@ jQuery(document).ready(function($) {
'Acheteur de chaleur': $('#chaufferies-vente-de-chaleur').hasClass('filter-active'), 'Acheteur de chaleur': $('#chaufferies-vente-de-chaleur').hasClass('filter-active'),
'Plateforme logistique': $('#plateformes-logistiques').hasClass('filter-active'), 'Plateforme logistique': $('#plateformes-logistiques').hasClass('filter-active'),
}; };
var filteredMarkers = allMarkers.filter(function(marker) { var filteredMarkers = allMarkers.filter(function(marker) {
let popupContent = marker.getPopup().getContent(); let popupContent = marker.getPopup().getContent();
let matchesStatusFilter = Object.keys(statusFilters).some(function(key) { let matchesStatusFilter = Object.keys(statusFilters).some(function(key) {
return statusFilters[key] ? popupContent.includes(key) : false; return statusFilters[key] ? popupContent.includes(key) : false;
}) || !Object.values(statusFilters).includes(true); }) || !Object.values(statusFilters).includes(true);
let matchesAssocieFilter = associeFilterActive ? popupContent.includes('Associé-e BBE') : true; let matchesAssocieFilter = associeFilterActive ? popupContent.includes('Associé-e BBE') : true;
let matchesLabelFilter = labelFilters['haie'] && labelFilters['vegetal'] let matchesLabelFilter = labelFilters['haie'] && labelFilters['vegetal']
? (popupContent.includes('Label haie') || popupContent.includes('végétal local')) ? (popupContent.includes('Label haie') || popupContent.includes('végétal local'))
: (labelFilters['haie'] ? popupContent.includes('Label haie') : (labelFilters['haie'] ? popupContent.includes('Label haie')
: (labelFilters['vegetal'] ? popupContent.includes('végétal local') : (labelFilters['vegetal'] ? popupContent.includes('végétal local')
: labelFilters['aucun'] ? popupContent.includes('Aucun') : true)); : labelFilters['aucun'] ? popupContent.includes('Aucun') : true));
let matchesDomaineFilter = Object.keys(domaineFilters).some(function(key) { let matchesDomaineFilter = Object.keys(domaineFilters).some(function(key) {
return domaineFilters[key] ? popupContent.includes(key) : false; return domaineFilters[key] ? popupContent.includes(key) : false;
}) || !Object.values(domaineFilters).includes(true); }) || !Object.values(domaineFilters).includes(true);
return matchesStatusFilter && matchesAssocieFilter && matchesLabelFilter && matchesDomaineFilter; return matchesStatusFilter && matchesAssocieFilter && matchesLabelFilter && matchesDomaineFilter;
}); });
markersCluster.clearLayers(); markersCluster.clearLayers();
markersCluster.addLayers(filteredMarkers); markersCluster.addLayers(filteredMarkers);
} }
function handleFilterClick(filterId, otherFilterIds) { function handleFilterClick(filterId, otherFilterIds) {
$(filterId).on('click', function() { $(filterId).on('click', function() {
$(this).toggleClass('filter-active'); $(this).toggleClass('filter-active');
if ($(this).hasClass('wait-button')) { if ($(this).hasClass('wait-button')) {
$(this).toggleClass('button-active'); $(this).toggleClass('button-active');
} }
if ($(this).hasClass('filter-active') && otherFilterIds && Array.isArray(otherFilterIds)) { if ($(this).hasClass('filter-active') && otherFilterIds && Array.isArray(otherFilterIds)) {
otherFilterIds.forEach(function(otherFilterId) { otherFilterIds.forEach(function(otherFilterId) {
$(otherFilterId).removeClass('filter-active button-active'); $(otherFilterId).removeClass('filter-active button-active');
}); });
} }
filterMarkers(); filterMarkers();
}); });
} }
@ -280,7 +310,6 @@ jQuery(document).ready(function($) {
$(toggleId).on('click', function() { $(toggleId).on('click', function() {
const parentElement = document.querySelector(toggleId); const parentElement = document.querySelector(toggleId);
const childElement = document.querySelector(`${toggleId} > div`); const childElement = document.querySelector(`${toggleId} > div`);
if ($(this).toggleClass('filter-active').hasClass('filter-active')) { if ($(this).toggleClass('filter-active').hasClass('filter-active')) {
parentElement.classList.remove("toggle-to-anim-parent-reverse"); parentElement.classList.remove("toggle-to-anim-parent-reverse");
childElement.classList.remove("toggle-to-anim-enfant-reverse"); childElement.classList.remove("toggle-to-anim-enfant-reverse");
@ -292,7 +321,6 @@ jQuery(document).ready(function($) {
parentElement.classList.add("toggle-to-anim-parent-reverse"); parentElement.classList.add("toggle-to-anim-parent-reverse");
childElement.classList.add("toggle-to-anim-enfant-reverse"); childElement.classList.add("toggle-to-anim-enfant-reverse");
} }
filterMarkers(); filterMarkers();
}); });
} }
@ -301,10 +329,8 @@ jQuery(document).ready(function($) {
handleFilterClick('#prevu', ['#en-cours', '#projets-finis']); handleFilterClick('#prevu', ['#en-cours', '#projets-finis']);
handleFilterClick('#projets-finis', ['#en-cours', '#prevu']); handleFilterClick('#projets-finis', ['#en-cours', '#prevu']);
handleToggleClick('#toggle-associe'); handleToggleClick('#toggle-associe');
handleFilterClick('#label-haie', ['#label-aucun']); handleFilterClick('#label-haie', ['#label-aucun']);
handleFilterClick('#label-vegetal', ['#label-aucun']); handleFilterClick('#label-vegetal', ['#label-aucun']);
handleFilterClick('#lieux-de-plantation', false); handleFilterClick('#lieux-de-plantation', false);
handleFilterClick('#chaufferies-bois-clients', false); handleFilterClick('#chaufferies-bois-clients', false);
handleFilterClick('#exploitations-productrices-de-bois-pour-BBE', false); handleFilterClick('#exploitations-productrices-de-bois-pour-BBE', false);
@ -312,11 +338,11 @@ jQuery(document).ready(function($) {
handleFilterClick('#plateformes-logistiques', false); handleFilterClick('#plateformes-logistiques', false);
map.scrollWheelZoom.disable(); map.scrollWheelZoom.disable();
map.on('click', () => { map.on('click', () => {
map.scrollWheelZoom.enable(); map.scrollWheelZoom.enable();
}); });
map.on('mouseout', () => { map.on('mouseout', () => {
map.scrollWheelZoom.disable(); map.scrollWheelZoom.disable();
}); });
}); });