Greasy Fork

Greetings!

I want to add an element at document-start (i.e. before page load).

I have a userscript which utilizes the library Dark Reader and is loaded at document-end;

I have an issue of "a jarring flash of white light" upon page load.

I was thinking of using this userscript as a template, yet I am not familiar emough with MutationObserver, and my attempt has failed.

This is my most recent attempt:

(function initDimmer() {
  //document.addEventListener("loadeddata", () => {
    let cvr = document.createElement(namespace + '-cover');
    cvr.style.background = '#333';
    cvr.style.position = 'fixed';
    cvr.style.bottom = 0;
    cvr.style.right = 0;
    cvr.style.left = 0;
    cvr.style.top = 0;
    //while (!document.body) {
      setTimeout(console.log('wait'), 500);
      if (document.body) {
      alert()
        document.body.append(cvr);
      }
    //}
  //});
})();

(async function activateDimmer() {
  //document.addEventListener("DOMContentLoaded", async function() {
    //let cvr = document.querySelector(namespace + '-cover');
    //while (!cvr) {
    //  if (cvr) {
    //      cvr.remove();
    //  }
    //}
    //document.querySelector(namespace + '-cover').remove();
    try {
      if (await GM.getValue('dimmer')) {
        enable()
      } else {
        disable();
      }
    } catch (err) {
      console.warn('Greasemonkey API GM.getValue appears to be missing!');
      console.error(err);
    }
  //});
})();

Please help.

I used a library to help me with that
https://greasyfork.org/en/scripts/424595-night-mode

hacker09, please help me.

I have added the library and replaced line: (async function createButton() { by document.events.on('bodyloaded', async () => {.

Line })(); has changed to }).

If I'm facing this problem, I'll simply use my lib and then wrote the following code:

// @require            https://update.greasyfork.org/scripts/456034/1348286/Basic%20Functions%20%28For%20userscripts%29.js

async function displayCover() {
    const body = await detectDom('body');
    const cvr = $CrE('div');
    const hideCvr = () => cvr.remove();
    cvr.style.cssText = 'left: 0; top: 0; right: 0; bottom: 0; position: fixed; background: #222222; z-index: 999999';
    cvr.ondblclick = hideCvr; // If anything went wrong, double-click to remove cover.
    body.appendChild(cvr);
    document.readyState === 'loading' && document.addEventListener('DOMContentLoaded', hideCvr);
}

But you might not willing to use a personal lib which is not stable. So try this one if you like, or follow the documentation of MutationObserver if you'd like to code without any external dependencies.

hacker09 and PYUDNG, does any of you want to take charge if Dimmer (Dark Reader) userscript?

I need time to make tests and observations which I am not willing to do now, while I want to complete this task.

It looks like my script, short simple, and good.
I am not sure either if I would have time to test and update it, but if you want me to, sure.

if you want me to, sure

Yes. Thank you.

I generally use command line, text browsers like Lynx and also Gemini/Gopher browsers, so I do not make an extensive use of my own userscripts, aside from "Paper Clip" sometimes.

I make userscripts in order to fill gaps that some "extensions" provide (e.g. "CleanURLs" and "Newpaper"), and I also despise some sort of regulations - foisted by software vendors - which happen to contrast people's privacy.

So, the more people to replace me in the responsibility of these userscripts the better.