☰

Hide badges I've already attained

Adds a checkbox to the Badges page to optionally hide badges you've already attained, from the list

  1.  // ==UserScript==
  2. // @name        Hide badges I've already attained
  3. // @description Adds a checkbox to the Badges page to optionally hide badges you've already attained, from the list
  4. // @namespace   http://stackoverflow.com/users/1563422/danny-beckett
  5. // @version     1.0
  6. // @grant
  7. // @include     http://*.stackexchange.com/badges*
  8. // @include     http://answers.onstartups.com/badges*
  9. // @include     http://askubuntu.com/badges*
  10. // @include     http://meta.askubuntu.com/badges*
  11. // @include     http://meta.serverfault.com/badges*
  12. // @include     http://meta.stackoverflow.com/badges*
  13. // @include     http://serverfault.com/badges*
  14. // @include     http://stackapps.com/badges*
  15. // @include     http://stackoverflow.com/badges*
  16. // @include     http://superuser.com/badges*
  17. // ==/UserScript==
  18.  
  19. // Vars
  20. var attained = document.getElementsByClassName('badge-earned-check');
  21.  
  22. // Checks whether a toggle state is saved
  23. function exists()
  24. {
  25.     return document.cookie.indexOf('badgehider_' + location.host + '=') >= 0;
  26. }
  27.  
  28. // Gets the toggle state
  29. function get()
  30. {
  31.     for(var i = 0; pair = document.cookie.split('; ')[i].split('='); i++)
  32.         if(pair[0] == 'badgehider_' + location.host)
  33.             return unescape(pair[1]) === '1';
  34.  
  35.     return false;
  36. }
  37.  
  38. // Sets the toggle state
  39. function set(shown)
  40. {
  41.     document.cookie = 'badgehider_' + location.host + '=' + (shown ? '1' : '0');
  42. }
  43.  
  44. // Toggles the toggle state & hides/shows rows
  45. function toggle()
  46. {
  47.     var state = get();
  48.  
  49.     for(var i = 0; i < attained.length; i++)
  50.         attained[i].parentNode.parentNode.style.display = state ? 'table-row' : 'none';
  51.  
  52.     set(!state);
  53. }
  54.  
  55. // Set the default toggle state
  56. if(!exists())
  57.     set(false);
  58.  
  59. // Setup the container
  60. var span = document.createElement('span');
  61. span.style.float = 'left';
  62.  
  63. // Setup the toggle box
  64. var box = document.createElement('input');
  65. box.onclick = function(){ toggle(); };
  66. box.checked = get() ? 'checked' : null;
  67. box.id = 'badgehider';
  68. box.type = 'checkbox';
  69. box.style.cursor = 'pointer';
  70.  
  71. // Setup the label
  72. var label = document.createElement('label');
  73. label.innerHTML = " Hide badges I've already attained";
  74. label.setAttribute('for', 'badgehider');
  75. label.style.cursor = 'pointer';
  76.  
  77. // Write out
  78. span.appendChild(box);
  79. span.appendChild(label);
  80. document.getElementsByClassName('subtabs')[0].appendChild(span);
  81.  
  82. // Box already checked from before
  83. if(get())
  84.     for(var i = 0; i < attained.length; i++)
  85.         attained[i].parentNode.parentNode.style.display = 'none';