@needle-tools/engine/lib/engine/webcomponents/fonts.js

Needle Engine is a web-based runtime for 3D apps. It runs on your machine for development with great integrations into editors like Unity or Blender - and can be deployed onto any device! It is flexible, extensible and networking and XR are built-in.

import { materialSymbolsFontUrl, robotoFlexFontUrl } from "./font-urls.js";
export function loadFont(url, opts) {
    const element = opts?.element || document.head;
    // Workaround for font loading not being supported in ShadowDOM:
    // Add font import to document header.
    // Note that this is slower than it could be, ideally the font would be prefetched,
    // but for that it needs to be in the actual document and not added by JS.
    const elements = Array.from(element.querySelectorAll(`link[href*='${url}']`));
    if (elements.length <= 0) {
        const fontLink = document.createElement("link");
        fontLink.href = url;
        // Load fonts without blocking render: use rel="preload" with onload swap
        // to stylesheet. This avoids the ~200ms render-blocking delay per font.
        fontLink.rel = "preload";
        fontLink.as = "style";
        // crossorigin must match the HTML <link> attribute (set by asap.js) so the browser
        // can reuse the cached CORS response instead of making a separate non-CORS request
        fontLink.crossOrigin = "";
        fontLink.onload = () => { fontLink.rel = "stylesheet"; };
        element.appendChild(fontLink);
        elements.push(fontLink);
    }
    if (opts?.loadedCallback) {
        for (let i = 0; i < elements.length; i++) {
            if (opts?.loadedCallback) {
                const fontLink = elements[i];
                fontLink.addEventListener("load", opts.loadedCallback);
            }
        }
    }
}
/** Ensure the fonts that needle engine uses are loaded */
export function ensureFonts() {
    loadFont(robotoFlexFontUrl);
}
export { materialSymbolsFontUrl as iconFontUrl };
// const fontUrl = "./include/fonts/MaterialSymbolsOutlined.css"; // for offline support
//# sourceMappingURL=fonts.js.map