obooman / Decobim Swagger Enhancement

// ==UserScript==
// @name         Decobim Swagger Enhancement
// @namespace    http://oboochin.com/
// @version      0.1
// @description  keyword search & path copy improvement.
// @author       Oboo Chin
// @match        http://*/v1/swagger-ui.html*
// @require      https://unpkg.com/clipboard@1.7.1/dist/clipboard.min.js
// @grant        none
// @license     MIT
// ==/UserScript==

// https://developer.chrome.com/extensions/match_patterns
(function () {
  "use strict";
  let timer = null;
  let inited = false;

  timer = setInterval(
    () => {
      if (!inited) {
        const elementArr = document.querySelectorAll(".http_method");
        if (elementArr.length !== 0) {
          inited = true;
          initScript();
        }
      }
      else {
        const btns = document.querySelectorAll(".oboo-btn")
        if (btns.length == 0) {
          initScript();
        }
      };

    },
    1000
  );

  function initScript() {
    const elementArr = document.querySelectorAll(".http_method");
    const blockArr = document.querySelectorAll("#resources > .resource");

    blockArr.forEach(ele => {
      const button = document.createElement("button");
      button.innerHTML = "复制";
      button.classList.add("button");

      ele.querySelector(".heading").children[0].prepend(button);

      const paths = new Set();

      [...ele.querySelector(".endpoints").children].forEach(li => {
        paths.add(li.querySelector(".path").children[0].innerHTML);
      });

      button.dataset.clipboardText = Array.from(paths).join("\n");

      new Clipboard(button);
    });

    elementArr.forEach(ele => {
      // Path copy
      const anchorEle = document.createElement("button");

      const backColor = getComputedStyle(
        ele.children[0]
      ).getPropertyValue("background-color");

      ele.innerHTML = "";
      ele.appendChild(anchorEle);

      anchorEle.innerHTML = "复制";
      anchorEle.classList.add("button");
      anchorEle.style.backgroundColor = backColor;
      anchorEle.style.color = "white";
      anchorEle.style.fontSize = "14px";
      anchorEle.style.border = "none";
      anchorEle.style.padding = "4px 10px";
      anchorEle.dataset.clipboardText = ele.parentElement.parentElement.parentElement.id.split("_")[1]

      new Clipboard(anchorEle);
    });

    const expandAllButton = document.createElement("button");
    expandAllButton.onclick = expandAll;
    expandAllButton.innerHTML = "展开";
    expandAllButton.classList.add("oboo-btn")

    const collapseAllButton = document.createElement("button");
    collapseAllButton.onclick = collapse;
    collapseAllButton.innerHTML = "合并";

    document.querySelector("#message-bar").prepend(expandAllButton);
    document.querySelector("#message-bar").prepend(collapseAllButton);
  }

  function expandAll() {
    const list = document.querySelector("#resources");
    const items = list.children;

    [...items].forEach(li => {
      li.classList.add("active");
      li.querySelector("ul.endpoints").style.display = "block";
    });
  }

  function collapse() {
    const list = document.querySelector("#resources");
    const items = list.children;

    [...items].forEach(li => {
      li.classList.remove("active");
      li.querySelector("ul.endpoints").style.display = "none";
    });
  }
})();