_createMainStructure() {
    // root DOM element of PhotoSwipe (.pswp)
    this.element = createElement('pswp', 'div');
    this.element.setAttribute('tabindex', '-1');
    this.element.setAttribute('role', 'dialog'); // template is legacy prop

    this.template = this.element; // Background is added as a separate element,
    // as animating opacity is faster than animating rgba()

    this.bg = createElement('pswp__bg', 'div', this.element);
    this.scrollWrap = createElement('pswp__scroll-wrap', 'section', this.element);
    this.container = createElement('pswp__container', 'div', this.scrollWrap); // aria pattern: carousel

    this.scrollWrap.setAttribute('aria-roledescription', 'carousel');
    this.container.setAttribute('aria-live', 'off');
    this.container.setAttribute('id', 'pswp__items');
    this.mainScroll.appendHolders();
    this.ui = new UI(this);
    this.ui.init(); // append to DOM

    (this.options.appendToEl || document.body).appendChild(this.element);
  }
Create main HTML structure of PhotoSwipe,
and add it to DOM

@private