☰

Komica ID search

Click ID to open search result page.

您需要先安裝使用者腳本管理器擴展,如 Tampermonkey、Greasemonkey 或 Violentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 Tampermonkey或 Violentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 Tampermonkey或 Userscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         Komica ID search
// @namespace    https://greasyfork.org/users/57176
// @match        https://gaia.komica.org/00/**
// @match        https://gaia.komica.org/00b/**
// @match        https://gaia.komica1.org/00b/**
// @match        https://gaia.komica2.cc/00b/**
// @match        https://gita.komica1.org/00b/**
// @icon         https://komica1.org/favicon.ico
// @grant        none
// @version      1.0.8
// @author       peng-devs
// @description  Click ID to open search result page.
// @allFrames    true
// @license      MIT
// ==/UserScript==
'use strict'

const NAME = 'Komica ID Search'

function createHiddenFormInput(name, value) {
  let input = document.createElement('input')
  input.type = 'hidden'
  input.name = name
  input.value = value
  return input
}

function createHiddenForm(id) {
  const form = document.createElement('form')
  form.method = 'post'
  form.action = 'pixmicat.php'
  form.target = '_blank'
  form.style = 'display:hidden'

  form.appendChild(createHiddenFormInput('mode', 'search'))
  form.appendChild(createHiddenFormInput('field', 'now'))
  form.appendChild(createHiddenFormInput('method', 'AND'))
  form.appendChild(createHiddenFormInput('keyword', id))

  return form
}

function searchId(event) {
  const id = event.currentTarget.dataset.id
  if (!id) return

  const form = createHiddenForm(id)
  document.body.appendChild(form)
  form.submit()
  document.body.removeChild(form)
}

function observingThreadChanges(thread) {
  const observer = new MutationObserver(mutationList => {
    mutationList.forEach(mutation => {
      if (mutation.target.nodeName.toLowerCase() != 'span'
        || !mutation.target.className.includes('id'))
        return

      mutation.target.removeEventListener('click', searchId)  // just in case
      mutation.target.addEventListener('click', searchId)
    })
  })
  observer.observe(thread, { subtree: true, childList: true })

  return observer
}


try {
  console.log(`[${NAME}] Initializing...`)

  const thread = document.getElementById('threads')
  thread.querySelectorAll('span.id')
    .forEach(ele => ele.addEventListener('click', searchId))

  // The 'span.id' are post-rendered elements. They may not exist when our codes
  // are executing. So we use observer to catch them when they are created.
  observingThreadChanges(thread)

  console.log(`[${NAME}] Loaded`)
} catch(err) {
  console.error(`[${NAME}] `, err)
}