(function() {
  const sideMenuContainer = SMcreateElement('div', {id: 'side-menu-container'})
  const sideMenuOpener = SMcreateElement('button', {
    'class': 'side-menu-opener',
    'arial-label': t('side_menu', 'Toggle the menu'),
    'html': `<span>${t('side_menu', 'Toggle the menu')}</span>`
  })
  const sideMenu = SMcreateElement('div', {id: 'side-menu'})

  const body = document.querySelector('body')
  const html = document.querySelector('html')
  const nextcloud = document.querySelector('#nextcloud')
  const logo = document.querySelector('.header-left .logo')

  const isTouchDevice = window.matchMedia("(pointer: coarse)").matches

  window.targetBlankApps = []
  window.topMenuApps = ["dashboard","activity","mail","polls","calendar","forms","files"]
  window.topSideMenuApps = ["photos","activity","audioplayer","mail","collectives","polls","notes","deck","contacts","cookbook","cospend","maps","calendar","forms","calendar_news","files","external_index1","external_index2","external_index4"]
  window.menuAppsOrder = ["mail","activity","external_index4","dashboard","files","photos","calendar","calendar_news","collectives","audioplayer","passwords","keeweb","contacts","cookbook","cospend","forms","polls","notes","external_index2","external_index1","announcementcenter","maps","fulltextsearch","deck"]
  window.topMenuAppsMouseOverHiddenLabel = 0

      sideMenu.setAttribute('data-sidewithcategories', '1')
  
  const sideMenuFocus = () => {
    let a = document.querySelector('#side-menu .side-menu-app.active a')
      || document.querySelector('#side-menu .side-menu-app a')

    if (a) {
      a.focus()
    }
  }

  document.querySelector('body').addEventListener('side-menu.apps', (e) => {
    const apps = e.detail.apps;

                })

  body.addEventListener('side-menu.ready', () => {
    const sideMenu = document.querySelector('#side-menu')
    const headerMenuOpener = document.querySelector('#header .side-menu-opener')
    const sideMenuOpener = document.querySelectorAll('#side-menu .side-menu-opener')

    if (!headerMenuOpener) {
      return
    }

    
    headerMenuOpener.addEventListener('click', () => {
      sideMenu.classList.add('open')
      headerMenuOpener.blur()
      sideMenuFocus()
    })

    for (let opener of sideMenuOpener) {
      opener.addEventListener('click', () => {
                  sideMenu.classList.remove('open')
              })
    }

    document.addEventListener('keydown', (e) => {
      var key = e.key || e.keyCode

      if ((key === 'o' || key === 79) && e.ctrlKey === true) {
        e.preventDefault()

        sideMenu.classList.toggle('open')
        sideMenuFocus()
      }
    })

    const sideMenuObserver = new MutationObserver((e) => {
      if (body.getAttribute('id') !== 'body-settings') {
        return
      }

      body.classList.toggle('body-settings-side-menu', sideMenu.classList.contains('open'))
    })

    sideMenuObserver.observe(sideMenu, {
      attributes: true,
      attributeFilter: ['class'],
      childList: false,
      characterData: false
    })
  })

  body.appendChild(sideMenuContainer)
  sideMenuContainer.appendChild(sideMenu)

      PageLoader()
  
  if (nextcloud) {
    if (logo && logo.parentNode !== nextcloud) {
      nextcloud.appendChild(logo)
    }

          nextcloud.parentNode.insertBefore(sideMenuOpener, nextcloud)
      }
})();