small utilities that I'm tired of digging from old scripts to put in new ones.
Per
Dit script moet niet direct worden geïnstalleerd - het is een bibliotheek voor andere scripts om op te nemen met de meta-richtlijn // @require https://updategf.qytechs.cn/scripts/468394/1203772/Itsnotlupus%27%20Tiny%20Utilities.js
// ==UserScript==
// @name Itsnotlupus' Tiny Utilities
// @namespace Itsnotlupus Industries
// @version 1.0.1
// @description small utilities that I'm tired of digging from old scripts to put in new ones.
// @author Itsnotlupus
// ==/UserScript==
/* jshint esversion:11 */
/** calls a function whenever the DOM changes */
const observeDOM = (fn, e = document.documentElement, config = { attributes: 1, childList: 1, subtree: 1 }, o = new MutationObserver(fn)) => (o.observe(e,config),()=>o.disconnect());
/** check a condition on every DOM change until true */
const untilDOM = (v, doc=document,f=typeof v==='string'?()=>doc.querySelector(v):v) => new Promise((r,_,d = observeDOM(() => (_=f()) && d() | r(_), doc.documentElement)) => 0);
/** basic async primitives */
const sleep = (w = 100) => new Promise(r=>setTimeout(r, w));
const until = async (v, w, f=typeof v==='string'?()=>document.querySelector(v):v) => { while (!f()) await sleep(w); return f(); };
/** slightly less painful syntax to create DOM trees */
const crel = (name, attrs, ...children) => ((e = Object.assign(document.createElement(name), attrs)) => (e.append(...children), e))();
/** same, for SVG content. golf me. */
const svg = (name, attrs, ...children) => {
const e = document.createElementNS('http://www.w3.org/2000/svg', name);
Object.entries(attrs).forEach(([key,val]) => e.setAttribute(key, val));
e.append(...children);
return e;
};
/** create a shadow dom with an isolated stylesheet */
const custom = (name, css, dom, e = crel(name), ss = e.attachShadow({mode:'closed'})) => (ss.adoptedStyleSheets = [ (s = new CSSStyleSheet(), s.replaceSync(css),s) ], ss.append(...dom), e);
/** stolen from https://gist.github.com/nmsdvid/8807205 */
const slowDebounce = (a,b=250,c=0)=>(...d)=>clearTimeout(c,c=setTimeout(a,b,...d));
/** microtask debounce */
const fastDebounce = (f, l, s=0) => async (...a) => (l = a, !s && (await (s=1), s = 0, f(...l)));
// Things to add later:
// - React/redux injection/inspection
// - localization micro-framework thingy
// - maybe a wrapper for moduleraid?