Imgur: fix HTML escape sequences in the old design

Imgur's "old design" sometimes includes HTML escape sequences in post descriptions, such as having """ and "'" instead of quotation marks. This replaces them with the appropriate characters.

  1. // ==UserScript==
  2. // @name Imgur: fix HTML escape sequences in the old design
  3. // @namespace http://tampermonkey.net/
  4. // @version 1.2.0
  5. // @description Imgur's "old design" sometimes includes HTML escape sequences in post descriptions, such as having """ and "'" instead of quotation marks. This replaces them with the appropriate characters.
  6. // @author Corrodias
  7. // @match https://imgur.com/gallery/*
  8. // @icon https://www.google.com/s2/favicons?sz=64&domain=imgur.com
  9. // @grant none
  10. // @license MIT
  11. // ==/UserScript==
  12.  
  13. (function() {
  14. 'use strict';
  15.  
  16. if (typeof imgur === 'undefined') return; // This is not the old design.
  17.  
  18. const mutationObserver = new MutationObserver(mutations => {
  19. for (const mutation of mutations) {
  20. for (const node of mutation.addedNodes) {
  21. if (node.nodeType === Node.ELEMENT_NODE)
  22. processAddedNode(node);
  23. }
  24. }
  25. });
  26.  
  27. function processAddedNode(node) {
  28. // Only act if a new post has been loaded.
  29. if (!node.classList.contains('post-image-container')) return;
  30. replaceText(node);
  31. }
  32.  
  33. function replaceText(post) {
  34. // This is empty if the current page is not a post.
  35. const description = post.getElementsByClassName('post-image-description');
  36. for (const a of description) {
  37. a.textContent = a.textContent
  38. .replaceAll('"', '"')
  39. .replaceAll(''', "'")
  40. .replaceAll('>', '>')
  41. .replaceAll('&lt;', '<')
  42. .replaceAll('&amp;', '&');
  43. }
  44. }
  45.  
  46. // Run the replacement now in case this is a post.
  47. replaceText(document.body);
  48.  
  49. // Monitor dynamically loaded content, for when the user nagivates to a new post. Observe as little as possible.
  50. const postContent = document.body.getElementsByClassName('post-images');
  51. for (const a of postContent) {
  52. mutationObserver.observe(a, { attributes: false, childList: true, subtree: true });
  53. }
  54. })();