GitHub 输入框添加折叠块

在 markdown 输入框自动添加添加<details>标签
目前为 2023-06-02 提交的版本。查看最新版本。
换行
// ==UserScript==
// @name         GitHub 输入框添加折叠块
// @namespace    https://github.com/ltxhhz/github-auto-add-details/
// @version      0.2
// @description  在 markdown 输入框自动添加添加<details>标签
// @author       ltxhhz
// @license      MIT
// @match        https://github.com/*
// @icon         https://github.githubassets.com/favicons/favicon.png
// @grant        none
// ==/UserScript==

(function () {
  'use strict';
  const matches=[
    'https://github.com/*/*/issues/*',
    'https://github.com/*/*/pull/*',
    'https://github.com/*/*/compare/*',
    'https://github.com/*/*/discussions/*'
  ]
  function matchUrl() {
    return matches.some(e=>(new RegExp(e.replace(/\*/g,'[^/]+'))).test(location.href))
  }
  function insertText(e, content) {
    let startPos = e.selectionStart; // 获取光标开始的位置
    let endPos = e.selectionEnd; // 获取光标结束的位置
    if (startPos === undefined || endPos === undefined) return; // 如果没有光标位置 不操作

    let oldTxt = e.value; // 获取输入框的文本内容
    let result = oldTxt.substring(0, startPos) + content + oldTxt.substring(endPos); // 将文本插入
    e.value = result; // 将拼接好的文本设置为输入框的值
    e.focus(); // 重新聚焦输入框
    e.selectionStart = startPos + content.length; // 设置光标开始的位置
    e.selectionEnd = startPos + content.length; // 设置光标结束的位置
  }
  /**
   * 根据 toolbar 定位，添加功能
   * @date 2023-01-28
   * @param {Element} e
   * @returns {any}
   */
  function add(e) {
    if (e.querySelector('.add-collapse')) return
    const quote = e.querySelector('md-quote')
    const a = document.createElement('div')
    a.id = 'add-collapse-' + Math.random().toString(16).substring(2)
    a.className = quote.className + ' add-collapse'
    a.role = 'button'
    //#region 
    a.innerHTML = `<svg t="1674907668027" class="octicon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1753" width="16" height="16"><path d="M491.904 380.638H112.171c-16.032 0-29.091 10.99-29.091 24.437 0 13.446 13.059 24.436 29.09 24.436h379.864c16.032 0 29.09-10.99 29.09-24.436-0.129-13.576-13.187-24.437-29.22-24.437z m0 216.049H112.171c-16.032 0-29.091 10.99-29.091 24.436 0 13.447 13.059 24.437 29.09 24.437h379.864c16.032 0 29.09-10.99 29.09-24.437-0.129-13.446-13.187-24.436-29.22-24.436z m-0.517 216.307H112.56c-16.291 0-29.608 10.99-29.608 24.436 0 13.447 13.188 24.437 29.608 24.437h378.828c16.42 0 29.608-10.99 29.608-24.437 0-13.446-13.188-24.436-29.608-24.436zM681.19 334.739h93.737v316.897c0 16.033 10.99 29.091 24.437 29.091 13.446 0 24.307-13.058 24.307-29.09V334.738h93.737c14.74 0 21.85-3.878 23.273-6.723 1.164-2.327-0.13-9.438-8.145-19.394l-102.53-128.258c-8.404-10.602-19.264-16.291-30.513-16.291-11.378 0-22.109 5.818-30.513 16.29L666.32 308.753c-7.886 9.955-9.18 17.066-8.016 19.393 0.905 2.716 8.146 6.594 22.885 6.594z" p-id="1754"></path><path d="M112.688 861.737h768c16.291 0 29.608-10.99 29.608-24.436s-13.188-24.436-29.608-24.436h-768c-16.29 0-29.608 10.99-29.608 24.436 0 13.576 13.188 24.436 29.608 24.436z m379.216-697.535H112.171c-16.032 0-29.091 10.99-29.091 24.436 0 13.447 13.059 24.437 29.09 24.437h379.864c16.032 0 29.09-10.99 29.09-24.437-0.129-13.446-13.187-24.436-29.22-24.436z" p-id="1755"></path></svg>`
    //#endregion
    a.onclick = function (e1) {
      insertText(e.parentElement.parentElement.querySelector('textarea'), `<details>
<summary>标题</summary>

\`\`\`
被折叠的内容
\`\`\`

</details>`)
    }
    for (let i = 0; i < e.children.length; i++) {
      const e1 = e.children[i];
      if (e1.querySelector('md-quote')) {
        e1.insertBefore(a, e1.firstElementChild)
        break
      }
    }
  }
  const _wr = function (type) {
    let orig = history[type];
    return function () {
      let rv = orig.apply(this, arguments);
      let e = new Event(type);
      e.arguments = arguments;
      window.dispatchEvent(e);
      return rv;
    };
  };
  history.pushState = _wr('pushState');
  history.replaceState = _wr('replaceState');

  // window.addEventListener('replaceState', function (e) {
  //   console.log('THEY DID IT AGAIN! replaceState 111111');
  // });
  window.addEventListener('pushState', function (e) {
    if (matchUrl()) {
      setTimeout(main, 500);
    }
  });

  function main(e) {
    const toolbars = document.querySelectorAll('markdown-toolbar')
    toolbars.forEach(add)
    console.log('添加 添加<details>标签 按钮');
    const observer = new MutationObserver((list, obs) => {
      list.forEach(e => {
        if (e.type == 'childList') {
          if (e.addedNodes.length) {
            e.addedNodes.forEach(e1 => {
              let a
              if (e1 instanceof Element && (a = e1.querySelector('markdown-toolbar'))) {
                add(a)
              }
            })
          }
        }
      })
    });
    observer.observe(document.querySelector('.js-discussion'), {
      childList: true,
      subtree: true
    }) //issue page
  }
  if (matchUrl()) {
    main()
  }
})();
欢迎访问Greasy Fork镜像
