☰

Itsnotlupus' Tiny Utilities

small utilities that I'm tired of digging from old scripts to put in new ones.

Version vom 10.06.2023. Aktuellste Version

Dieses Skript sollte nicht direkt installiert werden. Es handelt sich hier um eine Bibliothek für andere Skripte, welche über folgenden Befehl in den Metadaten eines Skriptes eingebunden wird // @require https://update.greatest.deepsurf.us/scripts/468394/1203263/Itsnotlupus%27%20Tiny%20Utilities.js 

// ==UserScript==
// @name         Itsnotlupus' Tiny Utilities
// @namespace    Itsnotlupus Industries
// @version      1.0
// @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 slowDdebounce = (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?