☰

USERSTYLES - TABLES Sorter SIMPLE

Sort Table in Your Profile page

  1. // ==UserScript==
  2. // @name        USERSTYLES - TABLES Sorter SIMPLE
  3. // @author      decembre
  4. // @namespace   https://greasyfork.org/fr/users/8-decembre 
  5.  
  6. // @description Sort Table in Your Profile page
  7.  
  8. // @include     https://userstyles.org/*
  9.  
  10. // @version     01.05
  11. // @grant       none
  12. // @require     https://greasyfork.org/scripts/12036-mutation-summary/code/Mutation%20Summary.js?version=70722
  13. // @require     https://greasyfork.org/scripts/5844-tablesorter/code/TableSorter.js
  14. // 
  15.  
  16. // FROM : Metal Archives (discography pages) - Reviews column split and sortable tables
  17. // BY darkred
  18. // https://greasyfork.org/fr/scripts/5751-metal-archives-discography-pages-reviews-column-split-and-sortable-tables/code
  19.  
  20. // This userscript uses jQuery UI, the jQuery plugin 'tablesorter' (forked by Rob Garrison (Mottie)) http://mottie.github.io/tablesorter/docs/index.html
  21. // and the JavaScript library 'Mutation Summary' (https://github.com/rafaelw/mutation-summary) (by Rafael Weinstein)
  22. //
  23. // @namespace rikkie
  24. // ==/UserScript==
  25.  
  26. // TEST for <table class="author-styles">
  27. // TEST SELECTOR
  28. // http://mottie.github.io/tablesorter/docs/example-option-selectorsort.html
  29.  
  30.   // call the tablesorter plugin
  31.   $("table").tablesorter({
  32. 	  		cssAsc: 'up',
  33. 			cssDesc: 'down',
  34.             selectorSort : 'th',
  35.             sortInitialOrder: "desc",
  36. 			widgets: ["zebra"],
  37. 			widgetOptions: {
  38. 			zebra: ["odd","even"]
  39. }
  40.  
  41. });
  42.  
  43.  
  44.  
  45. // CSS rules in order to show 'up' and 'down' arrows in each table header
  46. var stylesheet = `
  47. <style>
  48. .author-styles th {
  49. 	background-repeat: no-repeat;
  50. 	background-position: right center;
  51. //background-color: white !important;
  52. }
  53. .author-styles th.up {
  54. 	padding-right: 20px;
  55. 	background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7);
  56. background-color: white !important;
  57. }
  58. .author-styles th.down {
  59. 	padding-right: 20px;
  60. 	background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjB+gC+jP2ptn0WskLQA7);
  61. background-color: white !important;
  62. }
  63. </style>`;
  64.  
  65. $('head').append(stylesheet);