// ==UserScript==
// @name         NGA论坛Vtuber讨论区表情包
// @version      0.0.2
// @description  清露イクナ　湊あくあ（均已授权）
// @author       hoshikaze
// @match        *://bbs.ngacn.cc/post.php*
// @match        *://ngabbs.com/post.php*
// @match        *://nga.178.com/post.php*
// @match        *://bbs.nga.cn/post.php*
// @grant        none
// @namespace https://greasyfork.org/users/296667
// @downloadURL none
// ==/UserScript==

(function() {
  'use strict';
  const addStyle = (css) => {
    const style = document.createElement('style')
    style.innerText = css
    document.head.appendChild(style)
  }

  addStyle(`
  .single_ttip2 .div3 > div {
    padding: 4px 4px 0 4px;
  }
  .single_ttip2 .div3 > div:empty {
    display: inline-block;
    padding: 0;
  }
  .vtb-sticker img {
    max-height: 130px;
    cursor: pointer;
  }
  `)

  const stickers = ['./mon_201904/01/-zue37Q5-aki2KlToS1x-1o.png','./mon_201904/01/-zue37Q5-g8wdKoToS1x-1o.png','./mon_201904/01/-zue37Q5-eqmKlToS1x-1o.png','./mon_201904/01/-zue37Q5-6ae0KmToS1x-1o.png','./mon_201904/01/-zue37Q5-bwarKoToS1x-1o.png','./mon_201904/30/-88lruQ5-6s2bKzToS4g-3m.png',
  './mon_201904/30/-88lruQ5-l5q4KzToS4g-3m.png',
  './mon_201904/30/-88lruQ5-drj3KvToS4g-3m.png',
  './mon_201904/30/-88lruQ5-6z8fKwToS4g-3m.png',
  './mon_201904/30/-88lruQ5-lakzK11ToS4g-3m.png',
  './mon_201904/30/-88lruQ5-8c88KvToS4g-3m.png',
  './mon_201904/30/-88lruQ5-c58KvToS4g-3m.png',
  './mon_201904/30/-88lruQ5-e8xyK10ToS4g-3m.png',
  './mon_201904/30/-88lruQ5-hxdqKvToS4g-3m.png',
  './mon_201904/30/-88lruQ5-a34dKuToS4g-3m.png',
  './mon_201904/30/-88lruQ5-2pqhKyToS4g-3m.png',
  './mon_201904/30/-88lruQ5-gtu0KzToS4g-3m.png',
  './mon_201904/30/-88lruQ5-8cwvKxToS4g-3m.png',
  './mon_201904/30/-88lruQ5-fry6KvToS4g-3m.png',
  './mon_201904/30/-88lruQ5-7dm7KxToS4g-3m.png',
  './mon_201904/30/-88lruQ5-fx5xKyToS4g-3m.png',
  './mon_201904/30/-88lruQ5-h8pxKwToS4g-3m.png',
  './mon_201904/30/-88lruQ5-i0qyKrToS4g-3m.png',
  './mon_201904/30/-88lruQ5-75twKrToS4g-3m.png',
  './mon_201904/30/-88lruQ5-jcorKrToS4g-3m.png',
  './mon_201904/30/-88lruQ5-gdz8KpToS4g-3m.png',
  './mon_201904/30/-88lruQ5-8tynKpToS4g-3m.png',
  './mon_201904/30/-88lruQ5-1lsdKrToS4g-3m.png',
  './mon_201904/30/-88lruQ5-g9e8KsToS4g-3m.png',
  './mon_201904/30/-88lruQ5-9ig8KqToS4g-3m.png',
  './mon_201904/30/-88lruQ5-31n5KsToS4g-3m.png',
  './mon_201904/30/-88lruQ5-ctslKmToS4g-3m.png',
  './mon_201904/30/-88lruQ5-5934KwToS4g-3m.png'
  ]
  let recentStickers = []
  try {
    recentStickers = JSON.parse(localStorage.getItem('vtb-sticker'))
    if (!Array.isArray(recentStickers)) {
      recentStickers = []
    }
  } catch (e) {}
  window.saveRecentvtbSticker = (sticker) => {
    if (recentStickers.includes(sticker)) return
    recentStickers.push(sticker)
    recentStickers = recentStickers.slice(-10)
    localStorage.setItem('vtb-sticker', JSON.stringify(recentStickers))
  }
  window.setvtbSticker = (btn) => {
    const stickerBox = btn.nextSibling
    if (stickerBox) {
      if (btn.dataset.status === 'show') {
        stickerBox.classList.add('x')
        btn.dataset.status = 'hide'
        return
      } else if (btn.dataset.status === 'hide') {
        stickerBox.classList.remove('x')
        btn.dataset.status = 'show'
        return
      }
      let html = ''
      if (recentStickers.length) {
        recentStickers.forEach(sticker => {
          const src = `https://img.nga.178.com/attachments/${sticker.slice(2)}`
          html += `
          <img onclick="window.saveRecentvtbSticker('${sticker}');postfunc.addText('[img]${sticker}[/img]');postfunc.dialog.w._.hide()" src="${src}">
          `
        })
        html = `<div>${html}</div>`
      }
      stickers.forEach(sticker => {
        const src = `https://img.nga.178.com/attachments/${sticker.slice(2)}`
        html += `
        <img onclick="window.saveRecentvtbSticker('${sticker}');postfunc.addText('[img]${sticker}[/img]');postfunc.dialog.w._.hide()" src="${src}">
        `
      })
      stickerBox.insertAdjacentHTML('beforeend', html)
      btn.dataset.status = 'show'
    }
  }

  const insertBtn = () => {
    if (document.querySelector('button#vtb-sticker')) return
    const box = document.querySelector('#uiAddTag .div3')
    box.insertAdjacentHTML('beforeend', '<button id="vtb-sticker" onclick="window.setvtbSticker(this)">VTB专区</button><div class="vtb-sticker"></div>')
  }
  const mutationCallback = (mutationsList) => {
    for (let mutation of mutationsList) {
      const type = mutation.type
      const addedNodes = mutation.addedNodes
      if (type === 'childList' && addedNodes.length && addedNodes.length < 2) {
        addedNodes.forEach(node => {
          if (node.id === 'uiAddTag' || (node.classList && node.classList.contains('div3'))) {
            insertBtn()
          }
        })
      }
    }
  }

  const obConfig = {
    subtree: true,
    childList: true
  }

  const targetNode = document.body
  const observer = new MutationObserver(mutationCallback)
  observer.observe(targetNode, obConfig)
})();