// Function to fetch catalogs and categories from the API
function fetchCatalogs() {
fetch('https://api.charikatec.com/catalogs/categories/?lang=fr')
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.json();
})
.then(data => {
// Get the catalog menu element
const catalogMenu = document.getElementById('catalog-menu');
// Clear existing content
catalogMenu.innerHTML = '';
// Loop through the catalogs in the data
data.data.forEach(catalog => {
// Create a list item for the catalog
const catalogItem = document.createElement('li');
catalogItem.className = 'catalog-item';
// Create the catalog title
const catalogTitle = document.createElement('h5');
catalogTitle.textContent = catalog.name;
catalogItem.appendChild(catalogTitle);
// Create a sublist for categories if they exist
if (catalog.categories && catalog.categories.length > 0) {
const categoryList = document.createElement('ul');
categoryList.className = 'subcategory-list';
// Loop through categories
catalog.categories.forEach(category => {
const categoryItem = document.createElement('li');
categoryItem.className = 'category-item';
// Create a link for the category
const categoryLink = document.createElement('a');
categoryLink.href = `/category/${category.slug}`; // Adjust URL as needed
categoryLink.textContent = `${category.name} (${category.count})`;
// Add image if available
if (category.image) {
const categoryImage = document.createElement('img');
categoryImage.src = category.image;
categoryImage.alt = category.name;
categoryImage.style.width = '20px'; // Adjust size as needed
categoryItem.appendChild(categoryImage);
}
categoryItem.appendChild(categoryLink);
categoryList.appendChild(categoryItem);
});
catalogItem.appendChild(categoryList);
}
// Append the catalog item to the menu
catalogMenu.appendChild(catalogItem);
});
})
.catch(error => {
console.error('Error fetching catalogs:', error);
catalogMenu.innerHTML = '
Erreur lors du chargement du catalogue
';
});
}
// Call the function when the page loads
document.addEventListener('DOMContentLoaded', fetchCatalogs);
