docs: function() {
        this.classList.add('overlay');
  
        this.parentEl_ = this.ownerDocument.body;
  
        this.visible_ = false;
        this.userCanClose_ = true;
  
        this.onKeyDown_ = this.onKeyDown_.bind(this);
        this.onClick_ = this.onClick_.bind(this);
        this.onFocusIn_ = this.onFocusIn_.bind(this);
        this.onDocumentClick_ = this.onDocumentClick_.bind(this);
        this.onClose_ = this.onClose_.bind(this);
  
        this.addEventListener('visible-change',
            tr.ui.b.Overlay.prototype.onVisibleChange_.bind(this), true);
  
        // Setup the shadow root
        var createShadowRoot = this.createShadowRoot ||
            this.webkitCreateShadowRoot;
        this.shadow_ = createShadowRoot.call(this);
        this.shadow_.appendChild(tr.ui.b.instantiateTemplate('#overlay-template',
                                                          THIS_DOC));
  
        this.closeBtn_ = this.shadow_.querySelector('close-button');
        this.closeBtn_.addEventListener('click', this.onClose_);
  
        this.shadow_
            .querySelector('overlay-frame')
            .addEventListener('click', this.onClick_);
  
        this.observer_ = new WebKitMutationObserver(
            this.didButtonBarMutate_.bind(this));
        this.observer_.observe(this.shadow_.querySelector('button-bar'),
                               { childList: true });
  
        // title is a variable on regular HTMLElements. However, we want to
        // use it for something more useful.
        Object.defineProperty(
            this, 'title', {
              get: function() {
                return this.shadow_.querySelector('title').textContent;
              },
              set: function(title) {
                this.shadow_.querySelector('title').textContent = title;
              }
            });
      }