JSON Form<\/title>\r\n <style>\r\n body {\r\n font-family: 'Poppins', sans-serif;\r\n font-weight: 400;\r\n }\r\n label.required::after {\r\n content: \" *\";\r\n color: red;\r\n }\r\n button[type=\"button\"] {\r\n background-color: #25336b;\r\n color: white;\r\n width: 100%;\r\n padding: 10px;\r\n border: none;\r\n cursor: pointer;\r\n transition: background-color 0.3s ease;\r\n }\r\n button[type=\"button\"]:hover {\r\n background-color: #172238;\r\n }\r\n \/* Snackbar styles *\/\r\n .snackbar {\r\n visibility: hidden; \/* Hidden by default. Visible on click *\/\r\n min-width: 250px; \/* Set a default minimum width *\/\r\n margin-left: -125px; \/* Divide value of min-width by 2 *\/\r\n background-color: #333; \/* Black background color *\/\r\n color: #fff; \/* White text color *\/\r\n text-align: center; \/* Centered text *\/\r\n border-radius: 2px; \/* Rounded borders *\/\r\n padding: 16px; \/* Padding *\/\r\n position: fixed; \/* Sit on top of the screen *\/\r\n z-index: 1; \/* Add a z-index if needed *\/\r\n left: 50%; \/* Center the snackbar *\/\r\n bottom: 30px; \/* 30px from the bottom *\/\r\n }\r\n\r\n \/* Show the snackbar when clicking on a button (class added with JavaScript) *\/\r\n .snackbar.show {\r\n visibility: visible; \/* Show the snackbar *\/\r\n \/* Add animation: Take 0.5 seconds to fade in and out the snackbar. \r\n However, delay the fade out process for 2.5 seconds *\/\r\n -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;\r\n animation: fadein 0.5s, fadeout 0.5s 2.5s;\r\n }\r\n\r\n \/* Animations to fade the snackbar in and out *\/\r\n @-webkit-keyframes fadein {\r\n from {bottom: 0; opacity: 0;} \r\n to {bottom: 30px; opacity: 1;}\r\n }\r\n\r\n @keyframes fadein {\r\n from {bottom: 0; opacity: 0;}\r\n to {bottom: 30px; opacity: 1;}\r\n }\r\n\r\n @-webkit-keyframes fadeout {\r\n from {bottom: 30px; opacity: 1;} \r\n to {bottom: 0; opacity: 0;}\r\n }\r\n\r\n @keyframes fadeout {\r\n from {bottom: 30px; opacity: 1;}\r\n to {bottom: 0; opacity: 0;}\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n<form id=\"json-form\" style=\"max-width: 600px; margin: 0 auto; font-family: 'Inter', sans-serif;\">\r\n <label for=\"firstName\" style=\"font-weight: 600; display: block; margin-bottom: 6px;\">First Name<span style=\"color: red;\"> *<\/span><\/label>\r\n <input type=\"text\" id=\"firstName\" required style=\"width: 100%; padding: 12px; margin-bottom: 16px; border: 1px solid #ccc; border-radius: 8px;\">\r\n\r\n <label for=\"lastName\" style=\"font-weight: 600; display: block; margin-bottom: 6px;\">Last Name<span style=\"color: red;\"> *<\/span><\/label>\r\n <input type=\"text\" id=\"lastName\" required style=\"width: 100%; padding: 12px; margin-bottom: 16px; border: 1px solid #ccc; border-radius: 8px;\">\r\n\r\n <label for=\"email\" style=\"font-weight: 600; display: block; margin-bottom: 6px;\">Business Email Address<span style=\"color: red;\"> *<\/span><\/label>\r\n <input type=\"email\" id=\"email\" name=\"email\" required pattern=\"[^@\\s]+@[^@\\s]+\\.[^@\\s]+\" style=\"width: 100%; padding: 12px; margin-bottom: 16px; border: 1px solid #ccc; border-radius: 8px;\">\r\n <small id=\"email-error\" style=\"color: red; font-size: 13px; display: none; margin-bottom: 16px;\"><\/small>\r\n\r\n <label for=\"phone\" style=\"font-weight: 600; display: block; margin-bottom: 6px;\">Phone Number<span style=\"color: red;\"> *<\/span><\/label>\r\n <input type=\"tel\" id=\"phone\" name=\"phone_number\" required style=\"width: 100%; padding: 12px; margin-bottom: 16px; border: 1px solid #ccc; border-radius: 8px;\">\r\n\r\n <label for=\"company\" style=\"font-weight: 600; display: block; margin-bottom: 6px;\">Company Name<span style=\"color: red;\"> *<\/span><\/label>\r\n <input type=\"text\" id=\"company\" required style=\"width: 100%; padding: 12px; margin-bottom: 16px; border: 1px solid #ccc; border-radius: 8px;\">\r\n\r\n <label for=\"website\" style=\"font-weight: 600; display: block; margin-bottom: 6px;\">Company Website<span style=\"color: red;\"> *<\/span><\/label>\r\n <input type=\"text\" id=\"website\" required style=\"width: 100%; padding: 12px; margin-bottom: 16px; border: 1px solid #ccc; border-radius: 8px;\">\r\n\r\n <label for=\"message\" style=\"font-weight: 600; display: block; margin-bottom: 6px;\">Message<\/label>\r\n <textarea id=\"message\" name=\"message\" style=\"width: 100%; padding: 12px; margin-bottom: 20px; border: 1px solid #ccc; border-radius: 8px;\"><\/textarea>\r\n\r\n <div class=\"h-captcha\" data-sitekey=\"bf8655b6-0344-4044-b2ee-88a859f298a8\" data-callback=\"onHCaptchaSuccess\" style=\"margin-bottom: 20px;\"><\/div>\r\n \r\n \r\n<div style=\"position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden;\">\r\n <label for=\"company_ref\">Leave this field empty<\/label>\r\n <input type=\"text\" id=\"company_ref\" name=\"company_ref\" tabindex=\"-1\" autocomplete=\"off\">\r\n<\/div>\r\n\r\n\r\n <button type=\"button\" id=\"submitBtn\" onclick=\"submitForm()\" disabled style=\"background-color: #25336b; color: white; width: 100%; padding: 14px; font-size: 16px; border: none; border-radius: 8px; font-weight: 600; cursor: not-allowed; opacity: 0.6;\">Submit<\/button>\r\n<\/form>\r\n\r\n<div id=\"snackbar\" style=\"margin-top: 20px;\"><\/div>\r\n\r\n<script src=\"https:\/\/hcaptcha.com\/1\/api.js\" async defer><\/script>\r\n\r\n<script>\r\n let isCaptchaVerified = false;\r\n const submitBtn = document.getElementById('submitBtn');\r\n submitBtn.disabled = true;\r\n submitBtn.style.opacity = '0.6';\r\n submitBtn.style.cursor = 'not-allowed';\r\n\r\n function onHCaptchaSuccess(token) {\r\n isCaptchaVerified = true;\r\n checkFormValidity();\r\n }\r\n\r\n function checkFormValidity() {\r\n const firstName = document.getElementById('firstName').value.trim();\r\n const lastName = document.getElementById('lastName').value.trim();\r\n const email = document.getElementById('email').value.trim();\r\n const phone = document.getElementById('phone').value.trim();\r\n const company = document.getElementById('company').value.trim();\r\n const website = document.getElementById('website').value.trim();\r\n const emailError = document.getElementById('email-error');\r\n\r\n const freeEmailDomains = [\r\n \"gmail.com\", \"yahoo.com\", \"hotmail.com\", \"aol.com\",\r\n \"outlook.com\", \"protonmail.com\", \"icloud.com\", \"mail.com\", \"msn.com\"\r\n ];\r\n\r\n const emailDomain = email.split('@')[1]?.toLowerCase();\r\n const isBusinessEmail = email && emailDomain && !freeEmailDomains.includes(emailDomain);\r\n\r\n if (email && !isBusinessEmail) {\r\n emailError.textContent = \"Please enter a business email address (no Gmail, Yahoo, etc.)\";\r\n emailError.style.display = \"block\";\r\n } else {\r\n emailError.textContent = \"\";\r\n emailError.style.display = \"none\";\r\n }\r\n\r\n const allValid = firstName && lastName && email && phone && company && website && isCaptchaVerified && isBusinessEmail;\r\n\r\n submitBtn.disabled = !allValid;\r\n submitBtn.style.opacity = allValid ? '1' : '0.6';\r\n submitBtn.style.cursor = allValid ? 'pointer' : 'not-allowed';\r\n}\r\n\r\n\r\n \/\/ Attach input listeners to all required fields\r\n ['firstName', 'lastName', 'email', 'phone', 'company', 'website'].forEach(id => {\r\n document.getElementById(id).addEventListener('input', checkFormValidity);\r\n });\r\n\r\n function submitForm() {\r\n \r\n const honeypot = document.getElementById('company_ref').value.trim();\r\n if (honeypot !== \"\") {\r\n \/\/ Detected a bot\r\n console.warn(\"Bot submission blocked (honeypot triggered).\");\r\n return; \/\/ silently stop submission\r\n }\r\n \r\n const formData = {\r\n first_name: document.getElementById('firstName').value,\r\n last_name: document.getElementById('lastName').value,\r\n email: document.getElementById('email').value,\r\n phone_number: document.getElementById('phone').value,\r\n company: document.getElementById('company').value,\r\n website: document.getElementById('website').value,\r\n message: document.getElementById('message').value,\r\n type: \"Contact_Us Request\",\r\n company_ref: honeypot\r\n };\r\n\r\n submitBtn.style.opacity = '0.5';\r\n\r\n fetch('https:\/\/9vvqwsjbwb.execute-api.us-east-1.amazonaws.com\/Prod\/contact', {\r\n method: 'POST',\r\n headers: { 'Content-Type': 'application\/json' },\r\n body: JSON.stringify(formData)\r\n })\r\n .then(res => res.ok ? res.json() : Promise.reject(res))\r\n .then(() => {\r\n showSnackbar(true, 'Request received! Our team will reach back to you shortly.');\r\n document.getElementById('json-form').reset();\r\n hcaptcha.reset();\r\n isCaptchaVerified = false;\r\n checkFormValidity(); \/\/ Recheck after reset\r\n })\r\n .catch(() => {\r\n showSnackbar(false, 'Error submitting form.');\r\n submitBtn.style.opacity = '1';\r\n });\r\n }\r\n\r\n function showSnackbar(success, message) {\r\n const snackbar = document.getElementById(\"snackbar\");\r\n snackbar.textContent = message;\r\n snackbar.style.backgroundColor = success ? \"#4CAF50\" : \"#f44336\";\r\n snackbar.style.color = \"#fff\";\r\n snackbar.style.padding = \"14px\";\r\n snackbar.style.borderRadius = \"6px\";\r\n snackbar.style.textAlign = \"center\";\r\n snackbar.style.display = \"block\";\r\n setTimeout(() => snackbar.style.display = \"none\", 4000);\r\n }\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-39a84a6 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"39a84a6\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-f89bb00\" data-id=\"f89bb00\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-871c5f0 elementor-widget elementor-widget-google_maps\" data-id=\"871c5f0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"google_maps.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-custom-embed\">\n\t\t\t<iframe loading=\"lazy\"\n\t\t\t\t\tsrc=\"https:\/\/maps.google.com\/maps?q=11490%20commerce%20park%20drive%2C%20reston&t=m&z=10&output=embed&iwloc=near\"\n\t\t\t\t\ttitle=\"11490 commerce park drive, reston\"\n\t\t\t\t\taria-label=\"11490 commerce park drive, reston\"\n\t\t\t><\/iframe>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Contact Us We would love to hear from you.Feel free to reach out using the below details. Address: 11490 Commerce Park Drive,Suite 230Reston, VA. 20191 Phone:\u00a0+1 (571) 401-1595Email:\u00a0info@cloudnovatech.com JSON Form First Name * Last Name * Business Email Address * Phone Number * Company Name * Company Website * Message Leave this field empty Submit<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_coblocks_attr":"","_coblocks_dimensions":"","_coblocks_responsive_height":"","_coblocks_accordion_ie_support":"","_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/cloudnovatech.com\/wp-json\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cloudnovatech.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cloudnovatech.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cloudnovatech.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/cloudnovatech.com\/wp-json\/wp\/v2\/comments?post=8"}],"version-history":[{"count":173,"href":"https:\/\/cloudnovatech.com\/wp-json\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":3524,"href":"https:\/\/cloudnovatech.com\/wp-json\/wp\/v2\/pages\/8\/revisions\/3524"}],"wp:attachment":[{"href":"https:\/\/cloudnovatech.com\/wp-json\/wp\/v2\/media?parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}