authbase/lib/browser/registerForm.js

AuthBase client library

var documentRegisterElement = require('document-register-element');

module.exports = function(type, html, submitHandler) {
  function onSubmit(event) {
    event.preventDefault();
    submitHandler(event.target);
  }

  var tag = 'authbase-' + type;

  document.registerElement(tag, {
    prototype: Object.create(HTMLElement.prototype, {
      createdCallback: {
        value: function() {
          this.innerHTML = html;

          // assign a unique name for this form
          var form = this.querySelector('form');
          form.name = form.id + '.' + Date.now();
        }
      },
      // Attach event listener for form submit event
      attachedCallback: {
        value: function() {
          var form = this.querySelector('form');
          form.addEventListener('submit', onSubmit);

          // apply defaults passed in via attribute
          var prefix = 'default-';
          for(var i = 0; i < this.attributes.length; i++) {
            var attribute = this.attributes.item(i);
            if (attribute.name.indexOf(prefix) === 0) {
              var name = attribute.name.slice(prefix.length);
              var input = form.querySelector('input[type="text"][name="' + name + '"]');
              if (input) input.value = attribute.value;
            }
          }
        }
      },
      // Stop listening for form submit
      detachedCallback: {
        value: function() {
          var form = this.querySelector('form');
          form.removeEventListener('submit', onSubmit);
        }
      }
    })
  });
};