Updatweb

2025-12-19 20:44:46 -06:00
parent 701f799cde
commit e4b3de4a46
113 changed files with 16673 additions and 2174 deletions
--- a/website/public/test-products.html
+++ b/website/public/test-products.html
@@ -0,0 +1,102 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Products Test</title>
+    <style>
+      body {
+        font-family: Arial, sans-serif;
+        padding: 20px;
+        background: #f5f5f5;
+      }
+      .product-grid {
+        display: grid;
+        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+        gap: 20px;
+        margin-top: 20px;
+      }
+      .product-card {
+        background: white;
+        border: 1px solid #ddd;
+        border-radius: 8px;
+        padding: 15px;
+      }
+      .product-card img {
+        width: 100%;
+        height: 200px;
+        object-fit: cover;
+        border-radius: 4px;
+      }
+      .product-card h3 {
+        margin: 10px 0;
+        font-size: 16px;
+      }
+      .product-card .price {
+        color: #ff6b6b;
+        font-weight: bold;
+        font-size: 18px;
+      }
+      .loading {
+        text-align: center;
+        padding: 40px;
+      }
+    </style>
+  </head>
+  <body>
+    <h1>Product API Test</h1>
+    <div id="status" class="loading">Loading products...</div>
+    <div id="products" class="product-grid"></div>
+
+    <script>
+      async function testProducts() {
+        const statusDiv = document.getElementById("status");
+        const productsDiv = document.getElementById("products");
+
+        try {
+          console.log("Fetching products from /api/products...");
+          const response = await fetch("/api/products");
+          console.log("Response status:", response.status);
+
+          const data = await response.json();
+          console.log("Response data:", data);
+
+          if (data.success && data.products) {
+            const products = data.products;
+            statusDiv.innerHTML = `<strong>Success!</strong> Loaded ${products.length} products`;
+            statusDiv.style.color = "green";
+
+            productsDiv.innerHTML = products
+              .map(
+                (p) => `
+                        <div class="product-card">
+                            <img src="${
+                              p.imageurl || "/assets/images/placeholder.jpg"
+                            }" 
+                                 alt="${p.name}" 
+                                 onerror="this.src='/assets/images/placeholder.jpg'">
+                            <h3>${p.name}</h3>
+                            <p>${p.shortdescription || p.description || ""}</p>
+                            <p class="price">$${parseFloat(p.price).toFixed(
+                              2
+                            )}</p>
+                        </div>
+                    `
+              )
+              .join("");
+
+            console.log("Products rendered successfully");
+          } else {
+            statusDiv.innerHTML = "<strong>Error:</strong> No products found";
+            statusDiv.style.color = "red";
+            console.error("No products in response");
+          }
+        } catch (error) {
+          statusDiv.innerHTML = `<strong>Error:</strong> ${error.message}`;
+          statusDiv.style.color = "red";
+          console.error("Error loading products:", error);
+        }
+      }
+
+      testProducts();
+    </script>
+  </body>
+</html>