Fandom tablesorter

7/14/2022, 1:33:28 PM

当前为 2022-07-15 提交的版本,查看 最新版本

// ==UserScript==
// @name        Fandom tablesorter
// @namespace   Violentmonkey Scripts
// @include     https://*.fandom.com/*
// @grant       none
// @version     1.0
// @author      KraXen72
// @description 7/14/2022, 1:33:28 PM
// @require     https://code.jquery.com/jquery-3.6.0.min.js
// @license     GPLv3
// @locale      en-US
// ==/UserScript==

//document.head.appendChild(Object.assign(document.createElement("script"), { src: "https://code.jquery.com/jquery-3.6.0.min.js" }))

const tables = [...document.querySelectorAll("table.article-table")]

tables.forEach(t => t.classList = "wikitable sortable") // turn all tables into wikitable sortable

const hideCSS = `
  .hidetable::before {
      display: block;
      background: inherit;
      width: 100%;
      height: 100%;
      z-index: 4;
      position: absolute;
      top: 0;
      left: 0;
      content: "";
      border: 1px solid;
      border-color: inherit;
  }

  .hidetable {
      position: relative
  }
`

document.head.appendChild(Object.assign(document.createElement("style"), { innerHTML: hideCSS, id: "hidecss" }))
//document.head.appendChild(Object.assign(document.createElement("script"), { src: "https://phab.wmfusercontent.org/file/data/jvqc3e24jbtsuzetcac3/PHID-FILE-zf3nkj6s2iaf6qmttzj2/jquery.tablesorter.js" })) // add mediaWiki version of tablesorter
//document.head.appendChild(Object.assign(document.createElement("script"), { src: "https://kraxen72.github.io/cdn/patched%20mediawiki%20tablesorter.js" }))

function mergeClonedRows(table, nthType) {
    const tbody = table.querySelector("tbody")
    const rows = [...tbody.querySelectorAll("tr")]
    const groups = []

    for (let i = 0; i < rows.length; i++) {
        const thisTd = rows[i].querySelector(`td:nth-of-type(${nthType})`)
        thisTd.style.display = "table-cell"
        thisTd.setAttribute("rowspan", 1)

        if (i !== 0) {
            const lastTd = rows[i - 1].querySelector(`td:nth-of-type(${nthType})`)
            if (lastTd.innerHTML === thisTd.innerHTML) {
                groups[groups.length - 1].push(thisTd) // add into last existing group
            } else {
                groups.push([thisTd]) // make a new group
            }
        } else {
            groups.push([thisTd]) // make anew group since it's the first element
        }
    }

    // the first one in the group gets to stay with wide rowspan, others get hidden
    groups.forEach(group => {
        group[0].setAttribute("rowspan", group.length)
        const remainder = group.slice(1)
        remainder.forEach(r => r.style.display = "none")
    })
}

tables.forEach(t => {
    const headers = t.querySelectorAll("th")
    console.log(headers)
    $(headers).on('keypress click', function (e) {
        t.classList.add("hidetable")
        setTimeout(() => {
            for(let i = 1; i<[...headers].length + 1; i++) mergeClonedRows(t, i) // try to merge all columns
          t.classList.remove("hidetable")
        }, 0);            
    })
  
   // t.addEventListener("sortEnd.tablesorter", () => {
   //   console.log("event fired")
   // })
  // console.log($(t))
  // $(t).on("sortEnd", function() {
  //   console.log("event fired")
  //   alert(1)
  // })
  // $(t).on("click", function() {
  //   console.log("clicked table:", t)
  // })
  // $(t).delegate("th", "tableSort", function(e) {console.log(e)})
});