overlay

MMO · 1 symbole · générée le 27 Oct 2026

namespace

overlay

Notes pinned over the page: a badge drawn next to an element, which follows it as the page scrolls -- the tickets and the checks of a page (mmo.admin's developer layer), a tour's steps, the texts a translator works on. What a note is, is its caller's: the overlay only draws it, and calls onclick.

MMO.overlay = {…}

Espace de noms: MMO

A target is a css selector; ` >>> ` goes into the shadow root of the element before it, as many times as needed (`mmo-table >>> th[name=email]`). `selectorOf` writes one for an element, `pick` lets the user point at one.

MMO.overlay.add({id: 'ticket-12', layer: 'dev', target: '#save', badge: '#12', color: 'warn', title: 'Save fails', onclick: () => open(12)});

MMO.overlay.clear('dev');

const {selector} = await MMO.overlay.pick(); // the user clicked an element

Index

	notes
	root
	frame
	find(target, from)	Find an element, into shadow roots.
	selectorOf(element)	A selector finding $element again: its id when it has one, else its tag and position under the nearest parent that has one; `>>>` where it is in a shadow root.
	add(note)	Pin a note.
	remove(id)
	clear(layer)	Remove every note, or a layer's.
	ensureRoot()
	update()	Place every pin on its target again, on the next frame.
	pick(options)	Let the user point at an element: hovering outlines it, a click picks it, Escape gives up.

Propriétés3

notes

Overlay.js:18

notes = new Map()

Type: Map<string, {note: Object, pin: HTMLElement

root

Overlay.js:20

root = null

Type: ?HTMLElement

frame

Overlay.js:21

frame = null

Méthodes8

find(target, from)

Overlay.js:29

Find an element, into shadow roots.

find(target, from = document)

target	`string`	- `a >>> b`: b in the shadow root of a
from = document	`Document` \| `ShadowRoot` \| `Element`
retourne	`?Element`

selectorOf(element)

Overlay.js:45

A selector finding $element again: its id when it has one, else its tag and position under the nearest parent that has one; >>> where it is in a shadow root.

selectorOf(element)