Grabbed dndbeyond's source code
``` ~/go/bin/sourcemapper -output ddb -jsurl https://media.dndbeyond.com/character-app/static/js/main.90aa78c5.js ```
This commit is contained in:
+270
@@ -0,0 +1,270 @@
|
||||
// Observables.tsx
|
||||
import { useRef, useEffect, useState } from "react";
|
||||
import useMutationObserver from "@rooks/use-mutation-observer";
|
||||
import ResizeObserver from "resize-observer-polyfill";
|
||||
var Observables = ({
|
||||
mutationObservables,
|
||||
resizeObservables,
|
||||
refresh
|
||||
}) => {
|
||||
const [mutationsCounter, setMutationsCounter] = useState(0);
|
||||
const ref = useRef(document.documentElement || document.body);
|
||||
function refreshHighlightedRegionIfObservable(nodes) {
|
||||
const posibleNodes = Array.from(nodes);
|
||||
for (const node of posibleNodes) {
|
||||
if (mutationObservables) {
|
||||
if (!node.attributes) {
|
||||
continue;
|
||||
}
|
||||
const found = mutationObservables.find(
|
||||
(observable) => node.matches(observable)
|
||||
);
|
||||
if (found) {
|
||||
refresh(true);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
function incrementMutationsCounterIfObservable(nodes) {
|
||||
const posibleNodes = Array.from(nodes);
|
||||
for (const node of posibleNodes) {
|
||||
if (resizeObservables) {
|
||||
if (!node.attributes) {
|
||||
continue;
|
||||
}
|
||||
const found = resizeObservables.find(
|
||||
(observable) => node.matches(observable)
|
||||
);
|
||||
if (found)
|
||||
setMutationsCounter(mutationsCounter + 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
useMutationObserver(
|
||||
ref,
|
||||
(mutationList) => {
|
||||
for (const mutation of mutationList) {
|
||||
if (mutation.addedNodes.length !== 0) {
|
||||
refreshHighlightedRegionIfObservable(mutation.addedNodes);
|
||||
incrementMutationsCounterIfObservable(mutation.addedNodes);
|
||||
}
|
||||
if (mutation.removedNodes.length !== 0) {
|
||||
refreshHighlightedRegionIfObservable(mutation.removedNodes);
|
||||
incrementMutationsCounterIfObservable(mutation.removedNodes);
|
||||
}
|
||||
}
|
||||
},
|
||||
{ childList: true, subtree: true }
|
||||
);
|
||||
useEffect(() => {
|
||||
if (!resizeObservables) {
|
||||
return;
|
||||
}
|
||||
const resizeObserver = new ResizeObserver(() => {
|
||||
refresh();
|
||||
});
|
||||
for (const observable of resizeObservables) {
|
||||
const element = document.querySelector(observable);
|
||||
if (element) {
|
||||
resizeObserver.observe(element);
|
||||
}
|
||||
}
|
||||
return () => {
|
||||
resizeObserver.disconnect();
|
||||
};
|
||||
}, [resizeObservables, mutationsCounter]);
|
||||
return null;
|
||||
};
|
||||
var Observables_default = Observables;
|
||||
|
||||
// useRect.tsx
|
||||
import { useEffect as useEffect2, useCallback, useState as useState2 } from "react";
|
||||
function getRect(element) {
|
||||
let rect = initialState;
|
||||
if (element) {
|
||||
const domRect = element.getBoundingClientRect();
|
||||
rect = domRect;
|
||||
}
|
||||
return rect;
|
||||
}
|
||||
function useRect(ref, refresher) {
|
||||
const [dimensions, setDimensions] = useState2(initialState);
|
||||
const handleResize = useCallback(() => {
|
||||
if (!(ref == null ? void 0 : ref.current))
|
||||
return;
|
||||
setDimensions(getRect(ref == null ? void 0 : ref.current));
|
||||
}, [ref == null ? void 0 : ref.current]);
|
||||
useEffect2(() => {
|
||||
handleResize();
|
||||
window.addEventListener("resize", handleResize);
|
||||
return () => window.removeEventListener("resize", handleResize);
|
||||
}, [ref == null ? void 0 : ref.current, refresher]);
|
||||
return dimensions;
|
||||
}
|
||||
function useElemRect(elem, refresher) {
|
||||
const [dimensions, setDimensions] = useState2(initialState);
|
||||
const handleResize = useCallback(() => {
|
||||
if (!elem)
|
||||
return;
|
||||
setDimensions(getRect(elem));
|
||||
}, [elem]);
|
||||
useEffect2(() => {
|
||||
handleResize();
|
||||
window.addEventListener("resize", handleResize);
|
||||
return () => window.removeEventListener("resize", handleResize);
|
||||
}, [elem, refresher]);
|
||||
return dimensions;
|
||||
}
|
||||
var initialState = {
|
||||
bottom: 0,
|
||||
height: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
top: 0,
|
||||
width: 0,
|
||||
x: 0,
|
||||
y: 0
|
||||
};
|
||||
|
||||
// smoothScroll.tsx
|
||||
function smoothScroll(elem, options) {
|
||||
return new Promise((resolve) => {
|
||||
if (!(elem instanceof Element)) {
|
||||
throw new TypeError("Argument 1 must be an Element");
|
||||
}
|
||||
let same = 0;
|
||||
let lastPos = null;
|
||||
const scrollOptions = Object.assign({ behavior: "smooth" }, options);
|
||||
elem.scrollIntoView(scrollOptions);
|
||||
requestAnimationFrame(check);
|
||||
function check() {
|
||||
const newPos = elem == null ? void 0 : elem.getBoundingClientRect().top;
|
||||
if (newPos === lastPos) {
|
||||
if (same++ > 2) {
|
||||
return resolve(null);
|
||||
}
|
||||
} else {
|
||||
same = 0;
|
||||
lastPos = newPos;
|
||||
}
|
||||
requestAnimationFrame(check);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// useIntersectionObserver.tsx
|
||||
import { useEffect as useEffect3, useState as useState3 } from "react";
|
||||
function useIntersectionObserver(elementRef, {
|
||||
threshold = 0,
|
||||
root = null,
|
||||
rootMargin = "0%",
|
||||
freezeOnceVisible = false
|
||||
}) {
|
||||
const [entry, setEntry] = useState3();
|
||||
const frozen = (entry == null ? void 0 : entry.isIntersecting) && freezeOnceVisible;
|
||||
const updateEntry = ([entry2]) => {
|
||||
setEntry(entry2);
|
||||
};
|
||||
useEffect3(() => {
|
||||
const node = elementRef == null ? void 0 : elementRef.current;
|
||||
const hasIOSupport = !!window.IntersectionObserver;
|
||||
if (!hasIOSupport || frozen || !node)
|
||||
return;
|
||||
const observerParams = { threshold, root, rootMargin };
|
||||
const observer = new IntersectionObserver(updateEntry, observerParams);
|
||||
observer.observe(node);
|
||||
return () => observer.disconnect();
|
||||
}, [elementRef, JSON.stringify(threshold), root, rootMargin, frozen]);
|
||||
return entry;
|
||||
}
|
||||
|
||||
// helpers.tsx
|
||||
function safe(sum) {
|
||||
return sum < 0 ? 0 : sum;
|
||||
}
|
||||
function getInViewThreshold(threshold) {
|
||||
if (typeof threshold === "object" && threshold !== null) {
|
||||
return {
|
||||
thresholdX: threshold.x || 0,
|
||||
thresholdY: threshold.y || 0
|
||||
};
|
||||
}
|
||||
return {
|
||||
thresholdX: threshold || 0,
|
||||
thresholdY: threshold || 0
|
||||
};
|
||||
}
|
||||
function getWindow() {
|
||||
const w = Math.max(
|
||||
document.documentElement.clientWidth,
|
||||
window.innerWidth || 0
|
||||
);
|
||||
const h = Math.max(
|
||||
document.documentElement.clientHeight,
|
||||
window.innerHeight || 0
|
||||
);
|
||||
return { w, h };
|
||||
}
|
||||
function inView({
|
||||
top,
|
||||
right,
|
||||
bottom,
|
||||
left,
|
||||
threshold
|
||||
}) {
|
||||
const { w: windowWidth, h: windowHeight } = getWindow();
|
||||
const { thresholdX, thresholdY } = getInViewThreshold(threshold);
|
||||
return top < 0 && bottom - top > windowHeight ? true : top >= 0 + thresholdY && left >= 0 + thresholdX && bottom <= windowHeight - thresholdY && right <= windowWidth - thresholdX;
|
||||
}
|
||||
var isHoriz = (pos) => /(left|right)/.test(pos);
|
||||
var isOutsideX = (val, windowWidth) => {
|
||||
return val > windowWidth;
|
||||
};
|
||||
var isOutsideY = (val, windowHeight) => {
|
||||
return val > windowHeight;
|
||||
};
|
||||
function bestPositionOf(positions, filters = []) {
|
||||
const compareFn = (a, b) => filters.includes(a) ? 1 : filters.includes(b) ? -1 : 0;
|
||||
return Object.keys(positions).map((p) => {
|
||||
return {
|
||||
position: p,
|
||||
value: positions[p]
|
||||
};
|
||||
}).sort((a, b) => b.value - a.value).sort((a, b) => compareFn(a.position, b.position)).filter((p) => p.value > 0).map((p) => p.position);
|
||||
}
|
||||
var defaultPadding = 10;
|
||||
function getPadding(padding = defaultPadding) {
|
||||
if (Array.isArray(padding)) {
|
||||
if (padding.length === 1) {
|
||||
return [padding[0], padding[0], padding[0], padding[0]];
|
||||
}
|
||||
if (padding.length === 2) {
|
||||
return [padding[1], padding[0], padding[1], padding[0]];
|
||||
}
|
||||
if (padding.length === 3) {
|
||||
return [padding[0], padding[1], padding[2], padding[1]];
|
||||
}
|
||||
if (padding.length > 3) {
|
||||
return [padding[0], padding[1], padding[2], padding[3]];
|
||||
}
|
||||
return [defaultPadding, defaultPadding];
|
||||
}
|
||||
return [padding, padding, padding, padding];
|
||||
}
|
||||
export {
|
||||
Observables_default as Observables,
|
||||
bestPositionOf,
|
||||
getInViewThreshold,
|
||||
getPadding,
|
||||
getRect,
|
||||
getWindow,
|
||||
inView,
|
||||
isHoriz,
|
||||
isOutsideX,
|
||||
isOutsideY,
|
||||
safe,
|
||||
smoothScroll,
|
||||
useElemRect,
|
||||
useIntersectionObserver,
|
||||
useRect
|
||||
};
|
||||
Reference in New Issue
Block a user