class Tawk {
            constructor(discount = "10", code = "Cupom") {
                if(window.location.href.includes("hoopcompany_ecommerce/preview"))
                    this.resetCookie();
                if ((this.getCookie("cupomWidget") == "" && this.getCookie("completedFastCupom39") == "expired")||0) {
                    this.discount = discount;
                    this.code = code;
                    this.initialise();
                   
                    this.createStyle();
                    console.log("Cupom Inicado");
                }
            }
            
            initialise() {
                const widgetContainer = document.createElement("div");
                widgetContainer.id = "widgetContainer";
                const buttonWidget = document.createElement("div");
                buttonWidget.id = "buttonWidget";
                buttonWidget.addEventListener("click", this.toggleOpen);
                const buttonWidgetMessage = document.createElement("p");
                buttonWidgetMessage.classList.add("h2");
                buttonWidgetMessage.textContent = "Cupom...";
                const messagebuttonWidget = document.createElement("div");
                messagebuttonWidget.id = "messagebuttonWidget";
                const text = document.createElement("div");
                text.classList.add("textWidget");
                const textH2 = document.createElement("p");
                textH2.classList.add("h2");
                textH2.textContent = "Cupom na primeira compra";
                const image = document.createElement("div");
                const textH4 = document.createElement("p");
                textH4.classList.add("h4");
                textH4.textContent = "Quer garantir um cupom de R$ 20 ?";
                const textButton = document.createElement("input");
                textButton.setAttribute("type", "submit");
                textButton.setAttribute("value", "Pegar Cupom");
                textButton.id = "getCupom";
                textButton.addEventListener("click", this.showForm);
                const textp = document.createElement("p");
                textp.textContent = "Nao mostrar novamente";
                textp.addEventListener("click", this.removeWidget);
                const widgetForm = document.createElement("div");
                widgetForm.id = "widgetForm";
                const form = document.createElement("form");
                form.setAttribute("action", "#");
                const labelName = document.createElement("label");
                labelName.textContent = "Nome:";
                labelName.setAttribute("for", "name");
                const inputName = document.createElement("input");
                inputName.setAttribute("type", "text");
                inputName.setAttribute("placeholder", "Digite seu nome");
                inputName.id = "hoopname";
                const labelEmail = document.createElement("label");
                labelEmail.textContent = "Email:";
                labelEmail.setAttribute("for", "email");
                const inputEmail = document.createElement("input");
                inputEmail.setAttribute("type", "text");
                inputEmail.setAttribute("placeholder", "Digite seu email");
                inputEmail.id = "email";
                const labelTele = document.createElement("label");
                labelTele.textContent = "Telefone:";
                labelTele.setAttribute("for", "cellphone");
                const inputTele = document.createElement("input");
                inputTele.setAttribute("type", "text");
                inputTele.setAttribute("placeholder", "Digite seu telefone");
                inputTele.id = "telephone";
                const termOfUseCupom = document.createElement("div");
                termOfUseCupom.classList.add("termOfUseCupom");
                const inputTermOfUseCupom = document.createElement("input");
                inputTermOfUseCupom.setAttribute("type","checkbox");
                inputTermOfUseCupom.id = "termOfUseCupom";
                const aTermOfUseCupom = document.createElement("a");
                aTermOfUseCupom.setAttribute("href","https://hoop-xls-engine.s3-sa-east-1.amazonaws.com/term-28532.pdf");
                aTermOfUseCupom.setAttribute("target", "_blank");
                const spanTermOfUseCupom = document.createElement("span");
                spanTermOfUseCupom.textContent = " Termo de Uso";
                const widgetFormButton = document.createElement("input");
                widgetFormButton.setAttribute("type", "submit");
                widgetFormButton.setAttribute("value", "Pegar Cupom");
                widgetFormButton.id = "showCupom";
                widgetFormButton.addEventListener("click", this.showCupom);
                const widgetCupom = document.createElement("div");
                widgetCupom.id = "widgetCupom";
                const widgetCupomH1 = document.createElement("p");
                widgetCupomH1.classList.add("h1");
                widgetCupomH1.textContent = this.code;
                const divName = document.createElement("div");
                const divEmail = document.createElement("div");
                const divTelephone = document.createElement("div");
                document.body.appendChild(widgetContainer);
                widgetContainer.appendChild(buttonWidget);
                buttonWidget.appendChild(buttonWidgetMessage);
                widgetContainer.appendChild(messagebuttonWidget);
                messagebuttonWidget.appendChild(text);
                text.appendChild(textH2);
                text.appendChild(image);
                image.innerHTML = '<svg width="120" height="100" viewBox="0 0 114 114" fill="none" xmlns="http://www.w3.org/2000/svg"><path class="dash-icon-voucher" fill-rule="evenodd" clip-rule="evenodd" d="M92.642 71.507a2.192 2.192 0 0 1 2.616-1.664l11.726 2.605a2.192 2.192 0 0 1-.951 4.28l-11.726-2.605a2.192 2.192 0 0 1-1.665-2.616z" fill="#FF9595"></path><path class="dash-icon-voucher" fill-rule="evenodd" clip-rule="evenodd" d="M72.545 91.905a2.192 2.192 0 0 1 2.805 1.322l3.746 10.423a2.193 2.193 0 0 1-4.127 1.483L71.224 94.71a2.192 2.192 0 0 1 1.321-2.805z" fill="#E4002B"></path><path class="dash-icon-voucher" fill-rule="evenodd" clip-rule="evenodd" d="M24.886 3.576a2.192 2.192 0 0 1 2.669 1.58l3.32 12.94a2.192 2.192 0 1 1-4.248 1.09l-3.32-12.941a2.192 2.192 0 0 1 1.58-2.669z" fill="#E3B6E4"></path><path class="dash-icon-voucher" fill-rule="evenodd" clip-rule="evenodd" d="M5.7 42.092c0-1.21.98-2.192 2.192-2.192h11.237a2.192 2.192 0 0 1 0 4.385H7.892a2.192 2.192 0 0 1-2.193-2.193z" fill="#FF9595"></path><path class="dash-icon-voucher" fill-rule="evenodd" clip-rule="evenodd" d="M84.86 82.311a2.192 2.192 0 0 1 3.097-.158l8.499 7.674a2.192 2.192 0 1 1-2.939 3.254l-8.498-7.673a2.192 2.192 0 0 1-.158-3.097z" fill="#E3B6E4"></path><path class="dash-icon-voucher" fill-rule="evenodd" clip-rule="evenodd" d="M44.339 3.564a2.192 2.192 0 0 1 1.643 2.629l-1.315 5.7a2.192 2.192 0 1 1-4.273-.986l1.316-5.7a2.192 2.192 0 0 1 2.629-1.643z" fill="#FFC4C0"></path><path class="dash-icon-voucher" fill-rule="evenodd" clip-rule="evenodd" d="M7.77 19.474a2.192 2.192 0 0 1 3.01-.743l14.945 9.033a2.192 2.192 0 0 1-2.268 3.752L8.512 22.484a2.192 2.192 0 0 1-.743-3.01z" fill="#E4002B"></path><path d="M103.059 40.28l-4.663-4.666a3.559 3.559 0 0 0-4.213-.579A10.762 10.762 0 0 1 79.55 20.402a3.528 3.528 0 0 0-.578-4.21L74.14 11.37a8.15 8.15 0 0 0-11.492 0L8.37 65.65a8.15 8.15 0 0 0 0 11.492l4.68 4.68a3.559 3.559 0 0 0 4.396.445A10.763 10.763 0 0 1 32.279 97.15a3.56 3.56 0 0 0 .472 4.395l4.52 4.503a8.148 8.148 0 0 0 11.51 0l54.278-54.28a8.145 8.145 0 0 0 0-11.487z" fill="#C599C6"></path><path d="M92.204 62.624l10.856-10.856a8.148 8.148 0 0 0 0-11.487l-4.663-4.668a3.559 3.559 0 0 0-4.213-.578A10.762 10.762 0 0 1 79.55 20.402a3.528 3.528 0 0 0-.579-4.21l-4.831-4.822a8.15 8.15 0 0 0-11.492 0L51.807 22.22l40.397 40.403z" fill="#E4002B"></path><path d="M43.66 51.047a1.989 1.989 0 0 1 3.527.392l9.076 24.181a1.992 1.992 0 0 1-1.018 2.49 1.993 1.993 0 0 1-2.714-1.102l-9.09-24.172a1.994 1.994 0 0 1 .218-1.788zm10.561 5.731a6.625 6.625 0 0 1 2.567-2.34 6.17 6.17 0 0 1 3.257-.654 7.154 7.154 0 0 1 5.641 3.67c.53.999.771 2.125.699 3.253a6.599 6.599 0 0 1-1.135 3.305 6.674 6.674 0 0 1-2.575 2.354 6.126 6.126 0 0 1-3.27.654 7.119 7.119 0 0 1-5.615-3.684 6.143 6.143 0 0 1-.703-3.261c.08-1.18.47-2.318 1.134-3.297zm8.351 5.486a3.113 3.113 0 0 0 .472-2.5 3.648 3.648 0 0 0-4.049-2.67 3.341 3.341 0 0 0-2.571 3.92 3.363 3.363 0 0 0 1.526 2.082 3.404 3.404 0 0 0 2.527.574 3.052 3.052 0 0 0 2.095-1.406zm-28.194 2.162a6.674 6.674 0 0 1 2.581-2.358 6.143 6.143 0 0 1 3.261-.654 7.171 7.171 0 0 1 5.628 3.702c.527 1 .769 2.124.699 3.252a7.062 7.062 0 0 1-3.71 5.646 6.136 6.136 0 0 1-3.27.654 7.119 7.119 0 0 1-5.611-3.68c-.533-1-.776-2.13-.703-3.26a6.674 6.674 0 0 1 1.13-3.302h-.005zm8.356 5.486a3.114 3.114 0 0 0 .476-2.5 3.422 3.422 0 0 0-1.526-2.1 3.366 3.366 0 0 0-2.523-.557 3.332 3.332 0 0 0-2.571 3.92 3.689 3.689 0 0 0 4.048 2.67 3.043 3.043 0 0 0 2.1-1.433h-.004zM88.915 61.053a1.78 1.78 0 0 1-1.26-.52l-3.145-3.15a1.78 1.78 0 1 1 2.532-2.5l3.114 3.114a1.78 1.78 0 0 1-1.26 3.038l.019.018zm-7.866-7.866a1.78 1.78 0 0 1-1.255-.52l-3.15-3.124a1.78 1.78 0 1 1 2.518-2.518l3.146 3.146a1.78 1.78 0 0 1-1.26 3.038v-.022zm-7.862-7.866a1.78 1.78 0 0 1-1.259-.52l-3.127-3.146a1.78 1.78 0 0 1 2.513-2.518l3.146 3.145a1.78 1.78 0 0 1-1.255 3.04h-.018zm-7.866-7.866a1.78 1.78 0 0 1-1.259-.52l-3.145-3.146a1.78 1.78 0 0 1 2.514-2.514l3.145 3.141a1.78 1.78 0 0 1-1.26 3.035l.005.004zm-7.866-7.862a1.78 1.78 0 0 1-1.259-.516l-3.145-3.145a1.78 1.78 0 0 1 2.518-2.514l3.145 3.146a1.78 1.78 0 0 1-1.259 3.038v-.009z" fill="#fff"></path></svg>';
                text.appendChild(textH4);
                text.appendChild(textButton);
                text.append(textp);
                messagebuttonWidget.appendChild(widgetForm);
                widgetForm.append(form);
                 if (1){
                    form.appendChild(divName);
                    divName.appendChild(labelName);
                    divName.appendChild(inputName);
                }
                if (1){
                    form.appendChild(divEmail);
                    divEmail.appendChild(labelEmail);
                    divEmail.appendChild(inputEmail);
                }
                if (1){
                    form.appendChild(divTelephone);
                    divTelephone.appendChild(labelTele);
                    divTelephone.appendChild(inputTele);
                }
                if (0){
                    form.appendChild(termOfUseCupom);
                    termOfUseCupom.appendChild(inputTermOfUseCupom);
                    termOfUseCupom.appendChild(aTermOfUseCupom);
                    aTermOfUseCupom.appendChild(spanTermOfUseCupom);
                }
                form.appendChild(widgetFormButton);
                messagebuttonWidget.appendChild(widgetCupom);
                widgetCupom.appendChild(widgetCupomH1);
            }
            createStyle() {
                const styleTag = document.createElement("style");
                document.head.appendChild(styleTag);
                styleTag.innerHTML = " #widgetContainer *{\n" + " margin: 0px;\n" + " padding: 0px;\n" + " font-family: sans-serif;height: unset;\n" + " }\n" + " #widgetContainer{\n" + " position: fixed;\n" + " display: flex;\n" + " left: 0px;\n" + " top:50%; margin-top: -130px;\n" + " z-index: 100; line-height: normal;\n" + " }\n" + " #buttonWidget{\n" + " background-color: #4081d1;\n" + "order: 1;\n"+ " width: 60px;\n" + " height: 260px;\n" + " display: flex;\n" + " }\n" + " #buttonWidget .h2{\n" + " color: white;\n" + " align-self: center;\n" + " transform: rotate(-90deg);\n" + " margin-left: -25px;\n" + " font-size: 25px;\n" + " z-index: 1000;\n" + " }\n" + " #messagebuttonWidget{\n" + " display: block;\n" +  "order: 2;\n"+ " left: 60px ;\n" + " visibility: hidden;\n" + " padding-left: 15px;\n" + " background-color: whitesmoke;\n" + " width: 0px;\n" + " height: 260px;\n" + " padding-right: 15px;\n" + " transition: 0.4s;\n" + " overflow-x: hidden;\n" + " z-index: 1000;\n" + " }\n" + " #widgetContainer.active #messagebuttonWidget{\n" + " visibility: visible;\n" + " width: 350px;\n" + "\n" + " }\n" + " #messagebuttonWidget .textWidget{\n" + " margin-top: 15px;\n" + " text-align: center;\n" + " transition: 1s;\n" + " opacity: 1;\n" + " }#messagebuttonWidget .h2,.h4{color:black}\n" + " #messagebuttonWidget .textWidget p{\n" + " color: dimgrey;\n" + " cursor: pointer; font-size: 1rem\n" + " }\n" + " #messagebuttonWidget .textWidget p:hover{\n" + " color: slategray;\n" + " }\n" + " #messagebuttonWidget .textWidget .h2{\n" + " font-size: 1.3rem;\n" + " }\n" + " #messagebuttonWidget.active .textWidget{\n" + " opacity: 0;\n" + " visibility: hidden;\n" + " }\n" + "\n" + " #widgetContainer input[type=submit] {\n" + " width: 100%;\n" + " background-color: #4081d1;\n" + " color: white;\n" + " padding: 14px 20px;\n" + " margin: 8px 0;\n" + " border: none;\n" + " border-radius: 4px;\n" + " cursor: pointer;\n" + " font-size: 1.1rem;\n" + " }\n" + "\n" + " #widgetForm {\n" + " display: none;\n" + " padding-top: 7px;\n" + " transition: 1s;\n" + " opacity: 1;\n" + " } .termOfUseCupom{text-align: center;} .termOfUseCupom input{-webkit-appearance: checkbox;}\n" + " #messagebuttonWidget.active #widgetForm {\n" + " opacity: 0;\n" + " visibility: hidden;\n" + " }\n" + " #widgetForm input[type=text], select {\n" + " width: 100%;\n" + " padding: 7px 20px;\n" + " margin: 5px 0;\n" + " display: inline-block; height: 30px;\n" + " border: 1px solid #ccc;\n" + " border-radius: 4px;\n" + " box-sizing: border-box;height: unset;\n" + " }\n" + "\n" + " #widgetForm input[type=submit] {\n" + " width: 100%;\n" + " background-color: #4081d1;\n" + " color: white;\n" + " padding: 8px 20px;\n" + " margin: 8px 0;\n" + " border: none;\n" + " border-radius: 4px;\n" + " cursor: pointer;\n" + " }\n" + "\n" + " #widgetForm input[type=submit]:hover {\n" + " background-color: #4081d1;\n" + " }\n" + " #widgetForm label{\n" + " font-size: 1rem;\n" + " }\n" + "\n" + " #widgetCupom{\n" + " display: none;\n" + " /*display: flex;*/\n" + " align-items: center;\n" + " justify-content: center;\n" + " height: 100%;\n" + " }\n" + "\n" + " #widgetCupom .h1{\n" + " background-color: #f3191975;\n" + " padding: 12px 20px;\n" + " font-weight: 900;\n" + " text-align: center; border: solid 2px; border-style: dashed;\n" + " }#widgetForm form{ display: flex; flex-flow: column; height: 230px; place-content: space-between; padding: 10px; } @media screen and (max-device-width: 900px) { #buttonWidget{ width: 45px; height:200px; display:flex; justify-content: center; align-items: center;}#buttonWidget .h2 { margin-left: unset;} #widgetContainer{ margin-top: -100px;} #widgetContainer.active #messagebuttonWidget{ width: 260px;} #messagebuttonWidget{height: 200px; left:45px;} #messagebuttonWidget .textWidget svg{height:80px} #messagebuttonWidget .textWidget .h2{font-size: 1.1rem;} #messagebuttonWidget .textWidget .h4{font-size: 0.9rem;}#messagebuttonWidget .textWidget p{font-size: 0.9rem;} #widgetContainer input[type=submit]{padding: 4px 20px} #widgetForm{padding: unset;} #widgetForm form{ padding: 10px 0px; height: 180px} #widgetForm form div{ height: 50px; margin-bottom: 5px;} #widgetForm input[type=text]{padding: 3px 20px; margin: unset; }}";
            }
            toggleOpen(event) {
                document.getElementById("widgetContainer").classList.toggle("active");
            }
            showForm() {
                document.getElementById("messagebuttonWidget").classList.add("active");
                setTimeout(function() {
                    document.getElementById("messagebuttonWidget").classList.remove("active");
                    document.getElementsByClassName("textWidget")[0].style.display = "none";
                    document.getElementById("widgetForm").style.display = "block";
                }, 1100);
            }
            showCupom(event) {
                event.preventDefault();
                var nome = document.getElementById("hoopname") == null ? null : document.getElementById("hoopname");
                var email = document.getElementById("email") == null ? null : document.getElementById("email");
                var telephone = document.getElementById("telephone") == null ? null : document.getElementById("telephone");
                var aux = tawk.validateForm(nome, email, telephone);
                if (aux) {
                    document.getElementById("messagebuttonWidget").classList.add("active");
                    setTimeout(function() {
                        document.getElementById("widgetForm").style.display = "none";
                        document.getElementById("widgetCupom").style.display = "flex";
                    }, 1100);
                    tawk.setCookie("cupomWidget39", "1", "30");
                    tawk.sendEvent(nome, email, telephone);
                }
            }
            validateForm(nome, email, telephone) {
                if (nome !== null){
                    nome.style.border = "";
                }
                if (email !== null){
                    email.style.border = "";
                }
                if (telephone !== null){
                    telephone.style.border = "";
                }
                if (1 && nome.value.length < 2) {
                    nome.style.border = "solid red 1px";
                    return false;
                } else if (1 && email.value.length < 8) {
                    email.style.border = "solid red 1px";
                    return false;
                } else if (1 && telephone.value.length < 8) {
                    telephone.style.border = "solid red 1px";
                    return false;
                } else if (0 && !document.getElementById("termOfUseCupom").checked){
                    return false;
                }
                return true;
            }
            removeWidget() {
                tawk.setCookie("cupomWidget39", "1", "1");
                document.getElementById("widgetContainer").style.display = "none";
            }
            getCookie(cname) {
                var name = cname + "=";
                var decodedCookie = decodeURIComponent(document.cookie);
                var ca = decodedCookie.split(";");
                for (var i = 0; i < ca.length; i++) {
                    var c = ca[i];
                    while (c.charAt(0) == " ") {
                        c = c.substring(1);
                    }
                    if (c.indexOf(name) == 0) {
                        return c.substring(name.length, c.length);
                    }
                }
                return "";
            }
            setCookie(cname, cvalue, exdays) {
                var d = new Date();
                d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
                var expires = "expires=" + d.toUTCString();
                document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
            }
            sendEvent(inputName, inputEmail, inputPhone) {
            
                var name = null;
                var email = null;
                var phone = null;
        
                if (inputName !== null){
                    name = inputName.value;
                }if (inputEmail !== null){
                    email = inputEmail.value;
                }if (inputPhone !== null){
                    phone = inputPhone.value;
                }
                function formatParams(params) {
                    return "?" + Object.keys(params).map(function(key) {
                        return key + "=" + encodeURIComponent(params[key])
                    }).join("&")
                }
                var request = new XMLHttpRequest();
                var token = "08f61930e047187d91df1ec6874a7f87";
                const endpoint = "https://ecomm.hoopcompany.com/api/hoopcompany_leadform/" + token;
                var params = {
                    topic_id: 663,
                    name: name,
                    email: email,
                    whats: phone,
                    page_name: document.title,
                    page_url: window.location.href,
                    external_ref: tawk.getCookie("external_ref"),
                    type: "FirstSaleCoupon",
                    origin:"first_sale_coupon"
                };
                var url = endpoint + formatParams(params);
                request.onreadystatechange = function() {
                    if (request.readyState == 4) {
                        console.log(request);
                    }
                };
                request.open("POST", url);
                request.send();
            }
        }
        const tawk = new Tawk("R$ 20", "EUQUERO20");