☰

Reddit Show Hidden Emotes

Show empty emotes (links with no text or image)

  1. // ==UserScript==
  2. // @name           Reddit Show Hidden Emotes
  3. // @namespace      reddit_show_hidden_emotes
  4. // @description    Show empty emotes (links with no text or image)
  5. // @include        http://*.reddit.com/*
  6. // @include        https://*.reddit.com/*
  7. // @match          http://*.reddit.com/*
  8. // @match          https://*.reddit.com/*
  9. // @version        1.4.2
  10. // @grant          none
  11. // ==/UserScript==
  12.  
  13. // This work is licensed under the Creative Commons Attribution 2.0 Generic License.
  14. // To view a copy of this license, visit http://creativecommons.org/licenses/by/2.0/.
  15.  
  16. whitespaceRegex = new RegExp("^[\\s]*$")
  17. redditTrimRegex = new RegExp("^http://(.*)\.reddit\.com")
  18. spaceEmoteRegex = new RegExp("^http://(.*)\.reddit\.com/sp$")
  19. minecraftRegex  = new RegExp("^http://(.*)\.reddit\.com/r/minecraft#")
  20. // This regex is needed because Chrome returns "" for pseudo elements rather than "none"
  21. noneOrBlank     = new RegExp("^(?:none)?$")
  22.  
  23. function addStyle(newStyle) {
  24.     var head = document.getElementsByTagName("head")[0];
  25.     var cssNode = document.createElement('style')
  26.     cssNode.type = 'text/css'
  27.     cssNode.appendChild(document.createTextNode(newStyle))
  28.     head.appendChild(cssNode)
  29. }
  30.  
  31. emoteStyle = ".reddit_show_hidden_emotes_span {\n" +
  32. "color: gray; word-wrap: break-word; background-color: white; " + 
  33. "border-color: gray; border-style: solid; border-width: 1px; border-radius: 5px; " +
  34. "padding-left: 4px; padding-right: 4px; " +
  35. "display: block; clear: none; float: left; " +
  36. "cursor: pointer; " +
  37. "}\n"
  38.  
  39. addStyle(emoteStyle)
  40.  
  41. function expandEmotes(postDiv) {
  42.     var innerLinks = Array.prototype.slice.call(postDiv.getElementsByTagName("a"));
  43.     for (var j in innerLinks) {
  44.         if (innerLinks[j].innerHTML.match(whitespaceRegex) ) {
  45.             // No link text
  46.             
  47.             // The ":after" query is needed here because the F7U12 CSS is freaky
  48.             if (
  49.                 (window.getComputedStyle(innerLinks[j]).getPropertyValue('background-image') == "none") &&
  50.                 (window.getComputedStyle(innerLinks[j], ':after').getPropertyValue('background-image').match(noneOrBlank) != null) &&
  51.                 (innerLinks[j].className.indexOf("hiddenEmoteExpanded") == -1) &&
  52.                 (innerLinks[j].href.match(spaceEmoteRegex) == null) && // Don't expand the r/mlp space pseudo-emote
  53.                 (innerLinks[j].href.match(minecraftRegex) == null) // r/minecraft funk
  54.                 ) {
  55.                 // No emote image
  56.                 var theDiv = document.createElement("span")
  57.                 theDiv.setAttribute("title", innerLinks[j].title)
  58.                 theDiv.setAttribute("class", "reddit_show_hidden_emotes_span")
  59.                 linkText = unescape(innerLinks[j].href.replace(redditTrimRegex, ""))
  60.                 theDiv.appendChild(document.createTextNode(linkText))
  61.                 innerLinks[j].parentNode.insertBefore(theDiv, innerLinks[j].nextSibling)
  62.                 
  63.                 // Add a class to the link so Super Reddit Alt-Text Display can put it's text in the right spot
  64.                 innerLinks[j].className = innerLinks[j].className + " hiddenEmoteExpanded"
  65.             }
  66.         }
  67.     }
  68. }
  69.  
  70. function expandChildMDs(elm) {
  71.     // Find all user created content sections and expand emotes in them
  72.     var mdElements = elm.getElementsByClassName("md")
  73.     for (var i in mdElements) {
  74.         if (mdElements[i].tagName == 'DIV') {
  75.             expandEmotes(mdElements[i]);
  76.         }
  77.     }
  78. }
  79.  
  80. // hasClass, stolen from the Reddit Enhancement Suite
  81. function hasClass(ele,cls) {
  82.   if ((typeof(ele) == 'undefined') || (ele == null)) {
  83.     console.log(arguments.callee.caller);
  84.     return false;
  85.   }
  86.   return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
  87. }
  88.  
  89. // Add a listener for the DOMNodeInserted event so we can expand emotes in new comments
  90. // created by either a reply or by clicking "load more comments" in large threads.
  91. function handleInsertion( event ) {
  92.     // The actual even we see will be the insertion of the outer "thing" div
  93.     if ((event.target.tagName == 'DIV') && (hasClass(event.target, "thing"))) {
  94.         var mdElements = event.target.getElementsByClassName("md")
  95.         for (var i in mdElements) {
  96.             if (mdElements[i].tagName == 'DIV') {
  97.                 expandEmotes(mdElements[i]);
  98.             }
  99.         }
  100.     }
  101.     else if ((event.target.tagName == 'FORM') && (hasClass(event.target, "usertext"))) {
  102.         var mdElements = event.target.getElementsByClassName("md")
  103.         for (var i in mdElements) {
  104.             if (mdElements[i].tagName == 'DIV') {
  105.                 expandEmotes(mdElements[i]);
  106.             }
  107.         }
  108.     }
  109. }
  110.  
  111. // Add a listener for the DOMNodeInserted event so we can expand emotes on the RES dashboard
  112. // This gets it's own listener because watching sitetable causes unnecessary rescans on normal submission pages.
  113. function handleSitetableInsertion( event ) {
  114.     if ((event.target.tagName == 'DIV') && (hasClass(event.target, "sitetable")) && (hasClass(event.target, "linklisting"))) {
  115.         // Insertion event for RES dashboard widgets
  116.         // Note: This causes rescans on some other pages too
  117.         //GM_log("Scanning DIV.sitetable.linklisting")
  118.         expandChildMDs(event.target)
  119.     }
  120.     else if ((event.target.tagName == 'DIV') && (hasClass(event.target, "parent"))) {
  121.         // Insertion event fow "show parent" on the RES dashboard
  122.         //GM_log("Scanning DIV.parent")
  123.         expandChildMDs(event.target)
  124.     }
  125. }
  126.  
  127. // Initial expansion of static content
  128. expandChildMDs(document)
  129.  
  130. document.body.addEventListener('DOMNodeInserted', handleInsertion, false);
  131.  
  132. if (RegExp("^https?://(?:www.)?reddit.com/r/dashboard", "i").exec(window.location)) {
  133.     // Add the listener for sitetable if we're on the RES dashboard
  134.     document.body.addEventListener('DOMNodeInserted', handleSitetableInsertion, false);
  135. }
  136. else if (RegExp("^https?://(?:www.)?reddit.com/user/", "i").exec(window.location) && document.getElementsByClassName("neverEndingReddit")) {
  137.     // Add this listener for RES never ending reddit on user pages
  138.     document.body.addEventListener('DOMNodeInserted', handleSitetableInsertion, false);
  139. }
  140.  
  141. // Interacting with the other emote adding scripts causes timing issues, so instead trying to
  142. // sync with them we just wait a good long time then remove our expansions from things they've styled.
  143. function cleanupRestyledEmotes() {
  144.     var emoteExpandElements = Array.prototype.slice.call(document.getElementsByClassName("hiddenEmoteExpanded"))
  145.     for (var i in emoteExpandElements) {
  146.         if (
  147.             (window.getComputedStyle(emoteExpandElements[i]).getPropertyValue('background-image') != "none") || 
  148.             (window.getComputedStyle(emoteExpandElements[i], ':after').getPropertyValue('background-image').match(noneOrBlank) == null)
  149.             ) {
  150.             var nes = emoteExpandElements[i].nextElementSibling
  151.             while(nes) {
  152.                 if (nes.className.indexOf("reddit_show_hidden_emotes_span") != -1) {
  153.                     nes.parentNode.removeChild(nes)
  154.                     nes = null
  155.                 }
  156.                 else {
  157.                     nes = nes.nextElementSibling
  158.                 }
  159.             }
  160.         }
  161.     }
  162. }
  163.  
  164. window.setTimeout(cleanupRestyledEmotes,2000)