Reddit - Toggle Custom CSS

Persistently disable/re-enable custom subreddit styles via a userscript command

目前为 2020-05-08 提交的版本。查看 最新版本

  1. // ==UserScript==
  2. // @name Reddit - Toggle Custom CSS
  3. // @description Persistently disable/re-enable custom subreddit styles via a userscript command
  4. // @author chocolateboy
  5. // @copyright chocolateboy
  6. // @version 1.3.1
  7. // @namespace https://github.com/chocolateboy/userscripts
  8. // @license GPL: http://www.gnu.org/copyleft/gpl.html
  9. // @include http://reddit.com/r/*
  10. // @include https://reddit.com/r/*
  11. // @include http://*.reddit.com/r/*
  12. // @include https://*.reddit.com/r/*
  13. // @require https://code.jquery.com/jquery-3.5.1.slim.min.js
  14. // @require https://cdn.jsdelivr.net/gh/eclecto/jQuery-onMutate@79bbb2b8caccabfc9b9ade046fe63f15f593fef6/src/jquery.onmutate.min.js
  15. // @grant GM_addStyle
  16. // @grant GM_deleteValue
  17. // @grant GM_getValue
  18. // @grant GM_setValue
  19. // @grant GM_registerMenuCommand
  20. // @run-at document-start
  21. // @inject-into content
  22. // ==/UserScript==
  23.  
  24. // inspired by: http://userscripts-mirror.org/scripts/show/109818
  25.  
  26. const CUSTOM_CSS = 'link[ref^="applied_subreddit_"]'
  27. const DISABLE_CSS = false
  28. const SUBREDDIT = location.pathname.match(/\/r\/(\w+)/)[1]
  29.  
  30. function toggle () {
  31. const oldDisableCss = GM_getValue(SUBREDDIT, DISABLE_CSS)
  32. const disableCss = !oldDisableCss
  33.  
  34. $(CUSTOM_CSS).prop('disabled', disableCss)
  35.  
  36. if (disableCss === DISABLE_CSS) {
  37. GM_deleteValue(SUBREDDIT)
  38. } else {
  39. GM_setValue(SUBREDDIT, disableCss)
  40. }
  41. }
  42.  
  43. // NOTE we need to disable the display rather than setting its visibility to
  44. // hidden as the latter doesn't hide the background (which leads to a flash of
  45. // styled content (FOSC) on subreddits with a custom background color and/or
  46. // image)
  47. //
  48. // XXX hide the HTML element rather than the BODY element as the latter still
  49. // results in a FOSC on some subreddits e.g. /r/firefox
  50. function hidePage () {
  51. GM_addStyle('html { display: none !important }')
  52. }
  53.  
  54. const disableCss = GM_getValue(SUBREDDIT, DISABLE_CSS)
  55.  
  56. if (disableCss) {
  57. $(document).onCreate('head', hidePage)
  58.  
  59. // https://wiki.greasespot.net/DOMContentLoaded#Workaround
  60. $(document).on('DOMContentLoaded', () => {
  61. $(CUSTOM_CSS).prop('disabled', true)
  62. GM_addStyle('html { display: initial !important }')
  63. })
  64. }
  65.  
  66. GM_registerMenuCommand('Toggle Custom CSS', toggle)