webupdatev1

website/public/assets/js/main.js

@@ -6,6 +6,8 @@
 (function () {
   "use strict";
 
+  console.log('[main.js] Loading...');
+
   // Global state management
   window.AppState = {
     cart: [],
@@ -13,12 +15,17 @@
     products: [],
     settings: null,
     user: null,
+    _saveCartTimeout: null,
+    _saveWishlistTimeout: null,
 
     // Initialize state from localStorage
     init() {
+      console.log('[AppState] Initializing...');
+      console.log('[AppState] window.AppState exists:', !!window.AppState);
       this.loadCart();
       this.loadWishlist();
       this.updateUI();
+      console.log('[AppState] Initialized - Cart:', this.cart.length, 'items, Wishlist:', this.wishlist.length, 'items');
     },
 
     // Cart management
@@ -33,23 +40,33 @@
     },
 
     saveCart() {
-      try {
-        localStorage.setItem("cart", JSON.stringify(this.cart));
-        this.updateUI();
-      } catch (error) {
-        console.error("Error saving cart:", error);
+      // Debounce saves to reduce localStorage writes
+      if (this._saveCartTimeout) {
+        clearTimeout(this._saveCartTimeout);
       }
+      this._saveCartTimeout = setTimeout(() => {
+        try {
+          localStorage.setItem("cart", JSON.stringify(this.cart));
+          this.updateUI();
+        } catch (error) {
+          console.error("Error saving cart:", error);
+        }
+      }, 100);
     },
 
     addToCart(product, quantity = 1) {
+      console.log('[AppState] addToCart called:', product, 'quantity:', quantity);
       const existing = this.cart.find((item) => item.id === product.id);
       if (existing) {
+        console.log('[AppState] Product exists in cart, updating quantity');
         existing.quantity += quantity;
       } else {
+        console.log('[AppState] Adding new product to cart');
         this.cart.push({ ...product, quantity });
       }
+      console.log('[AppState] Cart after add:', this.cart);
       this.saveCart();
-      this.showNotification("Added to cart", "success");
+      this.showNotification(`${product.name || product.title || 'Item'} added to cart`, "success");
     },
 
     removeFromCart(productId) {
@@ -60,6 +77,9 @@
 
     updateCartQuantity(productId, quantity) {
       const item = this.cart.find((item) => item.id === productId);
+        
+        // Dispatch custom event for cart dropdown
+        window.dispatchEvent(new CustomEvent('cart-updated', { detail: this.cart }));
       if (item) {
         item.quantity = Math.max(1, quantity);
         this.saveCart();
@@ -98,9 +118,17 @@
     },
 
     addToWishlist(product) {
-      if (!this.wishlist.find((item) => item.id === product.id)) {
+      if (!this.wishlist.find(`${product.name || product.title || 'Item'} added to wishlist`, "success");
+        
+        // Dispatch custom event for wishlist dropdown
+        window.dispatchEvent(new CustomEvent('wishlist-updated', { detail: this.wishlist }));
+      } else {
+        this.showNotification("Already in wishlist", "info.id)) {
         this.wishlist.push(product);
         this.saveWishlist();
+      
+      // Dispatch custom event for wishlist dropdown
+      window.dispatchEvent(new CustomEvent('wishlist-updated', { detail: this.wishlist }));
         this.showNotification("Added to wishlist", "success");
       }
     },
@@ -123,20 +151,32 @@
 
     updateCartUI() {
       const count = this.getCartCount();
+      console.log('[AppState] Updating cart UI, count:', count);
       const badge = document.getElementById("cartCount");
       if (badge) {
         badge.textContent = count;
         badge.style.display = count > 0 ? "flex" : "none";
+        console.log('[AppState] Cart badge updated');
+      } else {
+        console.warn('[AppState] Cart badge element not found');
       }
+      // Also trigger cart dropdown update
+      window.dispatchEvent(new CustomEvent('cart-updated', { detail: this.cart }));
     },
 
     updateWishlistUI() {
       const count = this.wishlist.length;
+      console.log('[AppState] Updating wishlist UI, count:', count);
       const badge = document.getElementById("wishlistCount");
       if (badge) {
         badge.textContent = count;
         badge.style.display = count > 0 ? "flex" : "none";
+        console.log('[AppState] Wishlist badge updated');
+      } else {
+        console.warn('[AppState] Wishlist badge element not found');
       }
+      // Also trigger wishlist dropdown update
+      window.dispatchEvent(new CustomEvent('wishlist-updated', { detail: this.wishlist }));
     },
 
     // Notifications
@@ -301,11 +341,14 @@
   };
 
   // Initialize on DOM ready
+  console.log('[main.js] Script loaded, document.readyState:', document.readyState);
   if (document.readyState === "loading") {
     document.addEventListener("DOMContentLoaded", () => {
+      console.log('[main.js] DOMContentLoaded fired');
       window.AppState.init();
     });
   } else {
+    console.log('[main.js] DOM already loaded, initializing immediately');
     window.AppState.init();
   }