☰

Darken

Add menuitem into browser context menu to darken the web page. For Firefox 11.0 and newer only.

  1. /*
  2.     Darken
  3.     Add menuitem into browser context menu to darken the web page.
  4.     Compatibility: Firefox 11.0 or newer.
  5.     Copyright (C) 2012 LouCypher
  6.  
  7.     This program is free software: you can redistribute it and/or modify
  8.     it under the terms of the GNU General Public License as published by
  9.     the Free Software Foundation, either version 3 of the License, or
  10.     (at your option) any later version.
  11.  
  12.     This program is distributed in the hope that it will be useful,
  13.     but WITHOUT ANY WARRANTY; without even the implied warranty of
  14.     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  15.     GNU General Public License for more details.
  16.  
  17.     You should have received a copy of the GNU General Public License
  18.     along with this program. If not, see <http://www.gnu.org/licenses/>
  19. */
  20.  
  21. // ==UserScript==
  22. // @name            Darken
  23. // @namespace       http://userscripts.org/users/12
  24. // @description     Add menuitem into browser context menu to darken the web page. For Firefox 11.0 and newer only.
  25. // @version         3.0.1
  26. // @author          LouCypher
  27. // @contributor     luckymouse (CSS)
  28. // @license         GPL
  29. // @homepageURL     https://greasyfork.org/scripts/14
  30. // @supportURL      https://greasyfork.org/scripts/14/feedback
  31. // @resource        css https://raw.github.com/LouCypher/userscripts/master/darken/darken.css
  32. // @resource        license https://raw.github.com/LouCypher/userscripts/master/licenses/GPL/LICENSE.txt
  33. // @include         *
  34. // ==/UserScript==
  35.  
  36. if (frameElement) return;
  37.  
  38. const STYLE_ID = "userscript-darken-style";
  39. var isDark = sessionStorage.getItem("dark-site");
  40. if (isDark) darken();
  41.  
  42. if (!(document.head && document.body)) return;
  43. var menu = document.body.appendChild(document.createElement("menu"));
  44. var html = document.documentElement;
  45. if (html.hasAttribute("contextmenu")) {
  46.   // We don't want to override web page context menu if any
  47.   var contextmenu = $("#" + html.getAttribute("contextmenu"));
  48.   contextmenu.appendChild(menu); // Append to web page context menu
  49. } else {
  50.   html.setAttribute("contextmenu", "userscript-darken-context-menu");
  51. }
  52.  
  53. menu.outerHTML = '<menu id="userscript-darken-context-menu"\
  54.                         type="context">\
  55.                     <menuitem id="userscript-darken-menuitem"\
  56.                               type="checkbox"\
  57.                               label="Darken">\
  58.                     </menuitem>\
  59.                   </menu>';
  60.  
  61. if ("contextMenu" in html && "HTMLMenuItemElement" in window) {
  62.   var menuitem = $("#userscript-darken-menuitem");
  63.   if (isDark) menuitem.setAttribute("checked", "true");
  64.   // Executed on clicking a menuitem
  65.   menuitem.addEventListener("click", toggleDarken, false);
  66. }
  67.  
  68. function darken() {
  69.   var style = $("head").appendChild(document.createElement("style"));
  70.   style.id = STYLE_ID;
  71.   style.textContent = GM_getResourceText("css");
  72.   sessionStorage.setItem("dark-site", true);
  73. }
  74.  
  75. function toggleDarken() {
  76.   var x = pageXOffset;
  77.   var y = pageYOffset
  78.   var styleNode = document.getElementById(STYLE_ID);
  79.   if (styleNode) {
  80.     styleNode.parentNode.removeChild(styleNode);
  81.     sessionStorage.removeItem("dark-site");
  82.   } else {
  83.     darken();
  84.   }
  85.   scrollTo(x, y); // Restore scroll positions
  86. }
  87.  
  88. function $(aSelector, aNode) {
  89.   return (aNode || document).querySelector(aSelector);
  90. }