Dark Reader

Toggle dark mode using an icon placed at the bottom left of your screen. Hotkey: Command + Shift + B

  1. // ==UserScript==
  2. // @name Dark Reader
  3. // @description Toggle dark mode using an icon placed at the bottom left of your screen. Hotkey: Command + Shift + B
  4. // @author Schimon Jehudah, Adv.
  5. // @namespace i2p.schimon.dimmer
  6. // @homepageURL https://gf.qytechs.cn/en/scripts/466058-dark-reader
  7. // @supportURL https://gf.qytechs.cn/en/scripts/466058-dark-reader/feedback
  8. // @copyright 2023, Schimon Jehudah (http://schimon.i2p)
  9. // @license MIT; https://opensource.org/licenses/MIT
  10. // @icon data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48dGV4dCB5PSIuOWVtIiBmb250LXNpemU9IjkwIj7wn5SFPC90ZXh0Pjwvc3ZnPgo=
  11. // @match *://*/*
  12. // @exclude devtools://*
  13. // @version 23.06.11
  14. // @require https://unpkg.com/darkreader@4.9.58/darkreader.js
  15. // @noframes
  16. // @grant GM.getValue
  17. // @grant GM.setValue
  18. // ==/UserScript==
  19.  
  20. /* TODO
  21.  
  22. Toggle color of button.
  23. btn.style.filter = 'hue-rotate(500deg)'
  24. See https://noscript.net/ or
  25. use a plain character '●'.
  26. btn.style.color = 'black' */
  27.  
  28.  
  29. if (document.doctype == null) { return; }
  30.  
  31. //enable()
  32.  
  33. const
  34. namespace = 'i2p-schimon-dimmer',
  35. btn = document.createElement(namespace);
  36.  
  37. // create button
  38. (async function createButton() {
  39. // create element
  40. document.body.append(btn);
  41. // set content
  42. btn.textContent = '🔆';
  43. btn.id = namespace;
  44. btn.style.all = 'unset';
  45. // set position
  46. btn.style.position = 'fixed';
  47. btn.style.bottom = 0;
  48. btn.style.left = 0;
  49. // set appearance
  50. btn.style.marginTop = '100px';
  51. btn.style.marginRight = '10px';
  52. btn.style.minWidth = '50px';
  53. btn.style.minHeight = '50px';
  54. btn.style.fontSize = '20px';
  55. btn.style.zIndex = 10000;
  56. btn.style.opacity = 0.5;
  57. //btn.style.transition = 'all .5s ease .5s';
  58. btn.onmouseover = () => {
  59. document
  60. .getElementById(namespace)
  61. .style.opacity = 0.9;
  62. };
  63. btn.onmouseout = () => {
  64. document
  65. .getElementById(namespace)
  66. .style.opacity = 0.3;
  67. };
  68. // center character
  69. btn.style.justifyContent = 'center';
  70. btn.style.alignItems = 'center';
  71. btn.style.display = 'flex';
  72. // disable selection marks
  73. btn.style.outline = 'none';
  74. btn.style.userSelect = 'none';
  75. btn.style.cursor = 'default';
  76. // set button behaviour
  77. btn.onclick = () => {
  78. //btn.onclick = async () => {
  79. try {
  80. toggle();
  81. //await toggle();
  82. } catch (err) {
  83. toggleByShape();
  84. console.warn('No support for Greasemonkey API');
  85. console.error(err);
  86. }
  87. };
  88. try {
  89. if (await GM.getValue('dimmer')) {
  90. enable()
  91. } else {
  92. disable();
  93. }
  94. } catch (err) {
  95. console.warn('No support for Greasemonkey API');
  96. console.error(err);
  97. }
  98. })();
  99.  
  100. // set hotkey
  101. document.onkeyup = function(e) {
  102. //if (e.ctrlKey && e.shiftKey && e.which == 190) { // Ctrl + Shift + <
  103. //if (e.metaKey && e.shiftKey && e.which == 68) { // Command + Shift + D
  104. if (e.metaKey && e.shiftKey && e.which == 66) { // Command + Shift + B
  105. toggle();
  106. }
  107. };
  108.  
  109. // toggle mode
  110. async function toggle() {
  111. if (await GM.getValue('dimmer')) {
  112. await GM.setValue('dimmer', false);
  113. disable();
  114. } else {
  115. await GM.setValue('dimmer', true);
  116. enable();
  117. }
  118. }
  119.  
  120. // toggle mode
  121. function toggleByShape() {
  122. if (btn.textContent == '🔆') {
  123. enable()
  124. } else {
  125. disable();
  126. }
  127. }
  128.  
  129. function disable() {
  130. DarkReader.disable({
  131. brightness: 100,
  132. contrast: 90,
  133. sepia: 10
  134. });
  135. btn.textContent = '🔆';
  136. //return '🔆';
  137. }
  138.  
  139. function enable() {
  140. DarkReader.setFetchMethod(window.fetch); // https://eligrey.com/
  141. DarkReader.enable({
  142. brightness: 100,
  143. contrast: 90,
  144. sepia: 10
  145. });
  146. btn.textContent = '🔅';
  147. //return '🔅';
  148. }
  149.  
  150. // Set mode temporarily per session or until storage is cleared
  151.  
  152. function getPreference(key) {
  153. return window.localStorage.getItem(key);
  154. }
  155.  
  156. function setPreference(key, value) {
  157. return window.localStorage.setItem(key, value);
  158. }

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址