Spaces:
Running
Running
| // Initialize cart if not exists | |
| if (!localStorage.getItem('cart')) { | |
| localStorage.setItem('cart', JSON.stringify([])); | |
| } | |
| // Update cart counter | |
| function updateCartCounter() { | |
| const cart = JSON.parse(localStorage.getItem('cart')); | |
| const counters = document.querySelectorAll('custom-navbar').forEach(nav => { | |
| const counter = nav.shadowRoot.querySelector('.cart-counter'); | |
| if (counter) { | |
| counter.textContent = cart.length; | |
| counter.style.display = cart.length ? 'block' : 'none'; | |
| } | |
| }); | |
| // Initialize cart counter on page load | |
| document.addEventListener('DOMContentLoaded', function() { | |
| updateCartCounter(); | |
| // Load wishlist status | |
| const wishlist = JSON.parse(localStorage.getItem('wishlist') || '[]'); | |
| document.querySelectorAll('.wishlist-btn').forEach(btn => { | |
| const productName = btn.closest('.product-card, .promotion-card').querySelector('h3').textContent; | |
| if (wishlist.some(p => p.name === productName)) { | |
| btn.classList.add('active'); | |
| } | |
| }); | |
| }); | |
| } | |
| // Add to cart functionality | |
| document.addEventListener('click', function(e) { | |
| if (e.target.classList.contains('add-to-cart')) { | |
| const productCard = e.target.closest('.product-card, .promotion-card'); | |
| const product = { | |
| name: productCard.querySelector('h3').textContent, | |
| price: productCard.querySelector('.price').textContent, | |
| image: productCard.querySelector('img').src | |
| }; | |
| const cart = JSON.parse(localStorage.getItem('cart')); | |
| cart.push(product); | |
| localStorage.setItem('cart', JSON.stringify(cart)); | |
| alert(`${product.name} a été ajouté à votre panier`); | |
| updateCartCounter(); | |
| } | |
| }); | |
| // Wishlist functionality | |
| document.addEventListener('click', function(e) { | |
| if (e.target.classList.contains('wishlist-btn')) { | |
| e.target.classList.toggle('active'); | |
| const productCard = e.target.closest('.product-card, .promotion-card'); | |
| const product = { | |
| name: productCard.querySelector('h3').textContent, | |
| price: productCard.querySelector('.price').textContent, | |
| image: productCard.querySelector('img').src | |
| }; | |
| let wishlist = JSON.parse(localStorage.getItem('wishlist') || '[]'); | |
| if (e.target.classList.contains('active')) { | |
| wishlist.push(product); | |
| } else { | |
| wishlist = wishlist.filter(p => p.name !== product.name); | |
| } | |
| localStorage.setItem('wishlist', JSON.stringify(wishlist)); | |
| } | |
| }); | |
| // Product rating | |
| document.addEventListener('click', function(e) { | |
| if (e.target.classList.contains('star-rating')) { | |
| const rating = parseInt(e.target.dataset.rating); | |
| const productCard = e.target.closest('.product-card, .promotion-card'); | |
| const stars = productCard.querySelectorAll('.star-rating'); | |
| stars.forEach((star, index) => { | |
| star.classList.toggle('active', index < rating); | |
| }); | |
| // In a real app, you would save this rating to your database | |
| console.log(`Rated ${productCard.querySelector('h3').textContent} with ${rating} stars`); | |
| } | |
| }); | |
| // Search functionality | |
| document.addEventListener('DOMContentLoaded', function() { | |
| const searchInput = document.querySelector('custom-navbar').shadowRoot.querySelector('input'); | |
| if (searchInput) { | |
| searchInput.addEventListener('keypress', function(e) { | |
| if (e.key === 'Enter') { | |
| window.location.href = `/search.html?q=${encodeURIComponent(this.value)}`; | |
| } | |
| }); | |
| } | |
| }); |