(() => {

// quick reply spoiler fix
(() => {
  const addspoiler = () => {
    $qr = $('#quick-reply')
    if (($qr.length == 0) || ($qr.find('input[name="spoiler"]').length != 0)) return;
    $qr.find('div.banner').append(' ', $('<span></span>').attr("title", _('Spoiler Image')).append($('<input id="q-spoiler-image" name="spoiler" type="checkbox">'), $('<label for="q-spoiler-image">').text("SI")))
  };
  addspoiler()
  $(window).on('quick-reply', addspoiler)
})();

// catalog links
Array.from (document.querySelectorAll ("div.boardlist a")).filter (a => a.hasAttribute ("href")).forEach (a => {
  href = a.getAttribute ("href")
  ma   = href.match (/^(\/[^\/]+\/)index.html$/)
  if (ma != null) {
    cata = ma [1] + "catalog.html"
  } else if (href == "/overboard/") {
    cata = "/overboard/catalog.html"
  } else {
    cata = null
  }
  if (cata != null) {
    e = document.createElement ("a")
    e.setAttribute ("href", cata)
    e.innerText = "+"
    a.insertAdjacentElement ("afterend", e)
  }
});

// thread stats + Unique IPs
(() => {
  $('.clear').after($('#thread_stats'))
  $('#uniqueip > span').attr('style', 'display: block;  float:   right;  margin:  0em 1em;')
})();

// post filter individual hiding
(() => {
  const pcid2tid = (board, pcid) => {
    const n = document.querySelector ('[data-board="' + board + '"].thread > div#' + pcid)
    return n == null ? null : n.parentNode.getAttribute ('id').replace ('thread_', '')
  }
  const merge = (have, posts) => {
    let changed = false
    for (p of posts) {
      if (!have.some (e => e.post === p.post)) {
        have.push (p)
        changed = true
      }
    }
    return changed
  }
  const fixids = () => {
    let lspf    = JSON.parse (localStorage.postFilter)
    let changed = false
    for (const [board, threads] of Object.entries (lspf.postFilter)) {
      for (const [id, posts] of Object.entries (threads)) {
        if (!id.startsWith ('pc')) { continue; }
        const tid = pcid2tid (board, id)
        if (tid == null) { continue; }
        if (tid in threads) {
          const have = threads [tid]
          if (merge (have, posts)) { changed = true; }
        } else {
          threads [tid] = posts
          changed = true
        }
        delete threads [id]
      }
    }
    if (changed) {
      lspf = JSON.stringify (lspf)
      localStorage.postFilter = lspf
      $(document).trigger('filter_page')
    }
  }
  fixids ()
  $(document).on('filter_page', fixids)

  // post-filter.js
  const removepost = function (boardId, threadId, postId) {
    const list   = JSON.parse (localStorage.postFilter)
    const filter = list.postFilter

    // thread already pruned
    if (typeof filter[boardId] == 'undefined' || typeof filter[boardId][threadId] == 'undefined') return;

    for (var i=0; i<filter[boardId][threadId].length; i++) {
      if (filter[boardId][threadId][i].post == postId) {
        filter[boardId][threadId].splice(i, 1);
        break;
      }
    }

    if ($.isEmptyObject(filter[boardId][threadId])) {
      delete filter[boardId][threadId];
      delete list.nextPurge[boardId][threadId];

      if ($.isEmptyObject(filter[boardId])) {
        delete filter[boardId];
        delete list.nextPurge[boardId];
      }
    }

    localStorage.postFilter = JSON.stringify (list)
  }

  Menu.onclick(function (e, $buffer) {
    var ele      = e.target.parentElement.parentElement;
    var $ele     = $(ele);
    var threadId = $ele.parents('.thread').attr('id').replace('thread_', '');
    var boardId  = $ele.parent().data('board');
    var postId   = $ele.find('.post_no').not('[id]').text();

    if ($ele.data('hidden')) {
      $buffer.find('#filter-menu-unhide').click(function () {
        removepost(boardId, threadId, postId)
        $(document).trigger('filter_page')
      })
    }
  })
})();

// sorted, labeled style selector
(() => {
  $('#style-select > select').before ('Select theme: ')
  const selected = $('div.styles > a.selected').attr ('id').replace ('style-select-', '')
  const stylesSelect = $('<select></select>').css ({float: "none"})

  Array.from (document.querySelectorAll ('div.styles > a')).map (a => [a.innerText.replace (/^\[(.+)\]$/, '$1'), a.getAttribute ('id').replace ('style-select-', '')]).sort ((a, b) => {
    const au = a [0].toUpperCase ()
    const bu = b [0].toUpperCase ()
    if (au < bu) { return -1; }
    if (au > bu) { return  1; }
    return 0
  }).forEach (([name, id]) => {
    const opt = $('<option></option>').html(name).val(id)
    if (id === selected) { opt.attr('selected', true); }
    stylesSelect.append(opt)
  })

  $('#style-select > select').detach ()
  stylesSelect.change(function() {
    $('#style-select-' + $(this).val()).click()
  })
  $('#style-select').append (stylesSelect)
})();

})()