Greasy Fork is available in English.

GitHub Sortable Filelist

appends sorting function to github directories

Version vom 18.11.2014. Aktuellste Version

  1. // ==UserScript==
  2. // @name GitHub Sortable Filelist
  3. // @namespace trespassersW
  4. // @description appends sorting function to github directories
  5. // @include https://github.com/*
  6. // @version 14.11.17.11
  7. // .11 patch for the very first page
  8. // .10 datetime auto-updating fix; right-aligned datetime column; proper local time; .ext sorting fix;
  9. // .8 sorting by file extention
  10. // .7 date/time display mode switching
  11. // .4 now works on all github pages
  12. // @created 2014-11-10
  13. // @updated 2014-11-18
  14. // @author trespassersW
  15. // @license MIT
  16. // @icon https://i.imgur.com/8buFLcs.png
  17. // (C) Icon: Aaron Nichols CC Attribution 3.0 Unported
  18. // @run-at document-end
  19. // @grant GM_none
  20. // ==/UserScript==
  21.  
  22. if(document.body && document.querySelector('#js-repo-pjax-container')){ // .file-wrap
  23.  
  24. var llii=0, _l= function(){/* * /
  25. for (var s=++llii +':', li=arguments.length, i = 0; i<li; i++)
  26. s+=' ' + arguments[i];
  27. console.log(s)
  28. /* */
  29. }
  30. var fakejs = // avoid compiler warning
  31. (function(){ "use strict";
  32.  
  33. var ii=0,tt;
  34. var d0=[0,0,1];
  35. var C=[{c:1, d: 0, s: 0},{c:2, d: 0, s: 0},{c:3, d: 1, s: 0}];
  36. var ASC;
  37. var oa=[],ca=[],clock,ext,dtStyle;
  38. var D=document, TB;
  39. var catcher,locStor;
  40. var prefs={dtStyle:0, ext: 0};
  41.  
  42. function stickStyle(css){
  43. var s=document.createElement("style"); s.type="text/css";
  44. s.appendChild(document.createTextNode(css));
  45. return (document.head||document.documentElement).appendChild(s);
  46. }
  47. function insBefore(n,e){
  48. return e.parentNode.insertBefore(n,e);
  49. }
  50. function insAfter(n,e){
  51. if(e.nextElementSibling)
  52. return e.parentNode.insertBefore(n,e.nextElementSibling);
  53. return e.parentNode.appendChild(n);
  54. }
  55. function outerNode(target, node) {
  56. if (target.nodeName==node) return target;
  57. if (target.parentNode)
  58. while (target = target.parentNode) try{
  59. if (target.nodeName==node)
  60. return target;
  61. }catch(e){};
  62. return null;
  63. }
  64. function savePrefs(){
  65. if(locStor) locStor.setItem('GHSFL',JSON.stringify(prefs));
  66. }
  67.  
  68. function css(){
  69. stickStyle('\
  70. .fsort-butt,\n\
  71. .tables.file td.content, .tables.file td.message, .tables.file td.age\n\
  72. {position: relative; }\n\
  73. .fsort-butt:before{\n\
  74. position: absolute; display: inline-block;\n\
  75. cursor: pointer;\n\
  76. content: "";\n\
  77. width: 16px; height: 16px;\n\
  78. }\n\
  79. .fsort-butt.fsort-asc:before,.fsort-butt.fsort-desc:before{\n\
  80. opacity:.2;\n\
  81. left:1.5em; top: -1em;\n\
  82. width: 0; height: 0;\n\
  83. }\n\
  84. td.age.fsort-butt.fsort-asc:before,td.age.fsort-butt.fsort-desc:before{\n\
  85. right:3em;\n\
  86. }\n\
  87. .fsort-asc:before,.fsort-desc:before{\n\
  88. border-style: solid;\n\
  89. border-color: #654;\n\
  90. }\n\
  91. .fsort-asc:before,\n\
  92. .fsort-desc.fsort-sel:hover:before\n\
  93. {\n\
  94. border-left: 6px solid transparent;\n\
  95. border-right: 6px solid transparent;\n\
  96. border-bottom-width: 14px;\n\
  97. border-top-width: 0;\n\
  98. }\n\
  99. .fsort-desc:before,\n\
  100. .fsort-asc.fsort-sel:hover:before{\n\
  101. border-left: 6px solid transparent;\n\
  102. border-right: 6px solid transparent;\n\
  103. border-bottom-width: 0;\n\
  104. border-top-width: 14px;\n\
  105. }\n\
  106. \n\
  107. .fsort-sel:before,\n\
  108. .fsort-sel:before{\n\
  109. border-bottom-color: #4183C4 !important;\n\
  110. border-top-color: #4183C4 !important;\n\
  111. }\n\
  112. \n\
  113. .fsort-butt.fsort-sel:before{ opacity: .6 }\n\
  114. .fsort-butt:hover:before{ opacity: 1 !important;}\n\
  115. \n\
  116. #fsort-clock:before{\n\
  117. left:4.5em; top:-1.2em;\n\
  118. border-radius: 16px;\n\
  119. opacity:1;\n\
  120. content: url(data:image/png;base64,\
  121. iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAlZJREFUeNqkU0tLG1EUvjORFJPMw6mhTUgxy75EUxiJj6CGLKQV0o2IQd3pxp2bbPs/3MVCIHSRgC3uXBhCSErjtLRkK7TcNCYhk4eGPHvO6AwjXXrgu/fOOff77plzz2VGoxF5iI3hEA6HCcuyxGKxEIZhOMBLcHsAwt0+FfAbDvsFaA4GAzIcDkkqlboVMNlzB8+vzgUCq3N+v+xyOl3opFdXNJfN5nPn52dNVT0DV/FeBjpZcjrfR/b3Dzwul0e02ciPiwsyPTtLptxur7C25n0xMzMfPzoSypQmdREWB0iLt3NcKLK3dzAhSR5+fFxT/JbPG+row9g2HABZhpBjCMA/vZYDgRVOFD02q5WwDKOROp2OIYA+jDlgz8Ly8gpyDIF+v++d9vlkXDdubshlpaKhWCwaawTGsHg+WZaRY9QAPiYEUXyinzY1OanNzWbTWGv7gPynViO4FzlmARavcWgivw2FSDAYJDubm4TjOA0Oh4O8WVwk80tLGscsoLZUtWwThGf6afFEgmxvbZGP8biRAbac2u2S60ajjByjBr1e7/JrJqOMQSNhmmiCJGlknHVAAckjuI1cOq0gx3wLyudkMt1ttejgTkAXMRsWkO106KdEIo0cQwAC9b+l0umHaPRYrVaphWX/63n0XasqjR4eHlNKT5FzrxPBoXxXFEtkY6Ozs7u78G59/dVTt/sxdkSJ0uqXk5OfsVgsU6lUUjzPKzqPwdfo8/lIF4pTr9dJu92WID0/tjZAv8MKti48tqzdbq+JUAsrNFWhULgVeIj9E2AAamUckFr2UCoAAAAASUVORK5CYII=\n\
  122. );}\n\
  123. #fsort-clock:before{ background-color: #CCC }\n\
  124. #fsort-clock.fsort-on:before{ background-color: #4183C4 }\n\
  125. \n\
  126. td.age .fsort-butt.fsort-asc:before,td.age .fsort-butt.fsort-desc:before{\
  127. left:3em !important;\
  128. }\
  129. #fsort-ext:before{\n\
  130. left:4em; top:-14px;\n\
  131. border-radius: 6px;\n\
  132. width:28px;height:16px;\n\
  133. opacity:.3;\n\
  134. content:url(data:image/png;base64,\
  135. iVBORw0KGgoAAAANSUhEUgAAABoAAAANCAYAAAC3mX7tAAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsTAAALEwEAmpwYAAABWUlEQVQ4y+2SP0sDQRDFT7BQTGtnITYSK8Emha1NCrXwC4gWYiUKiiB4jYKdWAmC4AewtxEExSqVjZ1/OEgwrEQwkLvbmd/aTCBI0IBYCD7YYmaYfW/mTRT9VWRZNq6qm79OBBwBrueGPM8ngWvgHbgXkQX7aC+EEFR1x+IDi7dUdQOQYACuviSp1+tDQA2oquoycAlInucT1Wp1EHgA3r3300AG3FUqlX4RKQOvQFNVV0Rk9ksiEZkzRbtJkgx476faqq1etnoK4L0vdazuqefVqepq6ALgKIqiKI7jPuDRcpVPHn1P5JwrxHHc1zHRofe+1H5pmo6akCWrv4QQgojMdxA9AI3vzPfAsXOuACRAXVW3VXUNOM2yrNhsNofNh1qapmPAG5A45wpGdGMiToD9bvdftKZ9I54ALoCGXd5tq9UaAc7Mr0Wbbr09vfk3Azybf+fRP36KDxJ2sN2uMATcAAAAAElFTkSuQmCC);\n\
  136. }\n\
  137. #fsort-ext:before{ background-color: #CCC}\n\
  138. .fsort-sel ~ #fsort-ext:before {opacity:.6;}\n\
  139. .fsort-on:before{ background-color: #4183C4 !important;}\n\
  140. .fsort-on:hover:before{ opacity:1}\n\
  141. \n\
  142. table.files td.age .css-truncate.css-truncate-target{\n\
  143. width: 99% !important; \n\
  144. max-width: none !important;\n\
  145. }\n\
  146. /*table.files td.age span.css-truncate time{\n\
  147. position: relative !important;\n\
  148. }*/\n\
  149. .fsort-time {\n\
  150. visibility: hidden;\n\
  151. display: none;\n\
  152. padding-right: 14px;\n\
  153. }\n\
  154. \n\
  155. /* patches */\n\
  156. table.files td.age {text-align: right !important; padding-right: 10px !important;\n\
  157. width:10em!important;\n\
  158. min-width:10em!important;\n\
  159. max-width:none!important;\n\
  160. overflow:visible!important;\n\
  161. }\n\
  162. table.files td.message {overflow: visible !important;}\n\
  163. ');
  164.  
  165.  
  166. dtStyle=stickStyle('\
  167. td.age span.css-truncate time{\
  168. visibility: hidden !important;\
  169. display: none !important;\
  170. }\
  171. td.age span.css-truncate .fsort-time {\
  172. visibility: visible !important;\
  173. display: inline !important;\
  174. }\
  175. ')
  176. }
  177.  
  178. function setC(n){
  179. for(var i=0,il=C.length; i<il; i++ ){
  180. if(i!=n) C[i].s= 0, C[i].d=d0[i];
  181. else C[i].s=1;
  182. oa[i].className='fsort-butt fsort-'+(C[i].d?'desc':'asc')+(C[i].s?' fsort-sel':'') ;
  183. oa[i].title=C[i].d? '\u21ca' : '\u21c8';
  184. }
  185. }
  186.  
  187. function dd(s)
  188. { s=s.toString(); if(s.length<2)return'0'+s; return s}
  189. function d2s(n){
  190. return {
  191. d: n.getFullYear()+'-'+dd(n.getMonth())+'-'+dd(n.getDate()),
  192. t: dd(n.getHours())+':'+dd(n.getMinutes())+':'+dd(n.getSeconds())
  193. }
  194. }
  195.  
  196. function setDateTime(x){
  197. var dt,dtm;
  198. var DT=D.querySelectorAll('td.age span.css-truncate time');
  199. try{
  200. for(var dl=DT.length, i=0; i<dl; i++){
  201. dt= d2s(new Date( DT[i].getAttribute('datetime') )); // 2014-07-24T17:06:11Z
  202. if(x){
  203. dtm=DT[i].parentNode.querySelector('.fsort-time');
  204. }else{
  205. dtm=D.createElement('span');
  206. dtm.className='fsort-time';
  207. }
  208. if(!x || dtm.title != DT[i].title){
  209. dtm.title= DT[i].title;
  210. if(/minut|hour|just/.test(DT[i].textContent))
  211. dtm.textContent=dt.t;
  212. else
  213. dtm.textContent=dt.d;
  214. }
  215. if(!x) insAfter(dtm,DT[i]);
  216. }
  217. }catch(e){(console.log(e+'\n*GHSFL* wrong datetime'))}
  218. }
  219.  
  220. function isDir(x){
  221. return (TB.rows[x].cells[0].querySelector("span.octicon-file-directory")) != null;
  222. }
  223.  
  224. var sDir,sCells,sExts;
  225. var fa=[
  226. function(a){
  227. return TB.rows[a].cells[1].querySelector('span.css-truncate-target a').textContent;
  228. },
  229. function(a){
  230. return TB.rows[a].cells[2].querySelector('span.css-truncate').textContent;
  231. },
  232. function(a){
  233. return TB.rows[a].cells[3].querySelector('span.css-truncate>time').getAttribute('datetime');
  234. }
  235. ]
  236.  
  237. var b9='\x20\x20\x20'; b9+=b9+b9;
  238. function pad9(s){
  239. if(s.length<9) return (s+b9).substr(0,9);
  240. return s;
  241. }
  242. function sort_p(n){// prepare data for sorting
  243. sDir=[],sCells=[];
  244. for(var tl=TB.rows.length, a=0; a<tl; a++) sDir.push(isDir(a));
  245. if( n === 0 && prefs.ext ){
  246. for( a=0; a<tl; a++){ // f.x -> x.f
  247. var x=fa[n](a),
  248. m= x.match(/(.*)(\..*)$/);
  249. if(!m || !m[2]) m=['',x,''];
  250. x=pad9(m[2])+' '+m[1];
  251. sCells.push(x);
  252. }
  253. }else for( a=0; a<tl; a++) sCells.push(fa[n](a));
  254. }
  255.  
  256. function sort_fn(a,b){
  257. var x=sDir[a], y=sDir[b];
  258. if(x!=y) return ((x<y)<<1)-1;
  259. x= sCells[a], y= sCells[b];
  260. return x==y? 0: (((x>y)^ASC)<<1)-1;
  261. }
  262.  
  263. var CNn={content: 0, message: 1, age: 2}
  264.  
  265. function oClr(){
  266. var o= catcher.querySelectorAll('.fsort-butt')
  267. for(var ol=o.length,i=0;i<ol;i++)
  268. o[i].parentNode.removeChild(o[i]);
  269. }
  270. //
  271. function extclassName(){
  272. ext.className='fsort-butt'+ (prefs.ext? ' fsort-on': '' );
  273. }
  274. function clockclassName(){
  275. clock.className='fsort-butt'+ (prefs.dtStyle? '': ' fsort-on');
  276. }
  277. //
  278. function doSort(t){
  279. TB=outerNode(t,'TBODY');
  280. if(!TB){ _l( "*GHSFL* TBODY not found"); return; }
  281. var n=CNn[t.parentNode.className];
  282. if(typeof n=="undefined"){ _l( "*GHSFL* undefined col"); return; }
  283. if(t.id=='fsort-clock'){
  284. dtStyle.disabled = (prefs.dtStyle ^= 1);
  285. savePrefs();
  286. clockclassName();
  287. return;
  288. }
  289. var xt = (t.id=='fsort-ext');
  290. if( xt ){
  291. if(C[n].s) prefs.ext ^= 1;
  292. else prefs.ext= 1;
  293. savePrefs();
  294. extclassName();
  295. C[n].d^=C[n].s; // don't toggle dir on ext.click
  296. }
  297. var tb=[],ix=[], i, tl;
  298. _l('n:'+n);
  299. tl=TB.rows.length;
  300. ASC=C[n].d^=C[n].s;
  301. for( i=0; i<tl; i++)
  302. ix.push(i);
  303. oClr();
  304. sort_p(n);
  305. ix.sort(sort_fn);
  306. for( i=0; i<tl; i++)
  307. tb.push(TB.rows[ix[i]].innerHTML);
  308. for( i=0; i<tl; i++)
  309. TB.rows[i].innerHTML=tb[i];
  310. setC(n);
  311. gitDir1(0);
  312. }
  313.  
  314. function onClik(e){doSort(e.target)}
  315.  
  316. function gitDir1(x){
  317. if(x && document.querySelector('.fsort-butt')) {
  318. _l('gitDir'+x+ '- already'); return;
  319. }
  320. _l('gitDir'+x)
  321. var c,o;
  322. ca=[];
  323. c= D.querySelector('.file-wrap table.files td.content >span');
  324. if(!c){ _l( '*GHSFL* no content') ; return; }
  325. ca.push(c);
  326. c=D.querySelector('.file-wrap table.files td.message >span');
  327. if(!c){ _l( '*GHSFL* no messages'); return; }
  328. ca.push(c);
  329. c=D.querySelector('.file-wrap table.files td.age >span');
  330. if(!c){_l( '*GHSFL* no ages'); return; }
  331. ca.push(c);
  332. if(x){ oClr(); oa=[];
  333. o=D.createElement('span');
  334. o.textContent='';
  335. oa.push(o);
  336. o=o.cloneNode(true);
  337. oa.push(o);
  338. o=o.cloneNode(true);
  339. oa.push(o);
  340. clock=D.createElement('span');
  341. clock.id='fsort-clock'; clockclassName();
  342. ext=D.createElement('span');
  343. ext.id='fsort-ext'; extclassName();
  344. setDateTime();
  345. setC(-1);
  346. }
  347. insBefore(oa[0],ca[0]);
  348. insBefore(ext,ca[0]);
  349. insBefore(oa[1],ca[1]);
  350. insBefore(oa[2],ca[2]);
  351. insBefore(clock,ca[2]);
  352. }
  353.  
  354. function gitDir(){
  355. gitDir1(1);
  356. }
  357.  
  358.  
  359. catcher= D.querySelector('#js-repo-pjax-container');
  360. if(!catcher){ _l( "*GHSFL* err0r"); return; }
  361.  
  362. catcher.addEventListener('mousedown',function(e){
  363. if(e.target.nodeName && e.target.nodeName=='SPAN' &&
  364. e.target.className.indexOf('fsort-butt')>-1)
  365. { onClik(e); }
  366. }
  367. ,false);
  368.  
  369. _l('startup()');
  370.  
  371. try {
  372. locStor = window.localStorage;
  373. tt=locStor.getItem("GHSFL");
  374. } catch(e){ locStor =null}
  375.  
  376. if(locStor && tt) try{
  377. prefs =JSON.parse(tt);
  378. }catch(e){ console.log(e+"\n*GHSFL* bad prefs") }
  379.  
  380. css();
  381. dtStyle.disabled=(prefs.dtStyle===1);
  382.  
  383. gitDir();
  384. var target = catcher; //document.body; //D.querSelector('.file-wrap');
  385. var MO = window.MutationObserver;
  386. if(!MO) MO= window.WebKitMutationObserver;
  387. if(!MO) return;
  388. var __started=0;
  389. var mutI=0;
  390. var observer = new MO(function(mutations) {
  391.  
  392. for(var m,t, ml=mutations.length, i=0; i<ml; i++)
  393. {
  394. m=mutations[i],t = m.target;
  395. if( m.type=="attributes")
  396. {
  397. if( t.nodeName == 'DIV' &&
  398. t.className == "file-wrap"
  399. ){
  400. gitDir();
  401. return;
  402. }
  403. // patch for the very first page
  404. if( 0===__started && t.nodeName=='TIME' )
  405. {
  406. if( t.parentNode.parentNode.className=="age" )
  407. {
  408. //_l('T'+mutI++,ml,' T:' +m.type,'N:'+t.nodeName, 'C:',"age" ) ;
  409. setDateTime(1);
  410. __started=1;
  411. return;
  412. }
  413. else continue;
  414. }
  415. }
  416. if( m.type=="childList" )
  417. {
  418. if( t.className=='age' )
  419. {
  420. //_l('C'+mutI++,ml,' T:' +m.type,'N:'+t.nodeName,'C:'+ t.className,t.querySelector('TIME').textContent) ;
  421. setDateTime(1);
  422. return;
  423. }
  424. else continue;
  425. }
  426. }
  427. });
  428.  
  429. observer.observe(D.body, { attributes: true, childList: true, subtree: true } );
  430. /* attributes: true , childList: true, subtree: true,
  431. characterData: true, attributeOldValue:true, characterDataOldValue:true
  432. */
  433.  
  434. })()};