NEED TO START TURNING MORE CLICKS TO CLIENTS

document.addEventListener("DOMContentLoaded", function () { const form = document.querySelector('#domain-form'); const resultWrap = document.querySelector('#statement-component'); const resultLoader = document.querySelector('#statement-loader'); const resultText = document.querySelector('#statement-text'); const feedbackText = document.querySelector('#text-4'); const scoreBar = document.querySelector("#score-bar"); const colorBlock1 = document.getElementById("1colour"); const colorBlock2 = document.getElementById("2colour"); const colorBlock3 = document.getElementById("3colour"); const webSnipContainer = document.getElementById("web-snip"); const scanningBar = document.getElementById("scanning-bar"); const busNameEl = document.getElementById("busname"); const scanErrorEl = document.getElementById("scan-error"); let isFormLocked = false; resultWrap.style.display = "none"; if (scanErrorEl) scanErrorEl.style.display = "none"; form.addEventListener('submit', (event) => { event.preventDefault(); event.stopPropagation(); if (isFormLocked) return; isFormLocked = true; Array.from(form.elements).forEach(element => { element.disabled = true; element.style.opacity = "0.5"; element.style.pointerEvents = "none"; }); form.style.display = "block"; resultWrap.style.display = "none"; resultLoader.style.display = "flex"; if (scanErrorEl) scanErrorEl.style.display = "none"; // Start scanning bar animation scanningBar.innerHTML = ""; scanningBar.style.display = "block"; const line = document.createElement("div"); line.classList.add("scanline"); scanningBar.appendChild(line); const domain = document.getElementById('domain-3').value; const email = document.getElementById('email-4').value; if (busNameEl && domain) { const cleanDomain = domain.replace(/^https?:\/\//, "").replace(/^www\./, "").split('/')[0]; busNameEl.textContent = `${cleanDomain} STATS`; } fetch('https://hook.eu2.make.com/41dg7er4g4ahkmfiapkdsc5fyd8n72nn', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ domain, email }) }) .then(response => response.json()) .then(data => { console.log("Scan data:", data); // Debugging log const hasRequiredFields = data && data.score !== undefined && data.feedback && data["web-snip"]; if (!hasRequiredFields) throw new Error("Incomplete or invalid scan data received."); const score = data.score; const feedback = data.feedback.trim().length > 5 ? data.feedback : "We couldn't generate a summary for this site. Try scanning a different one."; animateScore(score); feedbackText.textContent = feedback; updateScoreBar(score); updateColorBlocks(data["1colour"], data["2colour"], data["3colour"]); updateWebSnip(data["web-snip"]); resultLoader.style.display = "none"; scanningBar.style.display = "none"; scanningBar.innerHTML = ""; resultWrap.style.display = "block"; }) .catch(error => { console.error('Scan Error:', error); feedbackText.textContent = "Uh oh — something went wrong with the scan. Please double-check the URL and try again."; feedbackText.style.display = "block"; feedbackText.style.opacity = "1"; if (scanErrorEl) scanErrorEl.style.display = "block"; setTimeout(() => { feedbackText.style.opacity = "0"; feedbackText.style.display = "none"; if (scanErrorEl) scanErrorEl.style.display = "none"; }, 8000); isFormLocked = false; Array.from(form.elements).forEach(element => { element.disabled = false; element.style.opacity = "1"; element.style.pointerEvents = "auto"; }); resultText.textContent = ""; resultLoader.style.display = "none"; scanningBar.style.display = "none"; scanningBar.innerHTML = ""; }); }); function animateScore(finalScore) { let current = 0; const duration = 800; const step = Math.ceil(finalScore / (duration / 20)); const interval = setInterval(() => { current += step; if (current >= finalScore) { current = finalScore; clearInterval(interval); } resultText.textContent = `${current}`; }, 20); } function updateScoreBar(score) { if (!scoreBar) return; let validatedScore = Math.max(0, Math.min(100, score)); scoreBar.style.width = `${validatedScore}%`; scoreBar.className = ''; if (validatedScore >= 70) { scoreBar.style.backgroundColor = "#2ecc71"; scoreBar.classList.add('green'); } else if (validatedScore >= 40) { scoreBar.style.backgroundColor = "#f4c542"; scoreBar.classList.add('orange'); } else { scoreBar.style.backgroundColor = "#ff6b6b"; scoreBar.classList.add('red'); } } function updateColorBlocks(color1, color2, color3) { if (color1 && /^#[0-9A-F]{6}$/i.test(color1)) colorBlock1.style.backgroundColor = color1; if (color2 && /^#[0-9A-F]{6}$/i.test(color2)) colorBlock2.style.backgroundColor = color2; if (color3 && /^#[0-9A-F]{6}$/i.test(color3)) colorBlock3.style.backgroundColor = color3; } function updateWebSnip(imageURL) { const webSnipContainer = document.getElementById("web-snip"); if (!webSnipContainer) return; if (imageURL && typeof imageURL === "string" && imageURL.startsWith("http")) { let img = webSnipContainer.querySelector("img"); if (!img) { img = document.createElement("img"); img.style.width = "100%"; img.style.maxHeight = "408px"; img.style.objectFit = "cover"; img.style.objectPosition = "top"; img.style.borderRadius = "16px"; webSnipContainer.appendChild(img); } img.src = imageURL; img.alt = "Website Snapshot"; } }