// Move up when a page is absent
if (document.head.querySelector('meta[content="/404.html"]'))
  document.location.assign('..')

document.body.dataset.editUrl = '/edit/' + file.replace('.md', '')

const topSection = window.location.pathname.split('/')[1]
if (topSection) document.body.classList.add(topSection)

// Differentiate users and authors
if ('pages' === topSection) {
  document.body.classList.add('author')
} else {
  // Special URL which does not require authentication but returns browser's headers
  // thus we can deduce if user is authenticated
  //fetch('/author')
  //  .then(result => { if (result.headers.get('authorization')) document.body.classList.add('author') })
}

// Setup a "property" attribute, to send to the backend for insertion/update/deletion
document.querySelectorAll('body > header h1, main article header h1')
  .forEach(node => node.dataset.property = 'title')
document.querySelectorAll('body > header > div > div > h2')
  .forEach(node => node.dataset.property = 'description')

document.querySelectorAll('body [data-property]')
  .forEach(node => {
    node.contentEditable = true
    node.onfocus = () => preparePropertyEdition(node)
    node.onblur = () => updateProperty(node)
  })

const setupChoiceEdition = () => {
  document.querySelectorAll('body.author .ac_choice label.text, body.author .ac_choice input[type=text]')
    .forEach(node => {
      node.contentEditable = true
      node.dataset.property = `ac_choices`
      node.onfocus = () => prepareChoiceEdition(node)
      node.onblur = () => updateChoice(node)
      node.removeAttribute('for')
    })

  document.querySelectorAll('body.author .new_choice label.text, body.author .new_choice input')
    .forEach(node => node.onblur = () => createChoice(node.closest('div.ac_choice')))

  document.querySelectorAll('body.author .ac_choice button.delete')
    .forEach(node => node.onclick = () => deleteChoice(node))
}

document.addEventListener('paste', (e) => {
  if (!e.isContentEditable) return

  e.preventDefault()
  const text = (e.originalEvent || e).clipboardData.getData('text/plain')
  document.execCommand('insertText', false, text)
})

setupChoiceEdition()

tinymce.init({
  browser_spellcheck: true,
  entity_encoding: 'raw',
  inline: true,
  language: navigator.language,
  language_url: '/js/langs/' + navigator.language + '.js',
  menubar: false,
  plugins: [ 'lists', 'advlist', 'autolink', 'link', 'image', 'media',
    'charmap', 'insertdatetime', 'preview', 'table', 'fullscreen',
    'searchreplace', 'insertdatetime', 'visualblocks', 'visualchars',
    'wordcount', 'code', 'importcss' ],
  init_instance_callback: (editor) => editor.on('blur', (e) => {
    fetch(document.body.dataset.editUrl + '.content', {
      method: 'PUT',
      body: tinymce.activeEditor.getContent().replaceAll('<p>', '\n').replaceAll('</p>', '')
    })
      .catch(error => console.error('Error editing property', error))
  }),
  selector: '#content',
  toolbar1: 'save cut copy paste | undo redo | image media charmap insertdatetime | searchreplace code visualblocks fullscreen',
  toolbar2: 'removeformat bold italic strikethrough forecolor backcolor | bullist numlist outdent indent | alignleft aligncenter alignright alignjustify',
  toolbar_mode: 'wrap'
})