new chat url

public/bm

@@ -1,110 +0,0 @@
-const WEBHOOK_URL = "https://002-001-5dd6e535-4d1c-46bc-9bd9-42ad4bc5f082.odoo4projects.com/webhook/c76e6b4e-af2f-4bc3-9875-6460d0ffc8e3";
-
-function createModal() {
-    const modal = document.createElement("div");
-    modal.id = "buyNowModal";
-    modal.style.position = "fixed";
-    modal.style.top = "0";
-    modal.style.left = "0";
-    modal.style.width = "100%";
-    modal.style.height = "100%";
-    modal.style.backgroundColor = "rgba(0,0,0,0.5)";
-    modal.style.display = "none";
-    modal.style.justifyContent = "center";
-    modal.style.alignItems = "center";
-    modal.style.zIndex = "1000";
-
-    modal.innerHTML = `
-        <div style="background: #fff; padding: 25px; border-radius: 12px; max-width: 450px; width: 95%; position: relative; font-family: sans-serif; box-shadow: 0 4px 12px rgba(0,0,0,0.15);">
-            <span id="closeModal" style="position: absolute; top: 10px; right: 15px; cursor: pointer; font-weight: bold; font-size: 20px;">&times;</span>
-            <h2 style="margin-bottom: 10px;">Order Details</h2>
-            <p id="productText" style="margin-bottom: 20px; font-weight: 500;"></p>
- 
-           <form id="buyForm" style="display: flex; flex-direction: column; gap: 12px;">
-                <input type="text" name="name" placeholder="Name" required>
-                <input type="text" name="company" placeholder="Company" required>
-                <input type="text" name="country" placeholder="Country" required>
-                <input type="text" name="street" placeholder="Street" required>
-                <div style="display: flex; gap: 10px;">
-                    <input type="text" name="zip" placeholder="ZIP" required style="flex: 1;">
-                    <input type="text" name="town" placeholder="Town" required style="flex: 2;">
-                </div>
-                <input type="email" name="email" placeholder="Email" required>
-                <input type="hidden" name="product">
-                <input type="hidden" name="price">
-                <button type="submit" style="padding: 10px; background: #007BFF; color: #fff; border: none; border-radius: 6px; cursor: pointer; font-size: 16px;">Submit</button>
-            </form>
-        </div>
-    `;
-
-    document.body.appendChild(modal);
-    document.getElementById("closeModal").onclick = () => { modal.style.display = "none"; };
-    modal.onclick = (e) => { if (e.target === modal) modal.style.display = "none"; };
-    return modal;
-}
-
-function openModal(productHref) {
-    const modal = document.getElementById("buyNowModal");
-    modal.style.display = "flex";
-
-    let product = productHref;
-    let price = "";
-    if (productHref.includes("/")) {
-        const parts = productHref.split("/").filter(Boolean);
-        product = parts[parts.length - 2] || "Product";
-        price = parts[parts.length - 1] || "0";
-    }
-
-    modal.querySelector('input[name="product"]').value = product;
-    modal.querySelector('input[name="price"]').value = price;
-    modal.querySelector("#productText").textContent = `You will buy ${product} for $${price}.`;
-}
-
-function handleFormSubmit() {
-    const form = document.getElementById("buyForm");
-    form.addEventListener("submit", async (e) => {
-        e.preventDefault();
-        const data = {};
-        new FormData(form).forEach((value, key) => (data[key] = value));
-
-        try {
-            const res = await fetch(WEBHOOK_URL, {
-                method: "POST",
-                headers: { "Content-Type": "application/json" },
-                body: JSON.stringify(data)
-            });
-
-            if (res.ok) {
-                alert("Form submitted successfully!");
-                form.reset();
-                document.getElementById("buyNowModal").style.display = "none";
-            } else {
-                alert("Failed to submit form.");
-            }
-        } catch (err) {
-            console.error(err);
-            alert("Error submitting form.");
-        }
-    });
-}
-
-function attachButtons() {
-    const buttons = Array.from(document.querySelectorAll("button, a"));
-    buttons.forEach(btn => {
-        const text = btn.textContent.trim();
-        if (text === "Buy Now" || text === "Book Now") {
-            btn.addEventListener("click", (e) => {
-                e.preventDefault();
-                const href = btn.getAttribute("href") || btn.dataset.product || "Unknown/0";
-                openModal(href);
-            });
-        }
-    });
-}
-
-document.addEventListener("DOMContentLoaded", () => {
-    createModal();
-    handleFormSubmit();
-    attachButtons();
-});
-

public/buyModal.js

@@ -1,6 +1,5 @@
 const WEBHOOK_URL = "https://002-001-5dd6e535-4d1c-46bc-9bd9-42ad4bc5f082.odoo4projects.com/webhook/c76e6b4e-af2f-4bc3-9875-6460d0ffc8e3";
 
-
 function createModal() {
     const modal = document.createElement("div");
     modal.id = "buyNowModal";
@@ -40,6 +39,25 @@ function createModal() {
             <p id="productText" style="margin-bottom: 25px; font-weight: 500; color: #555;"></p>
 
             <form id="buyForm" style="display: flex; flex-direction: column; gap: 15px;">
+                
+                <!-- Hidden select, shown only if product starts with "_" -->
+                <select name="location" id="locationSelect" required style="
+                    display: none;
+                    padding: 12px 15px; 
+                    font-size: 16px; 
+                    border: 1px solid #ccc; 
+                    border-radius: 8px; 
+                    outline: none;
+                ">
+                    <option value="">Select Location</option>
+                    <option value="Boston">US, Boston</option>
+                    <option value="Manchester">UK, Manchester</option>
+                    <option value="Mumbai">IN, Mumbai</option>
+                    <option value="Saopaulo">BR, Sao Paulo</option>
+                    <option value="meppel">NL, Meppel</option>
+
+                </select>
+
                 <input type="text" name="name" placeholder="Name" required style="padding: 12px 15px; font-size: 16px; border: 1px solid #ccc; border-radius: 8px; outline: none;">
                 <input type="text" name="company" placeholder="Company" required style="padding: 12px 15px; font-size: 16px; border: 1px solid #ccc; border-radius: 8px; outline: none;">
                 <input type="text" name="country" placeholder="Country" required style="padding: 12px 15px; font-size: 16px; border: 1px solid #ccc; border-radius: 8px; outline: none;">
@@ -49,7 +67,6 @@ function createModal() {
                   <input type="text" name="town" placeholder="Town" required style="flex: 2 1 0; padding: 12px 10px; font-size: 16px; border: 1px solid #ccc; border-radius: 8px;">
                 </div>
                 
-                
                 <input type="email" name="email" placeholder="Email" required style="padding: 12px 15px; font-size: 16px; border: 1px solid #ccc; border-radius: 8px; outline: none;">
                 
                 <input type="hidden" name="product">
@@ -98,7 +115,10 @@ function createModal() {
 
     // Close modal
     document.getElementById("closeModal").onclick = () => { document.getElementById("buyNowModal").style.display = "none"; };
-    document.getElementById("closeConfirmation").onclick = () => { document.getElementById("confirmation").style.display = "none"; };
+    document.getElementById("closeConfirmation").onclick = () => { 
+      document.getElementById("confirmation").style.display = "none"; 
+      document.getElementById("buyNowModal").style.display = "none"; 
+    };
     modal.onclick = (e) => { if (e.target === modal) modal.style.display = "none"; };
 
     return modal;
@@ -108,6 +128,14 @@ function openModal(productHref) {
     const modal = document.getElementById("buyNowModal");
     modal.style.display = "flex";
 
+    // Reset form display for repeated orders
+    const form = modal.querySelector("#buyForm");
+    const confirmation = modal.querySelector("#confirmation");
+    form.style.display = "flex";       // show form
+    confirmation.style.display = "none"; // hide confirmation
+
+
+
     let product = productHref;
     let price = "";
     if (productHref.includes("/")) {
@@ -115,12 +143,24 @@ function openModal(productHref) {
         product = parts[parts.length - 2] || "Product";
         price = parts[parts.length - 1] || "0";
     }
+    // Show/hide location select
+    const locationSelect = document.getElementById("locationSelect");
+    if (product.startsWith("_")) {
+        locationSelect.style.display = "block";
+        locationSelect.setAttribute("required", "true");
+    } else {
+        locationSelect.style.display = "none";
+        locationSelect.removeAttribute("required");
+        locationSelect.value = ""; // reset
+    }
+    product = product.replace(/_/g, ""); // This needs to be after the locationSelect show ;)
 
     modal.querySelector('input[name="product"]').value = product;
     modal.querySelector('input[name="price"]').value = price;
     modal.querySelector("#productText").textContent = `You will buy ${product} for $${price}.`;
 }
 
+
 function handleFormSubmit() {
     const form = document.getElementById("buyForm");
     const confirmation = document.getElementById("confirmation");

public/tryNow.js

@@ -0,0 +1,167 @@
+const TRYNOW_WEBHOOK_URL = "https://002-001-5dd6e535-4d1c-46bc-9bd9-42ad4bc5f082.odoo4projects.com/webhook/c25169c6-4234-4b47-8e74-612b9539da0a";
+
+function tryNow_createModal() {
+    const modal = document.createElement("div");
+    modal.id = "trynowModal";
+    modal.style.position = "fixed";
+    modal.style.top = "0";
+    modal.style.left = "0";
+    modal.style.width = "100%";
+    modal.style.height = "100%";
+    modal.style.backgroundColor = "rgba(0,0,0,0.6)";
+    modal.style.display = "none";
+    modal.style.justifyContent = "center";
+    modal.style.alignItems = "center";
+    modal.style.zIndex = "1000";
+
+    modal.innerHTML = `
+        <div style="
+            background: #ffffff; 
+            padding: 40px 30px; 
+            border-radius: 16px; 
+            max-width: 400px; 
+            width: 90%; 
+            position: relative; 
+            font-family: 'Arial', sans-serif; 
+            box-shadow: 0 10px 25px rgba(0,0,0,0.2);
+        ">
+            <span id="trynowCloseModal" style="
+                position: absolute; 
+                top: 15px; 
+                right: 20px; 
+                cursor: pointer; 
+                font-weight: bold; 
+                font-size: 24px;
+                color: #555;
+            ">&times;</span>
+            
+            <h2 style="margin-bottom: 20px; font-size: 24px; color: #333;">Order Details</h2>
+
+            <form id="trynowForm" style="display: flex; flex-direction: column; gap: 15px;">
+                <input type="email" name="email" placeholder="Email" required style="padding: 12px 15px; font-size: 16px; border: 1px solid #ccc; border-radius: 8px; outline: none;">
+
+                <select name="location" id="trynowLocationSelect" required style="padding: 12px 15px; font-size: 16px; border: 1px solid #ccc; border-radius: 8px; outline: none;">
+                    <option value="">Select Location</option>
+                    <option value="Boston">Boston</option>
+                    <option value="Manchester">Manchester</option>
+                    <option value="Mumbai">Mumbai</option>
+                    <option value="Saopaulo">Sao Paulo</option>
+                </select>
+
+                <select name="product" required style="padding: 12px 15px; font-size: 16px; border: 1px solid #ccc; border-radius: 8px; outline: none;">
+                    <option value="odoo_19" selected>ODOO</option>
+                    <option value="N8N">n8n</option>
+                </select>
+
+                <button type="submit" style="
+                    padding: 14px; 
+                    background: #007BFF; 
+                    color: #fff; 
+                    border: none; 
+                    border-radius: 8px; 
+                    cursor: pointer; 
+                    font-size: 18px; 
+                    font-weight: bold;
+                    transition: background 0.3s;
+                ">Start free Trial</button>
+            </form>
+
+            <div id="trynowConfirmation" style="
+                display: none;
+                margin-top: 20px;
+                padding: 20px;
+                background-color: #e6ffed;
+                color: #056608;
+                border-radius: 12px;
+                text-align: center;
+                font-weight: 500;
+            ">
+                <p>Thank you for your submission! 🎉</p>
+                <button id="trynowCloseConfirmation" style="
+                    margin-top: 10px;
+                    padding: 10px 20px;
+                    background: #007BFF;
+                    color: #fff;
+                    border: none;
+                    border-radius: 8px;
+                    cursor: pointer;
+                    font-size: 16px;
+                    transition: background 0.3s;
+                ">Close</button>
+            </div>
+        </div>
+    `;
+
+    document.body.appendChild(modal);
+
+    // Close modal handlers
+    document.getElementById("trynowCloseModal").onclick = () => { modal.style.display = "none"; };
+    document.getElementById("trynowCloseConfirmation").onclick = () => { 
+        document.getElementById("trynowConfirmation").style.display = "none"; 
+        modal.style.display = "none"; 
+    };
+    modal.onclick = (e) => { if (e.target === modal) modal.style.display = "none"; };
+
+    return modal;
+}
+
+function tryNow_handleFormSubmit() {
+    const form = document.getElementById("trynowForm");
+    const confirmation = document.getElementById("trynowConfirmation");
+
+    form.addEventListener("submit", async (e) => {
+        e.preventDefault();
+        const data = {};
+        new FormData(form).forEach((value, key) => (data[key] = value));
+
+        try {
+            const res = await fetch(TRYNOW_WEBHOOK_URL, {
+                method: "POST",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify(data)
+            });
+
+            if (res.ok) {
+                form.style.display = "none";
+                confirmation.style.display = "block";
+                form.reset();
+            } else {
+                alert("Failed to submit form.");
+            }
+        } catch (err) {
+            console.error(err);
+            alert("Error submitting form.");
+        }
+    });
+}
+
+function tryNow_attachButtons() {
+    const buttons = Array.from(document.querySelectorAll("a, button"));
+    buttons.forEach(btn => {
+        if (btn.textContent && btn.textContent.trim() === "Try Now") {
+            btn.addEventListener("click", (e) => {
+                e.preventDefault();
+                const modal = document.getElementById("trynowModal");
+                if (modal) {
+                    modal.style.display = "flex";
+                    // Reset modal state
+                    const form = document.getElementById("trynowForm");
+                    const confirmation = document.getElementById("trynowConfirmation");
+                    if (form && confirmation) {
+                        form.style.display = "flex";
+                        confirmation.style.display = "none";
+                    }
+                }
+            });
+        }
+    });
+}
+
+
+document.addEventListener("DOMContentLoaded", () => {
+    tryNow_createModal();
+    tryNow_handleFormSubmit();
+    tryNow_attachButtons();
+});
+
+

public/widget-signup/widget.js

@@ -114,8 +114,11 @@
       <label for="location">Location</label>
       <select id="location" name="location" required>
         <option value="" disabled>Select a region</option>
-        <option value="manchester">UK - Manchester</option>
+        <option value="manchester">UK, Manchester</option>
-        <option value="boston">US - Boston</option>
+        <option value="boston">US, Boston</option>
+        <option value="mumbai">IN, Mumbai</option>
+        <option value="saopaulo">BR, Sao Paulo</option>
+        <option value="Meppel">NL, Meppel</option>
       </select>
 
       <label for="email">Work Email</label>

public/widget/custom/brandize.json

@@ -1,5 +1,5 @@
 {
-  "api": "https://brandize.n8n.odoo4projects.com/webhook/81742473-b50b-4845-a5f9-916d9fe60876/chat",
+  "api": "https://002-001-433cd554-0d64-4834-8500-3aebea781003.odoo4projects.com/webhook/81742473-b50b-4845-a5f9-916d9fe60876/chat",
   "preamble": "Welcome to Brandize",
   "widgetHTML": "<button id='cw-chatToggle' aria-label='Toggle chat widget' type='button'>\n  <img height='50px' src='widget/custom/brandize.svg' alt='Logo'></button>\n<div id='cw-chatWidget' style='display: none;' role='region' aria-live='polite' aria-label='Chat widget'>\n  <div class='logo-container'><img src='widget/custom/brandize.svg' alt='Logo' /><button id='callBtn' class='button'>📞</button></div>\n  <div class='header'>Support</div>\n  <div id='cw-status' style='transition: all 0.3s ease; overflow: hidden;'></div>\n  <div id='cw-chatMessages' style='max-height: 200px; overflow-y: auto; padding: 10px;'></div>\n  <form id='cw-chatForm' autocomplete='off'>\n    <input type='text' id='cw-chatInput' placeholder='Type your message...' required autocomplete='off' />\n    <button type='submit'>Send</button>\n  </form>\n</div>"
 }