https://www.elle.cz/js/core/measure.js

1export const parsePixelValue = (value) => {
2  const parsed = Number.parseFloat(value);
3  return Number.isFinite(parsed) ? parsed : 0;
4};
5
6export const parsePositiveInteger = (value, fallback = 0) => {
7  const parsedValue = Number.parseInt(value || '', 10);
8  return Number.isFinite(parsedValue) && parsedValue > 0 ? parsedValue : fallback;
9};
10
11export const getElementOuterWidth = (element) => {
12  const styles = window.getComputedStyle(element);
13  const marginLeft = parsePixelValue(styles.marginLeft);
14  const marginRight = parsePixelValue(styles.marginRight);
15
16  return element.getBoundingClientRect().width + marginLeft + marginRight;
17};
18
19export const getVisibleViewportHeight = (element) => {
20  const rect = element.getBoundingClientRect();
21  const viewportHeight = window.innerHeight || document.documentElement.clientHeight;
22  const visibleTop = Math.max(rect.top, 0);
23  const visibleBottom = Math.min(rect.bottom, viewportHeight);
24
25  return Math.max(visibleBottom - visibleTop, 0);
26};
27
28export const getHorizontalItemStep = (track, itemSelector) => {
29  const firstItem = track.querySelector(itemSelector);
30  if (!(firstItem instanceof HTMLElement)) {
31    return 0;
32  }
33
34  const style = window.getComputedStyle(track);
35  const gap = parsePixelValue(style.columnGap || style.gap);
36
37  return firstItem.getBoundingClientRect().width + gap;
38};