☰

GitHub images as icons

Show images in Github repositories source tree as 16x16 icons

当前为 2014-10-24 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        GitHub images as icons
  3. // @description Show images in Github repositories source tree as 16x16 icons
  4. // @namespace   wOxxOm.scripts
  5. // @include     https://github.com/*
  6. // @match       https://github.com/*
  7. // @version     1.01
  8. // @grant       GM_addStyle
  9. // @run-at      document-start
  10. // ==/UserScript==
  11.  
  12. function addStyle(e) {
  13.   GM_addStyle('.wOxxOm-image-icon { max-width:16px; max-height:16px; width:auto; height:auto; margin-left:-2px }')
  14.   window.removeEventListener('DOMContentLoaded', addStyle);
  15.   iconify(document.body);
  16. }
  17. window.addEventListener('DOMContentLoaded', addStyle);
  18.  
  19. function iconify(n) {
  20.   var aa = (n.className == 'js-directory-link') ? [n] : n.getElementsByClassName('js-directory-link');
  21.   for (var a, i=0; i<aa.length && (a=aa[i++]); ) {
  22.     var r = a.href.match(/github\.com\/(.+?\/)blob\/([^\/]+\/.+?\.(?:png|jpg|jpeg|bmp|gif|cur|ico))$/);
  23.     if (!r)
  24.       continue;
  25.  
  26.     var td = a.parentNode.parentNode.previousElementSibling;
  27.     if (td.localName != 'td')
  28.       continue;
  29.     
  30.     var icon = td.firstElementChild;
  31.     var img = icon.nextElementSibling;
  32.     if (!img)
  33.       td.insertBefore(img = document.createElement('img'), icon);
  34.     
  35.     icon.style.display = 'none';
  36.     img.className = 'wOxxOm-image-icon';
  37.     img.src = 'https://raw.githubusercontent.com/' + r[1] + r[2];
  38.   }
  39. }
  40.  
  41. var ob = new MutationObserver(function(mutations){
  42.   for (var m, i=0; i<mutations.length && (m=mutations[i++]) && (mtg=m.target); )
  43.     if (mtg.id == 'js-repo-pjax-container' || (mtg.className == 'files' && mtg.localName == 'table'))
  44.       for (var nn=m.addedNodes, n, j=0; j<nn.length && (n=nn[j++]); )
  45.         if (n.nodeType == Node.ELEMENT_NODE)
  46.             iconify(n);
  47. });
  48. ob.observe(document, {subtree:true, childList:true});