GitHub Commit Compare

Add controls to compare commits.

当前为 2019-04-24 提交的版本,查看 最新版本

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name        GitHub Commit Compare
// @namespace   https://github.com/jerone/UserScripts
// @description Add controls to compare commits.
// @author      jerone
// @contributor darkred
// @copyright   2017+, jerone (http://jeroenvanwarmerdam.nl)
// @license     CC-BY-NC-SA-4.0; https://creativecommons.org/licenses/by-nc-sa/4.0/legalcode
// @license     GPL-3.0-or-later; http://www.gnu.org/licenses/gpl-3.0.txt
// @homepage    https://github.com/jerone/UserScripts/tree/master/GitHub_Commit_Compare
// @homepageURL https://github.com/jerone/UserScripts/tree/master/GitHub_Commit_Compare
// @supportURL  https://github.com/jerone/UserScripts/issues
// @contributionURL https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=VCYMHWQ7ZMBKW
// @icon        https://github.githubassets.com/pinned-octocat.svg
// @include     https://github.com/*/*/commits
// @include     https://github.com/*/*/commits/*
// @exclude     https://github.com/*/*.diff
// @exclude     https://github.com/*/*.patch
// @version     0.0.3
// @grant       none
// ==/UserScript==

(function () {

  function addButton() {
    var nav;
    if ((nav = document.querySelector('.file-navigation'))) {

      // Check if our group of buttons are already attached.
      // Remove it, as the 'old' buttons don't have events anymore.
      const e = document.getElementById('GitHubCommitCompareGroup');
      if (e) {
        e.parentElement.removeChild(e);
      }
      Array.from(document.querySelectorAll('.GitHubCommitCompareButtonAB')).forEach(function (b) {
        b.parentElement.removeChild(b);
      });

      const c = document.createElement('input');
      c.type = 'checkbox';
      c.addEventListener('change',
        function () {
          const bb = document.querySelectorAll('.GitHubCommitCompareButtonAB');
          if (this.checked) {
            if (bb.length === 0) {
              addCompareButtons();
            } else {
              Array.from(bb).forEach(function (b) {
                b.classList.remove('d-none');
              });
            }
          } else {
            Array.from(bb).forEach(function (b) {
              b.classList.add('d-none');
            });
          }
          const bbb = document.getElementById('GitHubCommitCompareButton');
          if (bbb) bbb.classList.remove('disabled');
        });

      const l = document.createElement('label');
      l.classList.add('tooltipped', 'tooltipped-n');
      l.setAttribute('aria-label', 'Show commit compare buttons');
      l.style.cssText = `
        float: left;
        padding: 3px 10px;
        font-size: 12px;
        font-weight: 600;
        line-height: 20px;
        color: #24292e;
        vertical-align: middle;
        background-color: #fff;
        border: 1px solid rgba(27,31,35,0.2);
        border-right: 0;
        border-top-left-radius: 3px;
        border-bottom-left-radius: 3px;
      `;
      l.appendChild(c);

      const p = document.createElementNS('http://www.w3.org/2000/svg', 'path');
      p.setAttributeNS(null,
        'd',
        'M5 12H4c-.27-.02-.48-.11-.69-.31-.21-.2-.3-.42-.31-.69V4.72A1.993 1.993 0 0 0 2 1a1.993 1.993 0 0 0-1 3.72V11c.03.78.34 1.47.94 2.06.6.59 1.28.91 2.06.94h1v2l3-3-3-3v2zM2 1.8c.66 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2C1.35 4.2.8 3.65.8 3c0-.65.55-1.2 1.2-1.2zm11 9.48V5c-.03-.78-.34-1.47-.94-2.06-.6-.59-1.28-.91-2.06-.94H9V0L6 3l3 3V4h1c.27.02.48.11.69.31.21.2.3.42.31.69v6.28A1.993 1.993 0 0 0 12 15a1.993 1.993 0 0 0 1-3.72zm-1 2.92c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2z');

      const s = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
      s.classList.add('octicon', 'octicon-diff');
      s.setAttributeNS(null, 'height', 16);
      s.setAttributeNS(null, 'width', 14);
      s.setAttributeNS(null, 'viewBox', '0 0 14 16');
      s.appendChild(p);

      const a = document.createElement('a');
      a.id = 'GitHubCommitCompareButton';
      a.classList.add('btn', 'btn-sm', 'tooltipped', 'tooltipped-n', 'disabled');
      a.setAttribute('href', '#');
      a.setAttribute('rel', 'nofollow');
      a.setAttribute('aria-label', 'Compare these commits');
      a.style.cssText = `
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
      `;
      a.appendChild(s);
      a.appendChild(document.createElement("span"));

      const g = document.createElement('div');
      g.id = 'GitHubCommitCompareGroup';
      g.classList.add('float-right');
      g.appendChild(l);
      g.appendChild(a);

      nav.appendChild(g);
    }
  }

  function updateRadioButtons() {
    var compareAdisabled = true;
    var compareBdisabled = false;

    const compares = document.querySelectorAll('.GitHubCommitCompareButtonAB');
    Array.from(compares).forEach(function (compare) {
      const compareA = compare.querySelector('[name="GitHubCommitCompareButtonA"]');
      const compareB = compare.querySelector('[name="GitHubCommitCompareButtonB"]');

      compareA.disabled = compareAdisabled;
      compareA.parentNode.classList.toggle('disabled', compareAdisabled);

      if (compareA.checked) {
        compareBdisabled = true;
      }
      if (compareB.checked) {
        compareAdisabled = false;
      }

      compareB.disabled = compareBdisabled;
      compareB.parentNode.classList.toggle('disabled', compareBdisabled);
    });

    updateCompareButton();
  }

  function updateCompareButton() {
    const repo = document.querySelector('meta[property="og:url"]').content;

    const compareA = document.querySelector('.GitHubCommitCompareButtonAB [name="GitHubCommitCompareButtonA"]:checked');
    const hashA = compareA.parentNode.parentNode.parentNode.querySelector('clipboard-copy').value;
    const compareB = document.querySelector('.GitHubCommitCompareButtonAB [name="GitHubCommitCompareButtonB"]:checked');
    const hashB = compareB.parentNode.parentNode.parentNode.querySelector('clipboard-copy').value;

    const a = document.getElementById('GitHubCommitCompareButton');
    a.setAttribute('href', `${repo}/compare/${hashA}...${hashB}`);
    a.querySelector('span').textContent = ` ${hashA.substring(0, 7)}...${hashB.substring(0, 7)}`;

    //localStorage.setItem('GitHubCommitCompareButtonHashA', hashA);
    //localStorage.setItem('GitHubCommitCompareButtonHashB', hashB);
  }

  function addCompareButtons() {
    const commits = document.querySelectorAll('.commits-list-item .commit-links-cell');
    Array.from(commits).forEach(function (item, index) {
      const c1 = document.createElement('input');
      c1.name = 'GitHubCommitCompareButtonA';
      c1.type = 'radio';
      c1.addEventListener('change', updateRadioButtons);
      if (index === 1) c1.checked = true;

      const l1 = document.createElement('label');
      l1.classList.add('btn', 'btn-outline', 'BtnGroup-item', 'tooltipped', 'tooltipped-s');
      l1.setAttribute('aria-label', 'Choose a base commit');
      l1.appendChild(c1);

      const c2 = document.createElement('input');
      c2.name = 'GitHubCommitCompareButtonB';
      c2.type = 'radio';
      c2.addEventListener('change', updateRadioButtons);
      if (index === 0) c2.checked = true;

      const l2 = document.createElement('label');
      l2.classList.add('btn', 'btn-outline', 'BtnGroup-item', 'tooltipped', 'tooltipped-s');
      l2.setAttribute('aria-label', 'Choose a head commit');
      l2.appendChild(c2);

      // const p3 = document.createElementNS('http://www.w3.org/2000/svg', 'path');
      // p3.setAttributeNS(null,
      //'d',
      //'M5 12H4c-.27-.02-.48-.11-.69-.31-.21-.2-.3-.42-.31-.69V4.72A1.993 1.993 0 0 0 2 1a1.993 1.993 0 0 0-1 3.72V11c.03.78.34 1.47.94 2.06.6.59 1.28.91 2.06.94h1v2l3-3-3-3v2zM2 1.8c.66 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2C1.35 4.2.8 3.65.8 3c0-.65.55-1.2 1.2-1.2zm11 9.48V5c-.03-.78-.34-1.47-.94-2.06-.6-.59-1.28-.91-2.06-.94H9V0L6 3l3 3V4h1c.27.02.48.11.69.31.21.2.3.42.31.69v6.28A1.993 1.993 0 0 0 12 15a1.993 1.993 0 0 0 1-3.72zm-1 2.92c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2z');

      // const s3 = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
      // s3.classList.add('octicon', 'octicon-diff');
      // s3.setAttributeNS(null, 'height', 16);
      // s3.setAttributeNS(null, 'width', 14);
      // s3.setAttributeNS(null, 'viewBox', '0 0 14 16');
      // s3.appendChild(p3);

      // const l3 = document.createElement('a');
      // l3.classList.add('btn', 'btn-outline', 'BtnGroup-item', 'tooltipped', 'tooltipped-sw');
      // l3.setAttribute('aria-label', 'TODO');
      // l3.appendChild(s3);

      const gg = document.createElement('div');
      gg.classList.add('GitHubCommitCompareButtonAB', 'commit-links-group', 'BtnGroup');
      gg.appendChild(l1);
      gg.appendChild(l2);
      //gg.appendChild(l3);

      //item.style.width = '350px';
      if (item.querySelector('.muted-link')) { // Insert after number of comments button.
        item.insertBefore(gg, item.querySelector('.muted-link').nextSibling);
      } else {
        item.insertBefore(gg, item.firstChild);
      }
    });

    updateRadioButtons(); // Update radio buttons.
  }

  // Init.
  addButton();

  // Pjax.
  document.addEventListener('pjax:end', addButton);

})();