☰

Collapsable Diffs and Linked Branches (GitHub)

Adds a toggle to collapse diffs in GitHub's pull request and commit diff interfaces

Pada tanggal 10 April 2016. Lihat %(latest_version_link).

  1. // ==UserScript==
  2. // @name        Collapsable Diffs and Linked Branches (GitHub)
  3. // @namespace   chriskim06
  4. // @description Adds a toggle to collapse diffs in GitHub's pull request and commit diff interfaces
  5. // @include     https://github.com/*
  6. // @require     http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js
  7. // @version     1.4.5
  8. // @grant       none
  9. // @locale      en
  10. // ==/UserScript==
  11.  
  12. this.$ = this.jQuery = jQuery.noConflict(true);
  13.  
  14. $(function() {
  15.  
  16.   function collapsable() {
  17.     if ($('#files').length) {
  18.       // Add buttons in each header to allow folding the diff
  19.       var expanded = 'M0 5l6 6 6-6H0z';
  20.       var collapsed = 'M0 14l6-6L0 2v12z';
  21.       var diffs = $('#files').find('div[id^="diff-"]');
  22.       diffs.each(function() {
  23.         var diff = $(this);
  24.         var info = diff.find('.file-info');
  25.         if (!info.children().first().is('a')) {
  26.           // If the button isn't there add it and add the event handler
  27.           info.prepend(
  28.             '<a class="octicon-btn custom-collapsable" href="javascript:void(0)">' +
  29.               '<svg height="16" width="12" xmlns="http://www.w3.org/2000/svg">' +
  30.                 '<path d="' + expanded + '" />' +
  31.               '</svg>' +
  32.             '</a>'
  33.           );
  34.           diff.find('.octicon-btn.custom-collapsable').on('click', function() {
  35.             // Toggle the visibility of the diff and the direction of the arrow
  36.             var icon = $(this).find('path');
  37.             diff.children('.data.highlight.blob-wrapper').toggle();
  38.             icon.attr('d', (icon.attr('d') === collapsed) ? expanded : collapsed);
  39.             var allButton = $('#diff-collapse-button');
  40.             var visible = diffs.children('.data.highlight.blob-wrapper').is(':visible');
  41.             allButton.attr('data-toggle-state', visible ? 'expanded' : 'collapsed');
  42.             allButton.text(visible ? 'Collapse All' : 'Expand All');
  43.           });
  44.         }
  45.       });
  46.  
  47.       var diffOptions = $('.diffbar-item.dropdown.js-menu-container');
  48.       if (diffOptions.length && diffOptions.find('a').length === 2) {
  49.         // Add an Expand/Collapse All button if its not there
  50.         var blobs = diffs.children('.data.highlight.blob-wrapper');
  51.         diffOptions.find('ul').append(
  52.           '<a id="diff-collapse-button" ' +
  53.             'class="dropdown-item" ' +
  54.             'href="javascript:void(0)" ' +
  55.             'data-toggle-state="' + (blobs.is(':visible') ? 'expanded' : 'collapsed') + '">' +
  56.             (blobs.is(':visible') ? 'Collapse All' : 'Expand All') +
  57.           '</a>'
  58.         );
  59.         $('#diff-collapse-button').on('click', function() {
  60.           // Toggle the visibility of all diffs, directions of arrows, and the button
  61.           var button = $(this);
  62.           var state = (button.attr('data-toggle-state') === 'expanded');
  63.           if (state) {
  64.             blobs.hide();
  65.           } else {
  66.             blobs.show();
  67.           }
  68.           $('.octicon-btn.custom-collapsable').find('path').attr('d', state ? collapsed : expanded);
  69.           button.attr('data-toggle-state', state ? 'collapsed' : 'expanded');
  70.           button.text(state ? 'Expand All' : 'Collapse All');
  71.           diffOptions.removeClass('active');
  72.         });
  73.       }
  74.     }
  75.   }
  76.  
  77.   function makeLinks() {
  78.     var head = $('#partial-discussion-header');
  79.     if (head.length && head.find('.flex-table-item.flex-table-item-primary > a').length === 1) {
  80.       // Turn the branches being compared into links if they aren't already
  81.       var url = window.location.href.match(/(https:\/\/github\.com\/)([A-Za-z0-9_-]+(\/[A-Za-z0-9_-]+))/);
  82.       if (url) {
  83.         $('span.commit-ref.current-branch').each(function() {
  84.           var link;
  85.           var branch = this.textContent;
  86.           if (!branch.includes(':')) {
  87.             link = url[0] + '/tree/' + branch;
  88.           } else {
  89.             var split = branch.split(':');
  90.             link = url[1] + split[0] + url[3] + '/tree/' + split[1];
  91.           }
  92.           $(this).wrap('<a href="' + link + '"></a>');
  93.         });
  94.       }
  95.     }
  96.   }
  97.   
  98.   makeLinks();
  99.   collapsable();
  100.  
  101.   window.$(document).on('pjax:end pjax:complete', function() {
  102.     makeLinks();
  103.     collapsable();
  104.   });
  105.   
  106. });