Itsnotlupus' Tiny Utilities

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

2023-06-10 기준 버전입니다. 최신 버전을 확인하세요.

이 스크립트는 직접 설치하는 용도가 아닙니다. 다른 스크립트에서 메타 지시문 // @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?