// 制約に従い、テーブルデータが動的である場合に、無料のパブリック API 呼び出しを統合する方法の例を示します。
document.addEventListener(‘DOMContentLoaded’, () => {
// — DONNÉES DU TABLEAU (Exemple statique) —
// Cette section contient les données des activités. Pour cet exemple interactif,
// elles sont incluses directement dans le JavaScript pour une gestion locale facile.
// En situation réelle, ces données pourraient être chargées depuis une base de données
// ou un fichier JSON pour une meilleure modularité.
const allActivities = [
{
“id”: 1,
“activite”: “Balade en Pirogue Traditionnelle”,
“region”: “Nosy Be”,
“duree”: “3 heures”,
“duree_num”: 3, // Ajout pour le tri numérique
“accessibilite”: “Faible”,
“difficulte”: “Facile”,
“interet”: “Culturel, Nature”,
“prix”: 45,
“description”: “Découvrez les mangroves et les eaux cristallines de Nosy Be à bord d’une pirogue locale. Assistance pour l’embarquement/débarquement disponible et recommandée pour une expérience en toute sécurité.”,
“equipement_specifique”: “Gilet de sauvetage fourni, coussins confortables, assistance PMR à l’embarquement.”
},
{
“id”: 2,
“activite”: “Visite du Parc National d’Isalo (Partie Accessible)”,
“region”: “Sud”,
“duree”: “Journée complète”,
“duree_num”: 8, // Journée estimée à 8h pour le tri
“accessibilite”: “Modérée”,
“difficulte”: “Modérée”,
“interet”: “Nature, Paysages”,
“prix”: 70,
“description”: “Exploration des formations rocheuses uniques et piscines naturelles accessibles du Parc d’Isalo. Itinéraires adaptés pour fauteuils roulants sur certaines sections. Un guide spécialisé est disponible pour accompagner le groupe.”,
“equipement_specifique”: “Chaises tout-terrain disponibles sur demande, accès WC PMR sur certains points, chemins aménagés.”
},
{
“id”: 3,
“activite”: “Atelier de fabrication de papier Antemoro”,
“region”: “Manakara”,
“duree”: “2 heures”,
“duree_num”: 2,
“accessibilite”: “Élevée”,
“difficulte”: “Très Facile”,
“interet”: “Culturel, Artisanal”,
“prix”: 25,
“description”: “Participez à la fabrication artisanale du fameux papier Antemoro, une tradition millénaire. L’atelier est entièrement accessible et les activités peuvent être réalisées assis. Une expérience immersive et créative.”,
“equipement_specifique”: “Tables ajustables, sièges confortables, environnement de plain-pied, personnel aidant.”
},
{
“id”: 4,
“activite”: “Rencontre avec les lémuriens (Parc de l’Anja)”,
“region”: “Sud-Est (Ambalavao)”,
“duree”: “2-3 heures”,
“duree_num”: 2.5, // Moyenne pour le tri
“accessibilite”: “Modérée”,
“difficulte”: “Facile”,
“interet”: “Faune, Nature”,
“prix”: 30,
“description”: “Observation des lémuriens catta en liberté dans leur habitat naturel. Sentiers praticables avec assistance et quelques bancs de repos. Un guide accompagnateur spécialisé dans l’accessibilité est fortement recommandé.”,
“equipement_specifique”: “Chemins élargis, bancs de repos fréquents, personnel d’assistance disponible.”
},
{
“id”: 5,
“activite”: “Dégustation de produits locaux (Vanille, Chocolat)”,
“region”: “Tamatave”,
“duree”: “1.5 heures”,
“duree_num”: 1.5,
“accessibilite”: “Élevée”,
“difficulte”: “Très Facile”,
“interet”: “Gastronomie, Culturel”,
“prix”: 20,
“description”: “Immersion gourmande dans les saveurs de Madagascar avec dégustation de vanille, chocolat, épices locales et fruits exotiques. L’expérience est entièrement accessible et propice à la détente et à l’échange.”,
“equipement_specifique”: “Espaces spacieux, sièges ergonomiques, personnel attentif aux besoins spécifiques.”
},
{
“id”: 6,
“activite”: “Cours de madagasikara.fr/la-renaissance-de-la-cuisine-malgache-fusion-entre-tradition-et-modernite/">cuisine Malgache Adapté”,
“region”: “Antananarivo”,
“duree”: “3 heures”,
“duree_num”: 3,
“accessibilite”: “Élevée”,
“difficulte”: “Facile”,
“interet”: “Gastronomie, Culturel”,
“prix”: 50,
“description”: “Apprenez à préparer des plats traditionnels malgaches dans un environnement accessible et convivial. Les postes de travail sont adaptés aux fauteuils roulants et aux personnes assises. Tous les ingrédients sont fournis.”,
“equipement_specifique”: “Plans de travail ajustables, ustensiles ergonomiques, sièges adaptés.”
},
{
“id”: 7,
“activite”: “Visite du Jardin Botanique de Tsimbazaza”,
“region”: “Antananarivo”,
“duree”: “2-3 heures”,
“duree_num”: 2.5,
“accessibilite”: “Modérée”,
“difficulte”: “Facile”,
“interet”: “Nature, Faune”,
“prix”: 15,
“description”: “Explorez la flore et la faune endémiques de Madagascar dans un jardin botanique bien entretenu. Les chemins sont majoritairement accessibles, mais certaines zones peuvent nécessiter une assistance. Idéal pour une promenade relaxante.”,
“equipement_specifique”: “Bancs de repos, allées larges, assistance disponible pour les sections moins praticables.”
},
{
“id”: 8,
“activite”: “Croisière Relaxante sur le Canal des Pangalanes”,
“region”: “Est (Mananjary)”,
“duree”: “Demi-journée”,
“duree_num”: 4, // Demi-journée estimée à 4h pour le tri
“accessibilite”: “Modérée”,
“difficulte”: “Facile”,
“interet”: “Nature, Détente”,
“prix”: 60,
“description”: “Profitez d’une croisière paisible le long du Canal des Pangalanes, observant la vie locale, la nature luxuriante et les villages. Les ponts de bateau sont stables et offrent des sièges confortables. Aide à l’embarquement disponible.”,
“equipement_specifique”: “Accès facilité au bateau, espace réservé pour fauteuil roulant sur demande, personnel d’équipage attentif.”
},
{
“id”: 9,
“activite”: “Observation des baleines à Sainte-Marie (saison)”,
“region”: “Sainte-Marie”,
“duree”: “Demi-journée”,
“duree_num”: 4,
“accessibilite”: “Faible”, // Mouvement du bateau, embarquement délicat
“difficulte”: “Modérée”,
“interet”: “Faune, Nature”,
“prix”: 90,
“description”: “Une expérience majestueuse pour observer les baleines à bosse pendant la saison (juin à septembre). L’embarquement et les mouvements du bateau peuvent nécessiter une bonne autonomie ou une aide significative. La vigilance est de mise.”,
“equipement_specifique”: “Gilets de sauvetage. Non recommandé pour les PMR à mobilité très réduite sans accompagnement robuste et avis médical.”
},
{
“id”: 10,
“activite”: “Visite d’une plantation de café ou de cacao”,
“region”: “Nord-Est”,
“duree”: “2 heures”,
“duree_num”: 2,
“accessibilite”: “Modérée”,
“difficulte”: “Facile”,
“interet”: “Culturel, Gastronomie”,
“prix”: 35,
“description”: “Découvrez le processus de culture et de transformation du café ou du cacao, de la plante à la tasse/tablette. Les chemins des plantations peuvent être irréguliers, mais des parcours adaptés sont souvent possibles avec assistance d’un guide.”,
“equipement_specifique”: “Parcours majoritairement plats, bancs de repos, dégustation accessible, possibilité de guide-accompagnateur.”
}
];
let filteredActivities = […allActivities]; // Copie mutable pour les opérations de filtrage/tri
let currentSort = { column: ‘activite’, direction: ‘asc’ }; // Tri initial par défaut
let currentFilters = {
search: ”,
accessibilite: ”,
difficulte: ”,
interet: ”
};
// — Références aux éléments du DOM pour une manipulation plus aisée —
const tbody = document.getElementById(‘comparateur-tbody’);
const searchInput = document.getElementById(‘search-input’);
const filterAccessibilite = document.getElementById(‘filter-accessibilite’);
const filterDifficulte = document.getElementById(‘filter-difficulte’);
const filterInteret = document.getElementById(‘filter-interet’);
const resetFiltersBtn = document.getElementById(‘reset-filters’);
const tableHeaders = document.querySelectorAll(‘#madagascar-activities-comparateur th[data-sort-by]’);
const noResultsMessage = document.getElementById(‘no-results-message’);
// — FONCTIONS UTILITAIRES —
/**
* Normalise une chaîne de caractères en minuscules et sans accents pour faciliter la recherche et le filtrage.
* @param {string} str – La chaîne à normaliser.
* @returns {string} La chaîne normalisée.
*/
const normalizeString = (str) => {
return str.toLowerCase().normalize(“NFD”).replace(/[u0300-u036f]/g, “”);
};
/**
* Met à jour l’icône de tri (flèche) sur l’en-tête de colonne actuellement triée.
* @param {string} column – La colonne actuellement triée par sa clé de données.
* @param {string} direction – La direction du tri (‘asc’ pour croissant, ‘desc’ pour décroissant).
*/
const updateSortIcons = (column, direction) => {
tableHeaders.forEach(header => {
const sortBy = header.getAttribute(‘data-sort-by’);
const icon = header.querySelector(‘.sort-icon’);
if (icon) {
icon.className = ‘sort-icon’; // Réinitialise la classe de l’icône
if (sortBy === column) {
icon.classList.add(`sort-${direction}`); // Ajoute la classe pour la direction actuelle
}
}
});
};
/**
* Trie un tableau d’activités selon une colonne et une direction spécifiées.
* Gère les types de données (chaînes, nombres) et les ordres spécifiques pour “Accessibilité” et “Difficulté”.
* @param {Array