web-ui-pack/popup/popupPlacements.js

Web package with UI elements

const yAdjust = function yAdjust(_t, me, fit) {
    const arrowFree = this.arrowAngle === 0 || this.arrowAngle === 180 ? me.arrow.h : 0;
    this.top = Math.max(fit.top - arrowFree, Math.min(this.top, fit.bottom - me.h + arrowFree));
    return this;
};
export const xAdjust = function xAdjust(_t, me, fit) {
    const arrowFree = this.arrowAngle === 90 || this.arrowAngle === -90 ? me.arrow.h : 0;
    this.left = Math.max(fit.left - arrowFree, Math.min(this.left, fit.right - me.w + arrowFree));
    return this;
};
const resizeHeight = function resizeHeight(t, me, fit) {
    if (me.minH > this.freeH) {
        return this;
    }
    const { h } = me;
    this.maxH = me.h > this.freeH ? this.freeH : null;
    me.h = Math.min(me.h, this.freeH);
    yAdjust.call(this, t, me, fit);
    me.h = h;
    return this;
};
const resizeWidth = function resizeWidth(t, me, fit) {
    if (me.minW > this.freeW) {
        return this;
    }
    const { w } = me;
    this.maxW = me.w > this.freeW ? this.freeW : null;
    me.w = Math.min(me.w, this.freeW);
    xAdjust.call(this, t, me, fit);
    me.w = w;
    return this;
};
const $top = (function top(t, me, fit) {
    return {
        attr: "top",
        top: t.top - me.h - me.arrow.h,
        freeH: t.top - fit.top,
        arrowTop: t.top - me.arrow.h - me.arrow.offset.top,
        arrowAngle: 0,
    };
});
$top.$start = function yStart(t, me, fit) {
    this.left = t.left;
    this.freeW = fit.right - t.left;
    return this;
};
$top.$middle = function yMiddle(t, me, fit) {
    this.left = t.left + Math.round((t.width - me.w) / 2);
    this.freeW = fit.width;
    return this;
};
$top.$end = function yEnd(t, me, fit) {
    this.left = t.right - me.w;
    this.freeW = t.right - fit.left;
    return this;
};
$top.$start.$adjust = xAdjust;
$top.$middle.$adjust = xAdjust;
$top.$end.$adjust = xAdjust;
const $bottom = function bottom(t, me, fit) {
    return {
        attr: "bottom",
        top: t.bottom + me.arrow.h,
        freeH: fit.bottom - t.bottom,
        arrowTop: t.bottom + me.arrow.offset.bottom,
        arrowAngle: 180,
    };
};
$bottom.$start = $top.$start;
$bottom.$middle = $top.$middle;
$bottom.$end = $top.$end;
const $left = function left(t, me, fit) {
    const freeW = t.left - fit.left;
    return {
        attr: "left",
        left: t.left - me.w - me.arrow.h,
        freeW,
        arrowAngle: -90,
        arrowLeft: t.left - me.arrow.h - Math.round((me.arrow.w - me.arrow.h) / 2) - me.arrow.offset.left,
    };
};
$left.$start = function xStart(t, _me, fit) {
    this.top = t.top;
    this.freeH = fit.bottom - t.top;
    return this;
};
$left.$middle = function xMiddle(t, me, fit) {
    this.top = t.top + Math.round((t.height - me.h) / 2);
    this.freeH = fit.height;
    return this;
};
$left.$end = function xEnd(t, me, fit) {
    this.top = t.bottom - me.h;
    this.freeH = t.bottom - fit.top;
    return this;
};
$left.$start.$adjust = yAdjust;
$left.$middle.$adjust = yAdjust;
$left.$end.$adjust = yAdjust;
const $right = function right(t, me, fit) {
    return {
        attr: "right",
        left: t.right + me.arrow.h,
        freeW: fit.right - t.right,
        arrowAngle: 90,
        arrowLeft: t.right - Math.round((me.arrow.w - me.arrow.h) / 2) + me.arrow.offset.right,
    };
};
$right.$start = $left.$start;
$right.$middle = $left.$middle;
$right.$end = $left.$end;
export const PopupPlacements = {
    $top,
    $bottom,
    $left,
    $right,
};
Object.keys(PopupPlacements).forEach((kp) => {
    const def = PopupPlacements[kp];
    PopupPlacements[kp] = function (t, me, fit) {
        return def.$middle.call(def(t, me, fit), t, me, fit);
    };
    const p = PopupPlacements[kp];
    Object.keys(def).forEach((key) => {
        const prevFn = def[key];
        const fnName = kp + key;
        const o = {
            [fnName]: ((t, me, fit) => prevFn.call(def(t, me, fit), t, me, fit)),
        };
        p[key] = o[fnName];
        const v = p[key];
        const vname1 = `${fnName}_adjust`;
        v.$adjust = {
            [vname1]: ((t, me, fit) => prevFn.$adjust.call(v(t, me, fit), t, me, fit)),
        }[vname1];
        let vname = `${vname1}_resizeHeight`;
        v.$adjust.$resizeHeight = {
            [vname]: ((t, me, fit) => resizeHeight.call(v.$adjust(t, me, fit), t, me, fit)),
        }[vname];
        vname = `${vname1}_resizeWidth`;
        v.$adjust.$resizeWidth = {
            [vname]: ((t, me, fit) => resizeWidth.call(v.$adjust(t, me, fit), t, me, fit)),
        }[vname];
        vname = `${fnName}_resizeHeight`;
        v.$resizeHeight = {
            [vname]: ((t, me, fit) => resizeHeight.call(v(t, me, fit), t, me, fit)),
        }[vname];
        vname = `${fnName}_resizeWidth`;
        v.$resizeWidth = {
            [vname]: ((t, me, fit) => resizeWidth.call(v(t, me, fit), t, me, fit)),
        }[vname];
    });
});
export function getOffset(offset) {
    if (!offset) {
        return { top: 0, left: 0, bottom: 0, right: 0 };
    }
    return {
        top: Math.round(offset[0]),
        right: Math.round(offset[1]),
        bottom: Math.round(offset[2] ?? offset[0]),
        left: Math.round(offset[3] ?? offset[1]),
    };
}