@ptcwebops/ptcw-design 3.7.0 → 3.7.2

package/dist/collection/utils/elq-lib.js

@@ -1,431 +1,431 @@
-import { MDCSelect } from '@material/select/component.js';
-import './eloqua.d.ts';
-// Define the ElqLib class
-export class ElqLib {
-  constructor(params) {
-    this.params = params;
-    this.url_vars = {};
-    this.visitor_elq_id = null;
-    this.field_mappings = [];
-    this.callback_queue = [];
-    this.fields_populated = false;
-    this.user_elq_email = '';
-    this.user_elq_firstname = '';
-    this.user_elq_lastname = '';
-    // Merge defaults with params
-    const defaults = {
-      elq_site_id: '',
-      elq_visitor_lookup_key: '',
-      elq_recipient_id_lookup_key: '',
-      elq_contact_lookup_key: '',
-      elq_field_email_rec_id: 'V_EmailRecipientID',
-      elq_field_contact_email: 'C_EmailAddress',
-      elq_field_visitor_email: 'V_Email_Address',
-      elq_field_visitor_firstname: 'V_First_Name',
-      elq_field_visitor_lastname: 'V_Last_Name',
-      notme_link_id: 'not-me-link-id',
-      notme_fields_class: null,
-      notme_message: 'Not {name}? Click here.',
-      notme_message_noname: 'Not your details below? Click here.',
-    };
-    this.params = Object.assign(Object.assign({}, defaults), this.params);
-    this.init();
-  }
-  init() {
-    // Merge defaults with user-provided params if not already done in the constructor
-    // ...
-    // Set Eloqua site ID
-    this.setEloquaSiteId();
-    // Load Eloqua scripts
-    this.async_load();
-    // Store URL variables
-    this.store_url_vars();
-    // Store visitor's Eloqua IDgit
-    this.store_visitor_elq_id();
-    // init noteme link;
-    // this.init_notme();
-    // Set the global Eloqua callback function
-    window.SetElqContent = this.eloqua_callback.bind(this);
-  }
-  setEloquaSiteId() {
-    if (this.params.elq_site_id) {
-      ElqLib._elqQ.push(['elqSetSiteId', this.params.elq_site_id]);
-      ElqLib._elqQ.push(['elqUseFirstPartyCookie', 'tracking.ptc.com']);
-      ElqLib._elqQ.push(['elqTrackPageView', window.location.href]);
-    }
-  }
-  fire_pageview(url) {
-    try {
-      if (typeof url === 'undefined') {
-        ElqLib._elqQ.push(['elqTrackPageView']);
-      }
-      else {
-        ElqLib._elqQ.push(['elqTrackPageView', url]);
-      }
-      console.log('TRACKING: Eloqua pageview fired for URL: ' + (url || 'current page'));
-    }
-    catch (e) {
-      console.log('TRACKING: Could not fire Eloqua pageview: ', e);
-    }
-  }
-  find_eloqua_contact() {
-    console.log('CONTACT LOOKUP: Attempting to find Eloqua contact...');
-    // Queue callback action for the return of lookup
-    this.callback_queue.push(this.handle_visitor_lookup.bind(this));
-    // Start with a recipient lookup if ID was supplied in URL
-    if (this.visitor_elq_id !== null) {
-      this.lookup_visitor_by_recipient_id();
-    }
-    else {
-      // If no visitor ID, attempt to do a visitor lookup with an Eloqua cookie
-      this.lookup_visitor_by_cookie(); //preference center
-      this.lookup_contact_by_email();
-    }
-  }
-  add_field_mapping(mapping) {
-    this.field_mappings.push(mapping);
-  }
-  add_queue_action(action) {
-    this.callback_queue.push(action);
-  }
-  store_url_vars() {
-    // Clear the current url_vars
-    this.url_vars = {};
-    // Split the URL by the '?' to get the query string part
-    const queryString = window.location.search.substring(1);
-    // Split the query string by '&' to get each key-value pair
-    queryString.split('&').forEach(paramString => {
-      // Split the key-value pairs by '=' to separate keys and values
-      let [key, value] = paramString.split('=');
-      // Decode URI components to handle URL encoding
-      key = decodeURIComponent(key);
-      value = decodeURIComponent(value);
-      // Store the key-value pair in the url_vars object
-      this.url_vars[key] = value;
-    });
-    // Optionally, log the stored URL variables
-    console.log('URL variables stored:', this.url_vars);
-  }
-  store_visitor_elq_id() {
-    console.log("INIT: Looking for visitor's Eloqua ID in URL...");
-    const elqIdParam = this.url_vars['elq'];
-    if (elqIdParam) {
-      const elqId = elqIdParam.toUpperCase().replace(/(.{8})(.{4})(.{4})(.{4})(.{12})/, '$1-$2-$3-$4-$5');
-      this.visitor_elq_id = elqId;
-      console.log(`INIT: ...visitor Eloqua ID found in URL: ${elqId}`);
-    }
-    else {
-      this.visitor_elq_id = null;
-      console.log('INIT: ...no visitor Eloqua ID found in URL');
-    }
-  }
-  //   private merge(root: any, ...sources: any[]): any {
-  //     sources.forEach(source => {
-  //       for (const key in source) {
-  //         if (source.hasOwnProperty(key)) {
-  //           root[key] = source[key];
-  //         }
-  //       }
-  //     });
-  //     return root;
-  //   }
-  eloqua_callback() {
-    console.log('LOOKUP: Eloqua lookup finished');
-    // Process each action in the callback queue
-    let actionSucceeded = true;
-    while (actionSucceeded && this.callback_queue.length > 0) {
-      const action = this.callback_queue.shift();
-      if (action) {
-        console.log(`QUEUE: Executing action`);
-        actionSucceeded = action(); // Execute the action. It must return a boolean indicating success.
-        if (actionSucceeded) {
-          console.log('QUEUE: Action executed successfully, removed from queue');
-        }
-        else {
-          console.log('QUEUE: Action failed, re-adding to queue');
-          this.callback_queue.unshift(action); // Re-add the action to the front of the queue
-          break; // Break out of the loop if an action fails
-        }
-      }
-    }
-    // After processing the queue, update user details or perform other operations
-    if (actionSucceeded) {
-      this.update_user_details();
-      this.populate_mapped_fields();
-    }
-    // ...additional code to handle the aftermath of callback processing...
-  }
-  lookup_visitor_by_cookie() {
-    if (this.params.elq_visitor_lookup_key != '') {
-      ElqLib._elqQ.push(['elqDataLookup', escape(this.params.elq_visitor_lookup_key), '']);
-      console.log('LOOKUP: Visitor lookup sent using Eloqua cookie');
-    }
-    else {
-      console.log('LOOKUP: A visitor lookup cannot be performed as no lookup key was defined');
-    }
-  }
-  lookup_visitor_by_recipient_id() {
-    if (this.params.elq_recipient_id_lookup_key != '') {
-      ElqLib._elqQ.push([
-        'elqDataLookup',
-        escape(this.params.elq_recipient_id_lookup_key),
-        '<' + this.params.elq_field_email_rec_id + '>' + this.visitor_elq_id + '</' + this.params.elq_field_email_rec_id + '>',
-      ]);
-      console.log('LOOKUP: Visitor lookup sent using email recipient id: ' + this.visitor_elq_id);
-    }
-    else {
-      console.log('LOOKUP: A visitor lookup cannot be performed as no lookup key was defined');
-    }
-  }
-  lookup_contact_by_email() {
-    if (this.params.elq_contact_lookup_key != '') {
-      ElqLib._elqQ.push([
-        'elqDataLookup',
-        escape(this.params.elq_contact_lookup_key),
-        '<' + this.params.elq_field_contact_email + '>' + this.user_elq_email + '</' + this.params.elq_field_contact_email + '>',
-      ]);
-      console.log('LOOKUP: Contact lookup sent using email address: ' + this.user_elq_email);
-    }
-    else {
-      console.log('LOOKUP: A visitor lookup cannot be performed as no lookup key was defined');
-    }
-  }
-  handle_visitor_lookup() {
-    //console.log('Contact Email: ' + this.params.elq_field_contact_email)
-    const email = window.GetElqContentPersonalizationValue(this.params.elq_field_contact_email); //it was elq_field_visitor_email ( V_Email_Address)
-    if (email) {
-      console.log(`LOOKUP: Found contact email address: ${email}`);
-      this.user_elq_email = email.trim();
-      this.lookup_contact_by_email();
-      this.callback_queue.push(this.handle_contact_lookup.bind(this));
-      return true;
-    }
-    else {
-      return false;
-    }
-  }
-  handle_contact_lookup() {
-    if (window.GetElqContentPersonalizationValue(this.params.elq_field_contact_email) != '') {
-      console.log('LOOKUP: Found contact email address: ' + window.GetElqContentPersonalizationValue(this.params.elq_field_contact_email));
-      return true;
-    }
-    else {
-      return false;
-    }
-  }
-  populate_mapped_fields() {
-    console.log('MAPPING: Starting field mapping');
-    //debugger;
-    this.field_mappings.forEach(({ elementId, elqFieldName }) => {
-      const fieldValue = window.GetElqContentPersonalizationValue(elqFieldName);
-      if (elementId !== 'contact-country') {
-        const element = document.getElementById(elementId);
-        console.log('element ID of field mappings: ' + elementId);
-        console.log('fieldValue ID of field mappings: ' + fieldValue);
-        if (element && fieldValue) {
-          element.value = fieldValue;
-          //element.style.display = 'none'; // Hide the field.
-          if (element.closest('ptc-textfield')) {
-            element.closest('ptc-textfield').style.display = 'none';
-            element.closest('ptc-textfield').inputValue = fieldValue;
-          }
-          else if (element.closest('ptc-select')) {
-            element.closest('ptc-select').style.display = 'none';
-            element.closest("ptc-select").selectedValue = fieldValue;
-          }
-          this.fields_populated = true;
-        }
-      }
-      else {
-        const countryEle = document.getElementById(elementId);
-        const countrySelect = document.querySelector('.mdc-select');
-        const mdcSelect = new MDCSelect(countrySelect);
-        if (countryEle && fieldValue) {
-          countryEle.textContent = fieldValue;
-          countryEle.closest("ptc-select").selectedValue = fieldValue;
-          mdcSelect.value = fieldValue;
-        }
-        // debugger;
-        if (countryEle.closest('ptc-select')) {
-          countryEle.closest('ptc-select').style.display = 'none';
-        }
-      }
-    });
-    console.log('MAPPING: Finished ');
-    if (this.fields_populated) {
-      this.update_notme_link();
-    }
-  }
-  update_user_details() {
-    console.log('displaying user info...');
-    if (window.GetElqContentPersonalizationValue(this.params.elq_field_contact_email) !== '') {
-      document
-        .querySelectorAll('input[type=text], input[type=tel], input[name="phonenumber"], input[name="phonenumbertwo"], input[type=email], select, textarea, span.mdc-select__selected-text')
-        .forEach((element) => {
-        if (element.tagName === 'SPAN') {
-          const spanText = element;
-          const spanEloquaName = spanText.getAttribute('data-eloqua-name');
-          const ptcSelect = spanText.closest('ptc-select');
-          const mdcSelect = new MDCSelect(ptcSelect.querySelector('.mdc-select'));
-          if (spanEloquaName !== null) {
-            const spanElqValue = window.GetElqContentPersonalizationValue(spanEloquaName);
-            if (spanElqValue !== '' && spanElqValue.length > 0) {
-              spanText.textContent = spanElqValue;
-              ptcSelect.selectedValue = spanElqValue;
-              mdcSelect.value = spanElqValue;
-            }
-          }
-        }
-        else if (element.className.includes('intl-tel-input')) {
-          const telInput = element;
-          const eloquaName = telInput.getAttribute('data-eloqua-name');
-          if (eloquaName !== null) {
-            const elqValue = window.GetElqContentPersonalizationValue(eloquaName);
-            if (elqValue !== '' && elqValue.length > 0) {
-              setTimeout(() => {
-                telInput.placeholder = elqValue;
-                telInput.value = elqValue;
-                telInput.closest('ptc-textfield').inputValue = elqValue;
-              }, 1000);
-            }
-          }
-        }
-        else {
-          const input = element;
-          const eloquaName = input.getAttribute('data-eloqua-name');
-          if (eloquaName !== null) {
-            const elqValue = window.GetElqContentPersonalizationValue(eloquaName);
-            if (elqValue !== '' && elqValue.length > 0) {
-              input.value = elqValue;
-              input.closest('ptc-textfield').inputValue = elqValue;
-            }
-          }
-        }
-      });
-    }
-    if (this.user_elq_email == '' && window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_email) != '') {
-      this.user_elq_email = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_email);
-    }
-    if (this.user_elq_firstname == '' && window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_firstname) != '') {
-      this.user_elq_firstname = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_firstname);
-    }
-    if (this.user_elq_lastname == '' && window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_lastname) != '') {
-      this.user_elq_lastname = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_lastname);
-    }
-  }
-  update_notme_link() {
-    // Assuming the user's first and last name are available from Eloqua fields
-    const firstName = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_firstname);
-    const lastName = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_lastname);
-    const topAdditional = document.getElementById('not-me-additional-top');
-    const bottomAdditional = document.getElementById('not-me-additional-bottom');
-    if (topAdditional) {
-      let message = topAdditional.innerHTML;
-      console.log('first name: ' + firstName);
-      if (firstName && lastName) {
-        message = message.replace('{name}', lastName + ' ' + firstName);
-      }
-      else {
-        message = this.params.notme_message_noname;
-      }
-      topAdditional.innerHTML = message;
-      topAdditional.style.display = 'block';
-    }
-    if (bottomAdditional) {
-      //bottomAdditional.innerHTML="Click the button below to recieve email confirmation.";
-      bottomAdditional.style.display = 'block';
-    }
-    const notMeLinkElement = document.getElementById(this.params.notme_link_id);
-    if (notMeLinkElement) {
-      notMeLinkElement.style.display = 'block';
-      notMeLinkElement.onclick = this.remove_user_details.bind(this);
-    }
-  }
-  // private init_notme(): void{
-  //   const topAdditional = document.getElementById('not-me-additional-top');
-  //   const bottomAdditional = document.getElementById('not-me-additional-bottom');
-  //   console.log("top: " + topAdditional)
-  //   if(topAdditional) topAdditional.style.display = 'none';
-  //   if(bottomAdditional) bottomAdditional.style.display = 'none';
-  // }
-  remove_user_details(e) {
-    e.preventDefault();
-    this.user_elq_email = '';
-    this.user_elq_firstname = '';
-    this.user_elq_lastname = '';
-    // $('.' + this.params.notme_fields_class).val('');
-    //const linkDiv = document.getElementById(this.params.notme_link_id);
-    const topAdditional = document.getElementById('not-me-additional-top');
-    const bottomAdditional = document.getElementById('not-me-additional-bottom');
-    //linkDiv.querySelector('a').remove();
-    topAdditional.style.display = 'none';
-    bottomAdditional.style.display = 'none';
-    this.refreshForm();
-    return false;
-  }
-  refreshForm() {
-    this.field_mappings.forEach(({ elementId }) => {
-      if (elementId !== 'contact-country') {
-        const element = document.getElementById(elementId);
-        if (element) {
-          console.log('element: ' + element);
-          element.value = ''; // Reset the value
-          if (element.closest('ptc-textfield')) {
-            if (element.closest('ptc-textfield').getAttribute('ignore-blind-submit') != "true") {
-              element.closest('ptc-textfield').style.display = '';
-            }
-          }
-          else if (element.closest('ptc-select')) {
-            element.closest('ptc-select').style.display = '';
-          }
-          else if (element.closest('ptc-form-checkbox')) {
-            if (element.closest('ptc-form-checkbox').getAttribute('ignore-blind-submit') == "true") {
-              element.closest('ptc-form-checkbox').style.display = 'none';
-            }
-          }
-        }
-      }
-      else {
-        const countryEle = document.getElementById(elementId);
-        if (countryEle) {
-          countryEle.textContent = '';
-        }
-        // debugger;
-        if (countryEle.closest('ptc-select')) {
-          countryEle.closest('ptc-select').style.display = '';
-        }
-      }
-    });
-    this.clearEloquaCookie('elq-uid'); // Optionally clear the Eloqua cookie
-    this.fields_populated = false;
-    //this.update_notme_link(); // Update the 'Not Me' link if necessary
-  }
-  clearEloquaCookie(name) {
-    document.cookie = name + '=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
-    console.log('cookie cleared');
-  }
-  // Private Method to load Eloqua Scripts
-  async_load() {
-    const scriptUrl = 'https://img.en25.com/i/elqCfg.min.js';
-    const scriptElement = document.createElement('script');
-    scriptElement.type = 'text/javascript';
-    scriptElement.async = true;
-    scriptElement.src = scriptUrl;
-    // Error handling for script loading
-    scriptElement.onerror = errorEvent => {
-      console.log(`Error loading script: ${errorEvent}`);
-    };
-    // Append the script element to the head of the document, or before the first script tag found
-    const firstScriptTag = document.getElementsByTagName('script')[0];
-    if (firstScriptTag && firstScriptTag.parentNode) {
-      firstScriptTag.parentNode.insertBefore(scriptElement, firstScriptTag);
-    }
-    else {
-      document.head.appendChild(scriptElement);
-    }
-    console.log(`Async loading of script ${scriptUrl} initiated.`);
-  }
-}
-ElqLib._elqQ = window['_elqQ'] || [];
-// Static member initialization
-//ElqLib._elqQ = window['_elqQ'] || [];
+import { MDCSelect } from '@material/select/component.js';
+import './eloqua.d.ts';
+// Define the ElqLib class
+export class ElqLib {
+  constructor(params) {
+    this.params = params;
+    this.url_vars = {};
+    this.visitor_elq_id = null;
+    this.field_mappings = [];
+    this.callback_queue = [];
+    this.fields_populated = false;
+    this.user_elq_email = '';
+    this.user_elq_firstname = '';
+    this.user_elq_lastname = '';
+    // Merge defaults with params
+    const defaults = {
+      elq_site_id: '',
+      elq_visitor_lookup_key: '',
+      elq_recipient_id_lookup_key: '',
+      elq_contact_lookup_key: '',
+      elq_field_email_rec_id: 'V_EmailRecipientID',
+      elq_field_contact_email: 'C_EmailAddress',
+      elq_field_visitor_email: 'V_Email_Address',
+      elq_field_visitor_firstname: 'V_First_Name',
+      elq_field_visitor_lastname: 'V_Last_Name',
+      notme_link_id: 'not-me-link-id',
+      notme_fields_class: null,
+      notme_message: 'Not {name}? Click here.',
+      notme_message_noname: 'Not your details below? Click here.',
+    };
+    this.params = Object.assign(Object.assign({}, defaults), this.params);
+    this.init();
+  }
+  init() {
+    // Merge defaults with user-provided params if not already done in the constructor
+    // ...
+    // Set Eloqua site ID
+    this.setEloquaSiteId();
+    // Load Eloqua scripts
+    this.async_load();
+    // Store URL variables
+    this.store_url_vars();
+    // Store visitor's Eloqua IDgit
+    this.store_visitor_elq_id();
+    // init noteme link;
+    // this.init_notme();
+    // Set the global Eloqua callback function
+    window.SetElqContent = this.eloqua_callback.bind(this);
+  }
+  setEloquaSiteId() {
+    if (this.params.elq_site_id) {
+      ElqLib._elqQ.push(['elqSetSiteId', this.params.elq_site_id]);
+      ElqLib._elqQ.push(['elqUseFirstPartyCookie', 'tracking.ptc.com']);
+      ElqLib._elqQ.push(['elqTrackPageView', window.location.href]);
+    }
+  }
+  fire_pageview(url) {
+    try {
+      if (typeof url === 'undefined') {
+        ElqLib._elqQ.push(['elqTrackPageView']);
+      }
+      else {
+        ElqLib._elqQ.push(['elqTrackPageView', url]);
+      }
+      console.log('TRACKING: Eloqua pageview fired for URL: ' + (url || 'current page'));
+    }
+    catch (e) {
+      console.log('TRACKING: Could not fire Eloqua pageview: ', e);
+    }
+  }
+  find_eloqua_contact() {
+    console.log('CONTACT LOOKUP: Attempting to find Eloqua contact...');
+    // Queue callback action for the return of lookup
+    this.callback_queue.push(this.handle_visitor_lookup.bind(this));
+    // Start with a recipient lookup if ID was supplied in URL
+    if (this.visitor_elq_id !== null) {
+      this.lookup_visitor_by_recipient_id();
+    }
+    else {
+      // If no visitor ID, attempt to do a visitor lookup with an Eloqua cookie
+      this.lookup_visitor_by_cookie(); //preference center
+      this.lookup_contact_by_email();
+    }
+  }
+  add_field_mapping(mapping) {
+    this.field_mappings.push(mapping);
+  }
+  add_queue_action(action) {
+    this.callback_queue.push(action);
+  }
+  store_url_vars() {
+    // Clear the current url_vars
+    this.url_vars = {};
+    // Split the URL by the '?' to get the query string part
+    const queryString = window.location.search.substring(1);
+    // Split the query string by '&' to get each key-value pair
+    queryString.split('&').forEach(paramString => {
+      // Split the key-value pairs by '=' to separate keys and values
+      let [key, value] = paramString.split('=');
+      // Decode URI components to handle URL encoding
+      key = decodeURIComponent(key);
+      value = decodeURIComponent(value);
+      // Store the key-value pair in the url_vars object
+      this.url_vars[key] = value;
+    });
+    // Optionally, log the stored URL variables
+    console.log('URL variables stored:', this.url_vars);
+  }
+  store_visitor_elq_id() {
+    console.log("INIT: Looking for visitor's Eloqua ID in URL...");
+    const elqIdParam = this.url_vars['elq'];
+    if (elqIdParam) {
+      const elqId = elqIdParam.toUpperCase().replace(/(.{8})(.{4})(.{4})(.{4})(.{12})/, '$1-$2-$3-$4-$5');
+      this.visitor_elq_id = elqId;
+      console.log(`INIT: ...visitor Eloqua ID found in URL: ${elqId}`);
+    }
+    else {
+      this.visitor_elq_id = null;
+      console.log('INIT: ...no visitor Eloqua ID found in URL');
+    }
+  }
+  //   private merge(root: any, ...sources: any[]): any {
+  //     sources.forEach(source => {
+  //       for (const key in source) {
+  //         if (source.hasOwnProperty(key)) {
+  //           root[key] = source[key];
+  //         }
+  //       }
+  //     });
+  //     return root;
+  //   }
+  eloqua_callback() {
+    console.log('LOOKUP: Eloqua lookup finished');
+    // Process each action in the callback queue
+    let actionSucceeded = true;
+    while (actionSucceeded && this.callback_queue.length > 0) {
+      const action = this.callback_queue.shift();
+      if (action) {
+        console.log(`QUEUE: Executing action`);
+        actionSucceeded = action(); // Execute the action. It must return a boolean indicating success.
+        if (actionSucceeded) {
+          console.log('QUEUE: Action executed successfully, removed from queue');
+        }
+        else {
+          console.log('QUEUE: Action failed, re-adding to queue');
+          this.callback_queue.unshift(action); // Re-add the action to the front of the queue
+          break; // Break out of the loop if an action fails
+        }
+      }
+    }
+    // After processing the queue, update user details or perform other operations
+    if (actionSucceeded) {
+      this.update_user_details();
+      this.populate_mapped_fields();
+    }
+    // ...additional code to handle the aftermath of callback processing...
+  }
+  lookup_visitor_by_cookie() {
+    if (this.params.elq_visitor_lookup_key != '') {
+      ElqLib._elqQ.push(['elqDataLookup', escape(this.params.elq_visitor_lookup_key), '']);
+      console.log('LOOKUP: Visitor lookup sent using Eloqua cookie');
+    }
+    else {
+      console.log('LOOKUP: A visitor lookup cannot be performed as no lookup key was defined');
+    }
+  }
+  lookup_visitor_by_recipient_id() {
+    if (this.params.elq_recipient_id_lookup_key != '') {
+      ElqLib._elqQ.push([
+        'elqDataLookup',
+        escape(this.params.elq_recipient_id_lookup_key),
+        '<' + this.params.elq_field_email_rec_id + '>' + this.visitor_elq_id + '</' + this.params.elq_field_email_rec_id + '>',
+      ]);
+      console.log('LOOKUP: Visitor lookup sent using email recipient id: ' + this.visitor_elq_id);
+    }
+    else {
+      console.log('LOOKUP: A visitor lookup cannot be performed as no lookup key was defined');
+    }
+  }
+  lookup_contact_by_email() {
+    if (this.params.elq_contact_lookup_key != '') {
+      ElqLib._elqQ.push([
+        'elqDataLookup',
+        escape(this.params.elq_contact_lookup_key),
+        '<' + this.params.elq_field_contact_email + '>' + this.user_elq_email + '</' + this.params.elq_field_contact_email + '>',
+      ]);
+      console.log('LOOKUP: Contact lookup sent using email address: ' + this.user_elq_email);
+    }
+    else {
+      console.log('LOOKUP: A visitor lookup cannot be performed as no lookup key was defined');
+    }
+  }
+  handle_visitor_lookup() {
+    //console.log('Contact Email: ' + this.params.elq_field_contact_email)
+    const email = window.GetElqContentPersonalizationValue(this.params.elq_field_contact_email); //it was elq_field_visitor_email ( V_Email_Address)
+    if (email) {
+      console.log(`LOOKUP: Found contact email address: ${email}`);
+      this.user_elq_email = email.trim();
+      this.lookup_contact_by_email();
+      this.callback_queue.push(this.handle_contact_lookup.bind(this));
+      return true;
+    }
+    else {
+      return false;
+    }
+  }
+  handle_contact_lookup() {
+    if (window.GetElqContentPersonalizationValue(this.params.elq_field_contact_email) != '') {
+      console.log('LOOKUP: Found contact email address: ' + window.GetElqContentPersonalizationValue(this.params.elq_field_contact_email));
+      return true;
+    }
+    else {
+      return false;
+    }
+  }
+  populate_mapped_fields() {
+    console.log('MAPPING: Starting field mapping');
+    //debugger;
+    this.field_mappings.forEach(({ elementId, elqFieldName }) => {
+      const fieldValue = window.GetElqContentPersonalizationValue(elqFieldName);
+      if (elementId !== 'contact-country') {
+        const element = document.getElementById(elementId);
+        console.log('element ID of field mappings: ' + elementId);
+        console.log('fieldValue ID of field mappings: ' + fieldValue);
+        if (element && fieldValue) {
+          element.value = fieldValue;
+          //element.style.display = 'none'; // Hide the field.
+          if (element.closest('ptc-textfield')) {
+            element.closest('ptc-textfield').style.display = 'none';
+            element.closest('ptc-textfield').inputValue = fieldValue;
+          }
+          else if (element.closest('ptc-select')) {
+            element.closest('ptc-select').style.display = 'none';
+            element.closest("ptc-select").selectedValue = fieldValue;
+          }
+          this.fields_populated = true;
+        }
+      }
+      else {
+        const countryEle = document.getElementById(elementId);
+        const countrySelect = document.querySelector('.mdc-select');
+        const mdcSelect = new MDCSelect(countrySelect);
+        if (countryEle && fieldValue) {
+          countryEle.textContent = fieldValue;
+          countryEle.closest("ptc-select").selectedValue = fieldValue;
+          mdcSelect.value = fieldValue;
+        }
+        // debugger;
+        if (countryEle.closest('ptc-select')) {
+          countryEle.closest('ptc-select').style.display = 'none';
+        }
+      }
+    });
+    console.log('MAPPING: Finished ');
+    if (this.fields_populated) {
+      this.update_notme_link();
+    }
+  }
+  update_user_details() {
+    console.log('displaying user info...');
+    if (window.GetElqContentPersonalizationValue(this.params.elq_field_contact_email) !== '') {
+      document
+        .querySelectorAll('input[type=text], input[type=tel], input[name="phonenumber"], input[name="phonenumbertwo"], input[type=email], select, textarea, span.mdc-select__selected-text')
+        .forEach((element) => {
+        if (element.tagName === 'SPAN') {
+          const spanText = element;
+          const spanEloquaName = spanText.getAttribute('data-eloqua-name');
+          const ptcSelect = spanText.closest('ptc-select');
+          const mdcSelect = new MDCSelect(ptcSelect.querySelector('.mdc-select'));
+          if (spanEloquaName !== null) {
+            const spanElqValue = window.GetElqContentPersonalizationValue(spanEloquaName);
+            if (spanElqValue !== '' && spanElqValue.length > 0) {
+              spanText.textContent = spanElqValue;
+              ptcSelect.selectedValue = spanElqValue;
+              mdcSelect.value = spanElqValue;
+            }
+          }
+        }
+        else if (element.className.includes('intl-tel-input')) {
+          const telInput = element;
+          const eloquaName = telInput.getAttribute('data-eloqua-name');
+          if (eloquaName !== null) {
+            const elqValue = window.GetElqContentPersonalizationValue(eloquaName);
+            if (elqValue !== '' && elqValue.length > 0) {
+              setTimeout(() => {
+                telInput.placeholder = elqValue;
+                telInput.value = elqValue;
+                telInput.closest('ptc-textfield').inputValue = elqValue;
+              }, 1000);
+            }
+          }
+        }
+        else {
+          const input = element;
+          const eloquaName = input.getAttribute('data-eloqua-name');
+          if (eloquaName !== null) {
+            const elqValue = window.GetElqContentPersonalizationValue(eloquaName);
+            if (elqValue !== '' && elqValue.length > 0) {
+              input.value = elqValue;
+              input.closest('ptc-textfield').inputValue = elqValue;
+            }
+          }
+        }
+      });
+    }
+    if (this.user_elq_email == '' && window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_email) != '') {
+      this.user_elq_email = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_email);
+    }
+    if (this.user_elq_firstname == '' && window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_firstname) != '') {
+      this.user_elq_firstname = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_firstname);
+    }
+    if (this.user_elq_lastname == '' && window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_lastname) != '') {
+      this.user_elq_lastname = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_lastname);
+    }
+  }
+  update_notme_link() {
+    // Assuming the user's first and last name are available from Eloqua fields
+    const firstName = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_firstname);
+    const lastName = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_lastname);
+    const topAdditional = document.getElementById('not-me-additional-top');
+    const bottomAdditional = document.getElementById('not-me-additional-bottom');
+    if (topAdditional) {
+      let message = topAdditional.innerHTML;
+      console.log('first name: ' + firstName);
+      if (firstName && lastName) {
+        message = message.replace('{name}', lastName + ' ' + firstName);
+      }
+      else {
+        message = this.params.notme_message_noname;
+      }
+      topAdditional.innerHTML = message;
+      topAdditional.style.display = 'block';
+    }
+    if (bottomAdditional) {
+      //bottomAdditional.innerHTML="Click the button below to recieve email confirmation.";
+      bottomAdditional.style.display = 'block';
+    }
+    const notMeLinkElement = document.getElementById(this.params.notme_link_id);
+    if (notMeLinkElement) {
+      notMeLinkElement.style.display = 'block';
+      notMeLinkElement.onclick = this.remove_user_details.bind(this);
+    }
+  }
+  // private init_notme(): void{
+  //   const topAdditional = document.getElementById('not-me-additional-top');
+  //   const bottomAdditional = document.getElementById('not-me-additional-bottom');
+  //   console.log("top: " + topAdditional)
+  //   if(topAdditional) topAdditional.style.display = 'none';
+  //   if(bottomAdditional) bottomAdditional.style.display = 'none';
+  // }
+  remove_user_details(e) {
+    e.preventDefault();
+    this.user_elq_email = '';
+    this.user_elq_firstname = '';
+    this.user_elq_lastname = '';
+    // $('.' + this.params.notme_fields_class).val('');
+    //const linkDiv = document.getElementById(this.params.notme_link_id);
+    const topAdditional = document.getElementById('not-me-additional-top');
+    const bottomAdditional = document.getElementById('not-me-additional-bottom');
+    //linkDiv.querySelector('a').remove();
+    topAdditional.style.display = 'none';
+    bottomAdditional.style.display = 'none';
+    this.refreshForm();
+    return false;
+  }
+  refreshForm() {
+    this.field_mappings.forEach(({ elementId }) => {
+      if (elementId !== 'contact-country') {
+        const element = document.getElementById(elementId);
+        if (element) {
+          console.log('element: ' + element);
+          element.value = ''; // Reset the value
+          if (element.closest('ptc-textfield')) {
+            if (element.closest('ptc-textfield').getAttribute('ignore-blind-submit') != "true") {
+              element.closest('ptc-textfield').style.display = '';
+            }
+          }
+          else if (element.closest('ptc-select')) {
+            element.closest('ptc-select').style.display = '';
+          }
+          else if (element.closest('ptc-form-checkbox')) {
+            if (element.closest('ptc-form-checkbox').getAttribute('ignore-blind-submit') == "true") {
+              element.closest('ptc-form-checkbox').style.display = 'none';
+            }
+          }
+        }
+      }
+      else {
+        const countryEle = document.getElementById(elementId);
+        if (countryEle) {
+          countryEle.textContent = '';
+        }
+        // debugger;
+        if (countryEle.closest('ptc-select')) {
+          countryEle.closest('ptc-select').style.display = '';
+        }
+      }
+    });
+    this.clearEloquaCookie('elq-uid'); // Optionally clear the Eloqua cookie
+    this.fields_populated = false;
+    //this.update_notme_link(); // Update the 'Not Me' link if necessary
+  }
+  clearEloquaCookie(name) {
+    document.cookie = name + '=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
+    console.log('cookie cleared');
+  }
+  // Private Method to load Eloqua Scripts
+  async_load() {
+    const scriptUrl = 'https://img.en25.com/i/elqCfg.min.js';
+    const scriptElement = document.createElement('script');
+    scriptElement.type = 'text/javascript';
+    scriptElement.async = true;
+    scriptElement.src = scriptUrl;
+    // Error handling for script loading
+    scriptElement.onerror = errorEvent => {
+      console.log(`Error loading script: ${errorEvent}`);
+    };
+    // Append the script element to the head of the document, or before the first script tag found
+    const firstScriptTag = document.getElementsByTagName('script')[0];
+    if (firstScriptTag && firstScriptTag.parentNode) {
+      firstScriptTag.parentNode.insertBefore(scriptElement, firstScriptTag);
+    }
+    else {
+      document.head.appendChild(scriptElement);
+    }
+    console.log(`Async loading of script ${scriptUrl} initiated.`);
+  }
+}
+ElqLib._elqQ = window['_elqQ'] || [];
+// Static member initialization
+//ElqLib._elqQ = window['_elqQ'] || [];