Untitled
unknown
plain_text
2 years ago
15 kB
2
Indexable
Never
<script> (function () { try { /* main variables */ var debug = 0; var variation_name = ""; /* all Pure helper functions */ function waitForElement(selector, trigger, delayInterval, delayTimeout){ var interval = setInterval(function () { if ( document && document.querySelector(selector) && document.querySelectorAll(selector).length > 0 ) { clearInterval(interval); trigger(); } }, delayInterval); setTimeout(function () { clearInterval(interval); }, delayTimeout); } function live(selector, event, callback, context) { // helper for enabling IE 8 event bindings function addEvent(el, type, handler) { if (el.attachEvent) el.attachEvent("on" + type, handler); else el.addEventListener(type, handler); } // matches polyfill this && this.Element && (function(ElementPrototype) { ElementPrototype.matches = ElementPrototype.matches || ElementPrototype.matchesSelector || ElementPrototype.webkitMatchesSelector || ElementPrototype.msMatchesSelector || function(selector) { var node = this, nodes = (node.parentNode || node.document).querySelectorAll(selector), i = -1; while (nodes[++i] && nodes[i] != node); return !!nodes[i]; }; })(Element.prototype); // live binding helper using matchesSelector function live(selector, event, callback, context) { addEvent(context || document, event, function(e) { var found, el = e.target || e.srcElement; while (el && el.matches && el !== context && !(found = el.matches(selector))) el = el.parentElement; if (found) callback.call(el, e); }); } live(selector, event, callback, context); } function getCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for(var i=0;i < ca.length;i++) { var c = ca[i]; while (c.charAt(0)==' ') c = c.substring(1,c.length); if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); } return null; } function setCookie(name,value,days) { var expires = ""; if (days) { var date = new Date(); date.setTime(date.getTime() + (days*24*60*60*1000)); expires = "; expires=" + date.toUTCString(); } document.cookie = name + "=" + (value || "") + expires + "; path=/"; } var formPopup =''+ ' <div class="eg-form-popup">'+ ' <div class="eg-form-popup-inr">'+ ' <div class="eg-form-container">'+ ' <span class="eg-form-close">×</span>'+ ' <form method="POST" class="edb-survey gf" id="edb-survey" data-step="1">'+ ' <div id="step1" class="fg" data-section="1"><label class="fl">Qu\'est-ce qui vous a poussé à acheter sur notre site ?</label><textarea type="text" name="motivation" placeholder="Votre réponse..." rows="4" class="fc"></textarea></div>'+ ' <div id="step2" class="fg" data-section="2"><label class="fl">Avez-vous considéré d\'autres enseignes avant d\'acheter sur notre site ? Si oui, quelles enseignes ?</label><textarea type="text" name="competition" placeholder="Votre réponse..." rows="4" class="fc"></textarea></div>'+ ' <div id="step3" class="fg" data-section="3"><label class="fl">Qu\'est-ce qui a failli vous empêcher d\'acheter sur notre site ?</label><textarea type="text" name="objection" placeholder="Votre réponse..." rows="4" class="fc"></textarea></div>'+ ' <div id="step4" class="fg" data-section="4"><label class="fl">Quelle était la source de frustration principale quand vous recherchiez un produit correspondant à votre besoin ?</label><textarea type="text" name="product" placeholder="Votre réponse..." rows="4" class="fc"></textarea></div>'+ ' <div id="step5" class="fg" data-section="5"><label class="fl">Que peut-on faire pour améliorer la prise de commande sur notre site ?</label><textarea type="text" name="checkout" placeholder="Votre réponse..." rows="4" class="fc"></textarea></div>'+ ' <div id="step6" class="fg" data-section="6"><label class="fl">Recommanderiez-vous notre site à vos proches ?</label><label class="flradio"><input type="radio" name="nps" value="1">1</label><label class="flradio"><input type="radio" name="nps" value="2">2</label><label class="flradio"><input type="radio" name="nps" value="3">3</label><label class="flradio"><input type="radio" name="nps" value="4">4</label><label class="flradio"><input type="radio" name="nps" value="5">5</label><label class="flradio"><input type="radio" name="nps" value="6">6</label><label class="flradio"><input type="radio" name="nps" value="7">7</label><label class="flradio"><input type="radio" name="nps" value="8">8</label><label class="flradio"><input type="radio" name="nps" value="9">9</label><label class="flradio"><input type="radio" name="nps" value="10">10</label></div>'+ ' <div class="edb-action" ><div class="edb-btn" id="previous">Précédent</div><div class="edb-btn" id="next">Suivant</div><button class="edb-btn" id="close" >Terminer</button></div>'+ ' </form>'+ ' <p class="eg-thanks">Nous vous remercions pour votre participation</p>'+ ' </div>'+ ' </div>'+ ' </div>'; var offset; function createSession() { if(getCookie('firstVisit') == null) { setCookie('firstVisit', '1',365); } } function init() { document.querySelector('body footer').insertAdjacentHTML('afterend', formPopup); live(".eg-form-popup .eg-form-close", "click", function() { createSession(); document.querySelector('body').classList.add('form-popup-hide'); }); live('.eg-form-popup button','click',function(e){ e.preventDefault(); //var email = document.querySelector('input[type="email"]').value; //var name= document.querySelector('input[name="Name"]').value; var motivation= document.querySelector('textarea[name="motivation"]').value; var competition= document.querySelector('textarea[name="competition"]').value; var objection= document.querySelector('textarea[name="objection"]').value; var product= document.querySelector('textarea[name="product"]').value; var checkout= document.querySelector('textarea[name="checkout"]').value; var nps; var spn= document.querySelector('input[name="nps"]:checked'); console.log(spn); if (typeof(spn) != 'undefined' && spn != null) { console.log('spn known'); var nps = spn.value; } else { console.log('spn unknown, set value'); var nps = "none"; } console.log(nps); sendData(motivation,competition,objection,product,checkout,nps); }); } function sendData(motivation,competition,objection,product,checkout,nps){ var url = "https://script.google.com/macros/s/AKfycbzzeQM06h-TXkXhi4fa1qxHayf__JwVAF0Fd1WS4IkwzkuLIPc6rwcObuwB5K1oaYqt/exec"; var XHR = new XMLHttpRequest(), FD = new FormData(); // Push our data into our FormData object //FD.append('Email',email); //FD.append('Name',name); FD.append('Motivation',motivation); FD.append('Competition',competition); FD.append('Objection',objection); FD.append('Product',product); FD.append('Checkout',checkout); FD.append('NPS',nps); XHR.onreadystatechange = function () { if (this.readyState == 4 && this.status == 200) { //console.log('success'); document.querySelector('.eg-form-popup form').style.display = "none"; hideForm(); } }; // Set up our request XHR.open('POST', url); // Send our FormData object; HTTP headers are set automatically XHR.send(FD); } function hideForm(){ createSession(); document.querySelector('.eg-form-popup .eg-thanks').style.display='block'; /*setTimeout(function(){ document.querySelector('.eg-form-popup').remove(); },5000);*/ } document.addEventListener('click', function (event) { //console.log("clicked"); if(!event.target.matches('.edb-survey #next, .edb-survey #previous')) return; //console.log('matched'); var cur = document.querySelector('.edb-survey').getAttribute('data-step'); //console.log('data-step =>', cur); var act = cur; if(event.target.matches('.edb-survey #next')) { var act = parseInt(cur) + 1; } else if (event.target.matches('.edb-survey #previous')) { var act = parseInt(cur) - 1; } //console.log('new step =>', act); document.querySelector('.edb-survey').setAttribute('data-step', act); //console.log('step changed'); }); document.addEventListener('click', function (event) { //console.log("clicked"); if(!event.target.matches('.flradio')) return; //console.log('matched'); var flr = document.querySelectorAll('.flradio'); for(f=0;f<flr.length;f++) { if(flr[f].classList.contains('flradiochecked')) { flr[f].classList.remove('flradiochecked'); } } event.target.classList.add('flradiochecked'); var cur = document.querySelector('.edb-survey').getAttribute('data-step'); //console.log('data-step =>', cur); var act = cur; if(event.target.matches('.edb-survey #next')) { var act = parseInt(cur) + 1; } else if (event.target.matches('.edb-survey #previous')) { var act = parseInt(cur) - 1; } //console.log('new step =>', act); document.querySelector('.edb-survey').setAttribute('data-step', act); //console.log('step changed'); }); /* Initialise variation */ //if(!getCookie('firstVisit')){ waitForElement("body footer", init, 100, 25000); //} } catch (e) { if (debug) console.log(e, "error in Test" + variation_name); } })(); </script> <style> html body.form-popup-hide .eg-form-popup { display: none; } .eg-form-popup { position: fixed; bottom: 20px; right: 20px; width: auto; z-index: 999; max-width: 600px; } .eg-form-popup .eg-form-popup-inr { background: #000000; padding: 15px; border-radius: 3px; -webkit-box-shadow: 0px 0px 12px 0px rgb(255 255 255 / 20%); -moz-box-shadow: 0px 0px 12px 0px rgba(255,255,255,0.20); box-shadow: 0px 0px 12px 0px rgb(255 255 255 / 20%); } .eg-form-container .eg-form-close { position: absolute; top: 18px; right: 18px; line-height: 13px; display: flex; align-items: center; justify-content: center; font-size: 26px; padding: 2px; cursor: pointer; color: #ffffff; } .eg-form-container .eg-form-close:hover { color: #fae016; } .eg-form-popup input { padding: 5px 5px 5px 10px; margin-right: 5px; height: 35px; border: none; } .eg-form-popup button { background: #fae016; padding: 0px 11px; height: 35px; box-sizing: border-box; border: 1px solid #fae016; } .eg-form-popup button:hover { border: 1px solid #fae016; background: #000000; color: #fae016; } .eg-form-popup input:focus { outline: none; } @media screen and (max-width:600px) { html body .eg-form-popup { bottom: 0px; right: 0px; width: 100%; } html body .eg-form-popup .eg-form-popup-inr form { flex-direction: column; display: flex; width: 100%; margin: 0 auto; } html body .eg-form-popup input { margin-right: 0px; margin-bottom: 10px; } /*.eg-form-popup .eg-form-popup-inr { padding-top: 30px; padding-right: 15px; }*/ .eg-form-popup .eg-form-popup-inr { border-radius: 0px; } } .eg-thanks { color: #ffff; text-align: center; margin: 0px; font-size: 20px; font-weight: 500; display: none; padding-right: 35px; } form.gf { font-family: Rubik,sans-serif; font-size: 1.6rem; line-height: 1.3; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; text-size-adjust: 100%; text-rendering: optimizeLegibility; } .edb-survey .edb-button { display: inline-block; } .edb-survey[data-step='6'] .edb-action button { width: 50%; } .edb-survey .fg { display: none; } .edb-survey[data-step='1'] .fg[data-section='1'], .edb-survey[data-step='2'] .fg[data-section='2'], .edb-survey[data-step='3'] .fg[data-section='3'], .edb-survey[data-step='4'] .fg[data-section='4'], .edb-survey[data-step='5'] .fg[data-section='5'], .edb-survey[data-step='6'] .fg[data-section='6'] { display: block; } .edb-survey .edb-action { display: flex; justify-content: end; } .edb-survey .edb-action button#close { display: none; } .edb-survey[data-step='6'] .edb-action button#close { display: block; } .edb-survey[data-step='6'] .edb-action #next { display: none; } .edb-survey[data-step='1'] .edb-action #previous { display: none; } .gtm-popup.gtm-config .popup.bottomright { background: #000; padding: 15px; color: #fff; font-family: Rubik,sans-serif; font-size: 1.6rem; line-height: 1.3; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; text-size-adjust: 100%; text-rendering: optimizeLegibility; } .gtm-popup.gtm-config .popup .close { font-size: 28px; color: #585858; opacity: 1; font-weight: 100; border: 2px solid #585858; border-radius: 50%; height: 30px; width: 30px; text-align: center; line-height: 26px; top: 10px; right: 10px; } .gtm-popup.gtm-config .popup .close:hover { color: #fae017; border-color: #fae017; opacity: 1; } form.gf .fl { text-align: left; font-size: 20px; line-height: 1.1; padding-right: 35px; margin-bottom: 15px !important; margin-top: 0px; color: #fff; cursor: initial; } form.gf .fc { border: 0px solid #000; font-family: Rubik,sans-serif; font-size: 18px; padding: 10px 12px; line-height: 1.3; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; text-size-adjust: 100%; text-rendering: optimizeLegibility; display: block; width: 100%; border-radius: 3px; margin-bottom: 15px; } .edb-survey #previous { background: #000000; border: 2px solid #fae017; border-radius: 3px; width: 50%; margin-right: 5px; color: #fae017; text-transform: uppercase; font-weight: 500; padding: 12px 15px 10px; text-align: center; cursor: pointer; } .edb-survey #next { background: #fae017; border: 1px solid #fae017; border-radius: 3px; width: 50%; margin-left: 5px; color: #000; text-transform: uppercase; font-weight: 500; padding: 12px 15px 10px; text-align: center; cursor: pointer; } .edb-survey[data-step='6'] .edb-action button#close { background: #fae017; border: 1px solid #fae017; border-radius: 3px; width: 50%; color: #000; text-transform: uppercase; font-weight: 500; padding: 10px; height: auto; margin: 0; margin-left: 5px; font-size: inherit; line-height: inherit; } .flradio { border: 2px solid #fae017; border-radius: 3px; color: #fae017; text-align: center; padding: 10px 10px; margin-bottom: 20px; margin-right: 5px; } .flradio input[type=radio] { display: none; } .flradio:hover, .flradiochecked { background: #fae017; color: #000; } #step6 label.fl { display: block; } </style>