function getIP(json) {
  document.getElementById("ip").value = json.ip
}

var fields = [];
var strform = '{"class":[],"styles":[],"css":[{"name":""}],"old_css":[{"name":".iti{width: 100%;margin-top: -25px;margin-bottom: 15px;}.container-vN55bQGB57{margin: 0 auto;width: 100%;padding: 0 15px;}.container-vN55bQGB57 .title-vN55bQGB57{font-size: 30px;line-height: 36px;font-weight: 700;margin: 15px 0;text-align: center;font-family: Segoe UI;}.container-vN55bQGB57 .form-vN55bQGB57{background-color:#fff;padding: 5px 10px;border-radius: 30px;font-family: Segoe UI;}.container-vN55bQGB57 .col-12-vN55bQGB57{position: relative;width: 100%;min-height: 1px;margin-bottom:15px;}.container-vN55bQGB57 .label-vN55bQGB57{display: inline-block;margin-bottom: .5rem;}.container-vN55bQGB57  .btn-vN55bQGB57{display:block;margin:0 auto;background-color:#1f648b;color:#fff;border-radius:0;border:0;padding:10px 35px;outline:none;}.container-vN55bQGB57 .textarea-vN55bQGB57{resize:none;border:1px solid #aaa;border-radius:15px;outline:none;color:darkgray;background-color:#fff;}.container-vN55bQGB57 .input-vN55bQGB57{height:40px;width:100%;padding:0 20px;border: 1px solid #aaa;border-radius:50px;color:darkgray!important;outline:none;}.container-vN55bQGB57 .g-recaptcha{display:flex;justify-content:center;}.container-vN55bQGB57 .terms-container{display:flex;justify-content:center; align-items:center}"}]}'
var attributesForm = JSON.parse(strform)

var meta = document.createElement('meta');
meta.name = "csrf-token";
meta.content = "PpJjSujtedL6jcCOOZbOKEfxuxHSFIdQxunLrkvD";
document.getElementsByTagName('head')[0].appendChild(meta);

var element = document.getElementById("r8hPuX4P3rOTBXi")
element.setAttribute("class", "formw-container")
var div = document.createElement("div")
div.setAttribute("class", "formw-title-container")

var scriptNational = document.createElement("script")
scriptNational.setAttribute("src","https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/js/intlTelInput.min.js")
scriptNational.defer = true
scriptNational.async = true
var styleNational = document.createElement("link")
styleNational.setAttribute("rel","stylesheet")
styleNational.setAttribute("href","https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/css/intlTelInput.css")

var title = document.createElement("H3")
title.setAttribute("class", "forw-title")
var elem = document.createTextNode("Bienvenido a Quobono dejenos sus datos")
title.appendChild(elem)
div.appendChild(title)
element.appendChild(div)

element.appendChild(scriptNational)
element.appendChild(styleNational)

var style = document.createElement('STYLE')
var css = ""
attributesForm.css.forEach(function (value) {
css = css + value.name + " "
})
style.innerHTML = css;
div.appendChild(style)

var style_new = document.createElement('STYLE')
var css_new = "@import  url(https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap);:root{--w-border-color:#dee2e6;--w-border-radius:.3rem;--w-link-color:#8bb450;--w-primary-color:#8bb450}.d-block{display:block!important}.ms-auto,.mx-auto{margin-left:auto!important}.me-auto,.mx-auto{margin-right:auto!important}.formw-container *,.formw-container ::after,.formw-container ::before{box-sizing:border-box}.formw-container{font-family:Montserrat,sans-serif;font-optical-sizing:auto;margin:auto 1rem;padding:1rem;position:relative;display:flex;flex-direction:column;min-width:0;word-wrap:break-word;border:1px solid var(--w-border-color);border-radius:.75rem}.formw-title-container .forw-title{font-weight:700;text-align:center;font-size:1.5rem;margin:.5rem 0}.formw-container .nav{display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}.formw-container .nav-tabs{border-bottom:1px solid var(--w-border-color);margin:0 0 1rem}.formw-container .nav-fill .nav-item,.formw-container .nav-fill>.nav-link{flex:1 1 auto;text-align:center}.formw-container .nav-tabs .nav-link{margin-bottom:calc(-1* 1px);border:0;border-top-left-radius:var(--w-border-radius);border-top-right-radius:var(--w-border-radius);display:block;padding:.5rem;color:var(--w-link-color);text-decoration:none;background:0 0;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;cursor:pointer}.formw-container .nav-tabs .nav-link.active{border-bottom:1px solid var(--w-primary-color)!important;font-weight:700}.formw-container .formw-input-wrapper{margin:0 0 1rem}.formw-container label{display:block;margin-bottom:.25rem;font-weight:500}.formw-container .form-control,.formw-container select,.formw-container textarea{display:block;width:100%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#212529;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;background-clip:padding-box;border:1px solid #dee2e6;border-radius:.35rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;margin:0;font-family:inherit}.invalid{border:1px solid red!important}.formw-button-container{display:flex;justify-content:space-between;text-align:right}.formw-button-container button{margin:1rem 0}.formw-container .btn{font-family:inherit;font-size:1rem;font-weight:400;display:inline-block;padding:.5rem .75rem;text-align:center;text-decoration:none;vertical-align:middle;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;border:1px solid var(--w-border-color);border-radius:var(--w-border-radius);background-color:#fff;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}.formw-container .btn.d-block{color:#fff;background-color:var(--w-primary-color)!important}.formw-container .formw-check-item{display:flex;align-items:center;gap:.5rem;margin:.3rem 0}.formw-container .formw-check-item input{margin:0;height:1rem;width:1rem}.formw-container .formw-check-item label{margin-bottom:0}.formw-container .btn-outline-primary{border:1px solid var(--w-primary-color);color: var(--w-primary-color)}.formw-container .btn-outline-primary:hover{color:#fff;background-color:var(--w-primary-color);border-color:var(--w-primary-color)}@media (min-width:992px){.formw-container{flex:0 0 auto;max-width:460px;margin:auto}}"
style_new.innerHTML = css_new;
div.appendChild(style_new)

var form = document.createElement("FORM")
var classes = ""
attributesForm.class.forEach( function (value) {
classes = classes + value.name + " "
})
form.setAttribute("class", classes)
var styless = ""
attributesForm.styles.forEach( function (value) {
styless = styless + value.name + " "
})
form.setAttribute("style",styless)
form.setAttribute("id","form")
form.setAttribute("method","get")
form.setAttribute("action","https://forms.woobsing.co/registerForm")

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "id")
x.setAttribute("value", "cCWfhBfkrKt31cb")
form.appendChild(x)

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "_token")
x.setAttribute("value", "PpJjSujtedL6jcCOOZbOKEfxuxHSFIdQxunLrkvD")
form.appendChild(x)

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "latitude")
x.setAttribute("id", "latitude")
x.setAttribute("value", "")
form.appendChild(x)

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "longitude")
x.setAttribute("id", "longitude")
x.setAttribute("value", "")
form.appendChild(x)

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "ip")
x.setAttribute("id", "ip")
x.setAttribute("value", "")
form.appendChild(x)

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "host")
x.setAttribute("id", "host")
x.setAttribute("value", window.location.host)
form.appendChild(x)

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "notifications")
x.setAttribute("id", "notifications")
x.setAttribute("value", "false")
form.appendChild(x)

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "navigator")
x.setAttribute("id", "navigator")
x.setAttribute("value", "")
form.appendChild(x)

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "isp")
x.setAttribute("id", "isp")
x.setAttribute("value", "")
form.appendChild(x)

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "country")
x.setAttribute("id", "country")
x.setAttribute("value", "")
form.appendChild(x)

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "countryCode")
x.setAttribute("id", "countryCode")
x.setAttribute("value", "")
form.appendChild(x)

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "timezone")
x.setAttribute("id", "timezone")
x.setAttribute("value", "")
form.appendChild(x)

var x = document.createElement("INPUT");
x.setAttribute("type", "hidden")
x.setAttribute("name", "zip")
x.setAttribute("id", "zip")
x.setAttribute("value", "")
form.appendChild(x)

var ul = document.createElement("ul")
ul.setAttribute("class", "nav nav-tabs nav-fill")
    var li = document.createElement("li");
  li.setAttribute('class', 'nav-item')

  var ahref = document.createElement('a');
  ahref.setAttribute('onclick', 'nextPrev(1)')
  ahref.setAttribute('class', 'nav-link w-nav')
  ahref.innerHTML = 'Paso 1'

  li.appendChild(ahref)
  ul.appendChild(li)
    var li = document.createElement("li");
  li.setAttribute('class', 'nav-item')

  var ahref = document.createElement('a');
  ahref.setAttribute('onclick', 'nextPrev(1)')
  ahref.setAttribute('class', 'nav-link w-nav')
  ahref.innerHTML = 'Paso 2'

  li.appendChild(ahref)
  ul.appendChild(li)
    var li = document.createElement("li");
  li.setAttribute('class', 'nav-item')

  var ahref = document.createElement('a');
  ahref.setAttribute('onclick', 'nextPrev(1)')
  ahref.setAttribute('class', 'nav-link w-nav')
  ahref.innerHTML = 'Nuevo Paso'

  li.appendChild(ahref)
  ul.appendChild(li)
form.appendChild(ul)

  var div = document.createElement('div')
  div.setAttribute('class', 'tab -w-tab')
    form.appendChild(div)
var str = '{"idControl":"identification_number","nameControl":"identification_number","label":"N\u00famero identificaci\u00f3n","class":[{"name":"form-control"}],"styles":[],"options":"","required":false,"id":1,"type_control_id":1,"name":"text","placeholder":"N\u00famero identificaci\u00f3n"}';
var attributes = JSON.parse(str.replace(/"/g,'"'));
var label = document.createElement("LABEL")
var t = document.createTextNode(attributes.label)
label.appendChild(t)
var wrapper = document.createElement("div")
wrapper.setAttribute("class", "formw-input-wrapper")
wrapper.appendChild(label)
div.appendChild(wrapper)
form.appendChild(div)

var x = document.createElement("INPUT");
x.setAttribute("type", "text")
x.setAttribute("name", attributes.nameControl)
x.setAttribute("required", "required")
x.setAttribute("id", attributes.idControl)
x.setAttribute("value", "")
var classes = ""

attributes.class.forEach( function (value) {
classes = classes + value.name + " "
})
x.setAttribute("class", classes)
var styless = ""
attributes.styles.forEach( function (value) {
styless = styless + value.name + " "
})
x.setAttribute("style", styless)
wrapper.appendChild(x)
div.appendChild(wrapper)
form.appendChild(div)
element.appendChild(form)
fields.push(attributes.nameControl);
  var div = document.createElement('div')
  div.setAttribute('class', 'tab -w-tab')
      div.style.cssText = 'display:none !important';
    form.appendChild(div)
var str = '{"idControl":"first_name","nameControl":"first_name","label":"Nombres","class":[{"name":"form-control"}],"styles":[],"options":"","required":false,"id":1,"type_control_id":1,"name":"text","placeholder":"Nombres"}';
var attributes = JSON.parse(str.replace(/"/g,'"'));
var label = document.createElement("LABEL")
var t = document.createTextNode(attributes.label)
label.appendChild(t)
var wrapper = document.createElement("div")
wrapper.setAttribute("class", "formw-input-wrapper")
wrapper.appendChild(label)
div.appendChild(wrapper)
form.appendChild(div)

var x = document.createElement("INPUT");
x.setAttribute("type", "text")
x.setAttribute("name", attributes.nameControl)
x.setAttribute("required", "required")
x.setAttribute("id", attributes.idControl)
x.setAttribute("value", "")
var classes = ""

attributes.class.forEach( function (value) {
classes = classes + value.name + " "
})
x.setAttribute("class", classes)
var styless = ""
attributes.styles.forEach( function (value) {
styless = styless + value.name + " "
})
x.setAttribute("style", styless)
wrapper.appendChild(x)
div.appendChild(wrapper)
form.appendChild(div)
element.appendChild(form)
fields.push(attributes.nameControl);
var str = '{"idControl":"phone_number","nameControl":"phone_number","label":"Numero de Tel\u00e9fono","class":[{"name":"form-control"}],"styles":[],"options":"","required":false,"id":8,"type_control_id":1,"name":"tel","placeholder":"Numero de Tel\u00e9fono"}';
var attributes = JSON.parse(str.replace(/"/g,'"'));
var label = document.createElement("LABEL")
var t = document.createTextNode(attributes.label)
label.appendChild(t)
var wrapper = document.createElement("div")
wrapper.setAttribute("class", "formw-input-wrapper")
wrapper.appendChild(label)
div.appendChild(wrapper)
form.appendChild(div)

var x = document.createElement("INPUT");
x.setAttribute("type", "tel")
x.setAttribute("name", attributes.nameControl)
x.setAttribute("required", "required")
x.setAttribute("id", attributes.idControl)
x.setAttribute("value", "")
var classes = ""

attributes.class.forEach( function (value) {
classes = classes + value.name + " "
})
x.setAttribute("class", classes)
var styless = ""
attributes.styles.forEach( function (value) {
styless = styless + value.name + " "
})
x.setAttribute("style", styless)
wrapper.appendChild(x)
div.appendChild(wrapper)
form.appendChild(div)
element.appendChild(form)
fields.push(attributes.nameControl);
  var div = document.createElement('div')
  div.setAttribute('class', 'tab -w-tab')
      div.style.cssText = 'display:none !important';
    form.appendChild(div)
var str = '{"idControl":"Quiere_recibir_mas_informacion","nameControl":"Quiere_recibir_mas_informacion","label":"Quiere recibir mas informacion","class":[],"styles":[{"name":null},{"name":"color:#000000;"},{"name":"background-color:#FFFFFF;"},{"name":"font-size:100;"}],"options":"","required":false,"id":1,"type_control_id":1,"name":"text","placeholder":""}';
var attributes = JSON.parse(str.replace(/"/g,'"'));
var label = document.createElement("LABEL")
var t = document.createTextNode(attributes.label)
label.appendChild(t)
var wrapper = document.createElement("div")
wrapper.setAttribute("class", "formw-input-wrapper")
wrapper.appendChild(label)
div.appendChild(wrapper)
form.appendChild(div)

var x = document.createElement("INPUT");
x.setAttribute("type", "text")
x.setAttribute("name", attributes.nameControl)
x.setAttribute("required", "required")
x.setAttribute("id", attributes.idControl)
x.setAttribute("value", "")
var classes = ""

attributes.class.forEach( function (value) {
classes = classes + value.name + " "
})
x.setAttribute("class", classes)
var styless = ""
attributes.styles.forEach( function (value) {
styless = styless + value.name + " "
})
x.setAttribute("style", styless)
wrapper.appendChild(x)
div.appendChild(wrapper)
form.appendChild(div)
element.appendChild(form)
fields.push(attributes.nameControl);
var str = '{"idControl":"send","nameControl":"Enviar","label":"https:\/\/forms.woobsing.co\/registerForm","class":[{"name":"btn btn-primary"}],"styles":[],"options":"","required":false,"id":16,"type_control_id":5,"name":"button","placeholder":""}';
var attributes = JSON.parse(str.replace(/"/g,'"'));
var x = document.createElement("BUTTON")
var classes = ""
attributes.class.forEach( function (value) {
classes = classes + value.name + " "
})

x.setAttribute("class", classes)
x.classList.add("btn", "d-block", "mx-auto")
var styless = ""
attributes.styles.forEach( function (value) {
styless = styless + value.name + " "
})
x.setAttribute("style", styless)
x.setAttribute("onClick", "")
var elem = document.createTextNode(attributes.nameControl);
x.appendChild(elem)
div.appendChild(x)
form.appendChild(div)
element.appendChild(form)

var divClose = document.createElement('div')
var divContainer = document.createElement('div')
divContainer.setAttribute('class', 'formw-button-container')
var buttonPrevious = document.createElement('button')
var buttonNext = document.createElement('button')

buttonPrevious.setAttribute('type', 'button')
buttonPrevious.setAttribute('id', 'prevBtn')
buttonPrevious.setAttribute('class', 'btn btn-outline-primary')
buttonPrevious.setAttribute('onclick', 'nextPrev(-1)')
buttonPrevious.innerHTML = 'Anterior'

buttonNext.setAttribute('type', 'button')
buttonNext.setAttribute('id', 'nextBtn')
buttonNext.setAttribute('class', 'btn btn-outline-primary ms-auto')
buttonNext.setAttribute('onclick', 'nextPrev(1); fetchFirstData(event)')
buttonNext.innerHTML = 'Siguiente'

divContainer.appendChild(buttonPrevious)
divContainer.appendChild(buttonNext)
divClose.appendChild(divContainer)

form.appendChild(divClose)
var divStep = document.createElement('div')
  var span = document.createElement('span')
  span.setAttribute('class', 'step')
  divStep.appendChild(span)
  var span = document.createElement('span')
  span.setAttribute('class', 'step')
  divStep.appendChild(span)
  var span = document.createElement('span')
  span.setAttribute('class', 'step')
  divStep.appendChild(span)
form.appendChild(divStep)



var x = document.createElement("SCRIPT");
x.setAttribute("src", "https://forms.woobsing.co/js/nationalv2.js")
x.defer = true
x.async = true
div.appendChild(x)

var x = document.createElement("SCRIPT");
x.setAttribute("src", "https://forms.woobsing.co/js/script.js")
div.appendChild(x)

var x = document.createElement("SCRIPT");
x.setAttribute("src", "https://api.ipify.org?format=jsonp&callback=getIP")
div.appendChild(x)

let submitForm = false;

  var x = document.createElement("SCRIPT");
  x.setAttribute("src", "https://www.google.com/recaptcha/api.js")
  div.appendChild(x)

  var x = document.createElement("SCRIPT");
  x.setAttribute("src", "https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js")
  div.appendChild(x)

  
  document.getElementById('form').addEventListener('submit', function(e) {
    var form = document.getElementById('form');
    e.preventDefault();
    e.stopPropagation();
    validateData();
    if(submitForm){
              form.submit()
          }
  })

  function validateData() {
    fields.forEach(ele => {
      var input = document.getElementById(ele);
      if (input.value == "" || input.value == null) {
        submitForm = false;
        var element = document.getElementById(ele+'_p');
        if(element !== null)
          element.parentNode.removeChild(element);
        var p = document.createElement("p");
        p.innerHTML = 'Por favor llena este campo';
        p.setAttribute('style', 'color: red');
        p.setAttribute('id', ele+'_p');
        var div = input.parentNode;
        div.appendChild(p);
       } else {
        submitForm = true;
        var element = document.getElementById(ele+'_p');
        if(element !== null)
          element.parentNode.removeChild(element);
      }
    });
  }

  window.onload = getMetaData();

  function getMetaData() {
    var navi = document.getElementById('navigator')
    navi.value = navigator.userAgent;
    setTimeout(function () {
      var ip = document.getElementById('ip').value;
      axios.get('https://forms.woobsing.co/getInfo?ip='+ip)
      .then((response) => {
        var isp = document.getElementById('isp');
        var country = document.getElementById('country');
        var countryCode = document.getElementById('countryCode');
        var timezone = document.getElementById('timezone');
        var zip = document.getElementById('zip')
        isp.value = response.data.isp;
        country.value = response.data.country;
        countryCode.value = response.data.countryCode;
        timezone.value = response.data.timezone;
        zip.value = response.data.zip;
      })
      .catch((error) => {
        console.log(error)
      })
    }, 2000);
  }


var currentTab = 0; // Current tab is set to be the first tab (0)
showTab(currentTab); // Display the current tab

function showTab(n) {
  // This function will display the specified tab of the form...
  var x = document.getElementsByClassName("-w-tab");
  var t = document.getElementsByClassName("w-nav");
  x[n].style.display = "block";
  t[n].classList.add("active"); 

  //... and fix the Previous/Next buttons:
  if (n == 0) {
    document.getElementById("prevBtn").style.cssText = "display:none !important";
  } else {
    document.getElementById("prevBtn").style.cssText = "display:inline !important";
  }
  if (n == (x.length - 1)) {
    document.getElementById("nextBtn").style.cssText = "display:none !important";
    document.getElementById("prevBtn").style.cssText = "display:none !important";
  } else {
    document.getElementById("nextBtn").innerHTML = "Siguiente";
  }

  //... and run a function that will display the correct step indicator:
  fixStepIndicator(n)
}

function nextPrev(n) {
  var taga = document.getElementsByTagName('a');
  taga[currentTab].removeAttribute('onclick')
  newCurrent = currentTab + n
  if (currentTab > newCurrent) {
  taga[currentTab].setAttribute('onclick', 'nextPrev(1)')
  taga[newCurrent].setAttribute('onclick', 'nextPrev(-1)')
  } else {
  taga[currentTab].setAttribute('onclick', 'nextPrev(-1)')
  taga[newCurrent].setAttribute('onclick', 'nextPrev(1)')
  }

  // This function will figure out which tab to display
  var x = document.getElementsByClassName("-w-tab");
  var t = document.getElementsByClassName("w-nav");

  // Exit the function if any field in the current tab is invalid:
  if (n == 1 && !validateForm()) return false;

  // Hide the current tab:
  x[currentTab].style.cssText = "display:none !important";
  t[currentTab].classList.remove("active");

  // Increase or decrease the current tab by 1:
  currentTab = currentTab + n;

  // if you have reached the end of the form...
  if (currentTab >= x.length) {

  // ... the form gets submitted:
  document.getElementById("regForm").submit();
  return false;
  }

  // Otherwise, display the correct tab:
  showTab(currentTab);

}

function fetchFirstData(e) {
  if (currentTab == 0 && !validateForm()) return false;
  var el, x, y, data = [];
  el = e.target
  el.removeAttribute("onclick")
  el.setAttribute("onclick", "nextPrev(1)")

  // fetch data
  x = document.getElementsByClassName("-w-tab");
  y = x[0].getElementsByTagName("input");
  
  for (i = 0; i < y.length; i++) {
    let j = y[i].name;
    data[j] = y[i].value;
  }

  //here the post to api
  var url = '';
  fetch(url, {
    method: 'POST',
    body: data
  })
  .then((res) => {
    console.log(res);
  })
  .catch((error) => {
    console.error('Error', error.message)
  });  
}

function validateForm() {
// This function deals with validation of the form fields
var x, y, i, valid = true;
x = document.getElementsByClassName("-w-tab");
y = x[currentTab].getElementsByTagName("input");

// A loop that checks every input field in the current tab:
for (i = 0; i < y.length; i++) {
// If a field is empty...
if (y[i].value == "" && y[i].type != 'hidden') {
// add an "invalid" class to the field:
y[i].className += " invalid";
// and set the current valid status to false
valid = false;
} else {
  y[i].setAttribute('disabled', true)
}
}
// If the valid status is true, mark the step as finished and valid:
if (valid) {
document.getElementsByClassName("step")[currentTab].className += " finish";
}
return valid; // return the valid status
}

function fixStepIndicator(n) {
// This function removes the "active" class of all steps...
var i, x = document.getElementsByClassName("step");
for (i = 0; i < x.length; i++) {
x[i].className = x[i].className.replace(" active", "");
}
//... and adds the "active" class on the current step:
x[n].className += " active";
}

// This block add event listner to inputs for remove invalid class

var inpts = document.getElementsByClassName("form-control");

var validateValidClass = function() {
    if (this.classList.contains('invalid')) {
      this.classList.remove('invalid')
    }
};

for (var i = 0; i < inpts.length; i++) {
  inpts[i].addEventListener('click', validateValidClass, false);
}