spectatr-player-sdk/dist/collection/components/Stats/stats-render.js

A custom video player built with Stencil with Shaka Player integration

import { h } from "@stencil/core";
export function renderStatsModal(component, onClose) {
    if (!component.currentStatistics)
        return null;
    const modalBg = getComputedStyle(document.documentElement).getPropertyValue('--vp-primary-bg').trim();
    const position = component.currentStatistics?.position ?? 'center';
    const contentAlignment = position === 'top-left' ? 'start' : position === 'top-right' ? 'end' : 'center';
    const closeModal = () => {
        onClose();
    };
    function hexToRgb(hex) {
        const r = parseInt(hex.slice(1, 3), 16);
        const g = parseInt(hex.slice(3, 5), 16);
        const b = parseInt(hex.slice(5, 7), 16);
        return `rgba(${r}, ${g}, ${b},0.55)`;
    }
    return (h("div", { class: "stats-overlay", style: { justifyContent: contentAlignment } }, h("div", { class: "stats-modal", style: { background: hexToRgb(modalBg) } }, h("div", { class: "stats-header" }, h("h3", null, "Statistics"), h("button", { class: "close-btn", onClick: closeModal }, "\u00D7")), h("div", { class: "stats-content", innerHTML: component.currentStatistics.htmlString }))));
}
//# sourceMappingURL=stats-render.js.map