Fetching user information from the page.

app.js

(function () {
  'use strict'

  if (!window.addEventListener) return // Check for IE9+

  var options = INSTALL_OPTIONS
  var INTERACKT_ATTRIBUTE = 'data-interakt-label'

  function trackField (field) {
    window.Interackt.trackUser({
      label: field.getAttribute(INTERACKT_ATTRIBUTE),
      user: field.value
    })
  }

  function trackFormSubmission (event) {
    var form = event.target
    var fields = form.querySelectorAll('[' + INTERACKT_ATTRIBUTE + ']')

    Array.prototype.slice.call(fields).forEach(trackField)
  }

  function trackFieldValue (event) {
    var field = event.target

    trackField(field)
  }

  function updateElements () {
    options.trackedFields
      .filter(function (entry) { return INSTALL.matchPage(entry.pages) })
      .forEach(function (entry) {
        var field = document.querySelector(entry.selector)

        if (!field) return

        field.setAttribute(INTERACKT_ATTRIBUTE, entry.label)

        if (field.form) {
          field.form.addEventListener('submit', trackFormSubmission)
        } else {
          // Field is outside of a form so we track the field value on each keystroke.
          field.addEventListener('input', trackFieldValue)
        }
      })
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', updateElements)
  } else {
    updateElements()
  }

  window.INSTALL_SCOPE = {
    setOptions: function setOptions (nextOptions) {
      options = nextOptions

      updateElements()
    }
  }
}())