☰

Logging Handler & UI Overlay

Logger that optionally mirror to a on-page UI overlay shared by every page match-common userscript

Este script no debería instalarse directamente. Es una biblioteca que utilizan otros scripts mediante la meta-directiva de inclusión // @require https://update.greasyfork.org/scripts/588114/1882370/Logging%20Handler%20%20UI%20Overlay.js

Cómo instalar

Tendrás que instalar una extensión para tu navegador como Tampermonkey, Greasemonkey o Violentmonkey si quieres utilizar este script.

You will need to install an extension such as Tampermonkey to install this script.

Tendrás que instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Userscripts para instalar este script.

Tendrás que instalar una extensión como Tampermonkey antes de poder instalar este script.

Necesitarás instalar una extensión para administrar scripts de usuario si quieres instalar este script.

(Ya tengo un administrador de scripts de usuario, déjame instalarlo)

Cómo instalar

Tendrás que instalar una extensión como Stylus antes de poder instalar este script.

Tendrás que instalar una extensión como Stylus antes de poder instalar este script.

Tendrás que instalar una extensión como Stylus antes de poder instalar este script.

Para poder instalar esto tendrás que instalar primero una extensión de estilos de usuario.

Para poder instalar esto tendrás que instalar primero una extensión de estilos de usuario.

Para poder instalar esto tendrás que instalar primero una extensión de estilos de usuario.

(Ya tengo un administrador de estilos de usuario, déjame instalarlo)

Autor
SassyRhombus
Versión
1.0.0
Creado
22/07/2026
Actualizado
22/07/2026
Tamaño
11.7 KB
Licencia
BSD-0

Overview

One logging call, two sinks: the browser console and a translucent, click-through log panel pinned to the top-right of the page.

  • exposed as a global (LoggingUI.create) for @require
  • the panel is a page-level singleton, keyed off its DOM id. Userscripts run in separate sandboxes and cannot see each other's variables, but they do share the document -- so the first instance to need the panel builds it and every later instance adopts the node that is already there. n scripts on a page therefore produce one panel, not n stacked copies.
  • every line carries a timestamp and the caller's short tag; the tag is coloured from a hash of itself, so each participating script is distinguishable at a glance without any central registry of colours
  • severities are debug/info/warn/error, coloured white/blue/yellow/red, and map onto console.debug/info/warn/error
  • the panel body is dimmed until hovered, so it never competes with the page

Toggle scoping:

  • the panel is shared page state. Flipping it from any instance shows/hides the one panel for all of them, and stamps the new state onto the panel node; other instances observe that stamp and follow, persisting it as their own preference so the choice survives a reload no matter which script's menu command was used.
  • the console mirror is per-instance: each script decides independently whether it also talks to devtools.

Persistence is best-effort. GM_getValue and GM_setValue are used when the calling script granted them; without the grants the toggles simply live for the lifetime of the page.

Usage

// @require https://update.greasyfork.org/...
// @grant   GM_getValue
// @grant   GM_setValue
// @grant   GM_registerMenuCommand

const logger = LoggingUI.create({
    name: '$NAME',             // console prefix
    tag: 'gcr',                // panel prefix
    console: true,             // default console mirror
    panel: true,               // default panel visibility
    panelSink: !IS_PROFILE,    // this instance may write
});

logger.registerMenuCommands();  // optional: two GM menu toggles

logger.info('feed seeded with %d comments', n);
logger.warn('poll failed:', err);

API

method(s) note
logger.debug info
logger.log(...args) alias of info
logger.consoleEnabled getter/setter (boolean)
logger.panelEnabled getter/setter (boolean, page-wide)
logger.toggleConsole() / togglePanel() flip and persist, returns new state
logger.registerMenuCommands(opts) register the two GM menu toggles
logger.clear() empty the shared panel
logger.element the panel node, or null