window.onload = function() {
  const PHONE_NUMBER_VALIDATION_PATTERN_REGEX = new RegExp( "^(\\+\\d{1,2}\\s?)?\\(?\\d{3}\\)?[\\s.-]?\\d{3}[\\s.-]?\\d{4}$|^\\+*\\d{9,15}$" )
  const url = window.location.href;
  const urlParams = new URLSearchParams( window.location.search );
  const utmSource = urlParams.get( "utm_source" );
  const form = document.querySelector( "form" );
  const formInput = form && form.querySelector( ".dmforminput" );

  if( formInput && ! url.includes( "my.duda.co" ) ) {
    const phoneInputElements = form.querySelectorAll( "input[type='tel']" );

    function errorMessage( element ) {
      if( ! PHONE_NUMBER_VALIDATION_PATTERN_REGEX.test( element.value ) ) {
        element.setCustomValidity( "Phone should be 9-15 digits" );
        element.reportValidity();
      } else {
        element.setCustomValidity( "" );
      }
    }

    for( const phoneInputElement of phoneInputElements ) {
      phoneInputElement.addEventListener( "input", () => errorMessage( phoneInputElement ) );
    }

    const addFormInputField = ( identifier, key, value ) => {
      const label = document.createElement( "label" );
      label.setAttribute( "data-dm-for", identifier );
      label.setAttribute( "hide", "true" );
      label.innerHTML = key;
      const valueInput = document.createElement( "input" );
      valueInput.setAttribute( "type", "hidden" );
      valueInput.setAttribute( "name", identifier );
      valueInput.setAttribute( "value", value );
      valueInput.setAttribute( "placeholder", key );
      valueInput.setAttribute( "class", "dmforminput" );
      valueInput.style.margin = 0;
      valueInput.style.padding = 0;
      const labelInput = document.createElement( "input" );
      labelInput.setAttribute( "type", "hidden" );
      labelInput.setAttribute( "name", `label-${ identifier }` );
      labelInput.setAttribute( "value", key );
      const divContainer = document.createElement( "div" );
      divContainer.setAttribute( "class", "dmforminput" );
      divContainer.append( label );
      divContainer.append( valueInput );
      divContainer.append( labelInput );
      divContainer.style.margin = 0;
      divContainer.style.padding = 0;
      formInput.parentNode.insertBefore( divContainer, formInput );
    }

    addFormInputField( "dmform-00", "page_url", url );
    addFormInputField( "dmform-01", "page_title", document.title );
    if( utmSource ) {
      addFormInputField( "dmform-02", "utm_source", utmSource );
    }
  }
}