123456789101112131415161718192021222324252627282930313233343536373839404142434445464748 |
- (() => {
- const DEMO_ROOT = "demos";
- const ASSETS_PATH = "demos/_assets";
- const CSS = [`${ASSETS_PATH}/demos.css`, "build/calcite.css"];
- const urlParams = new URLSearchParams(window.location.search);
- const DISABLE_HEADER_URL_PARAM = "header-disabled";
- const SCRIPTS = [
- {
- src: "build/calcite.esm.js",
- type: "module"
- },
- {
- src: "demos/_assets/demo-dom-swapper.js"
- }
- ];
- const parseTemplate = (text) => {
- const parser = new DOMParser();
- const doc = parser.parseFromString(text, "text/html");
- return doc.head.querySelector("template");
- };
- const loadHeader = async () => {
- const root = window.location.pathname.split(DEMO_ROOT).shift();
- const response = await window.fetch(`${root}${ASSETS_PATH}/demo-template.html`);
- const text = await response.text();
- const template = parseTemplate(text);
- const firstChild = document.body.firstChild;
- firstChild && document.body.insertBefore(template.content, firstChild);
- };
- if (window.location.pathname.includes("/demos/") && !urlParams.has(DISABLE_HEADER_URL_PARAM)) {
- document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", loadHeader) : loadHeader();
- }
- const ROOT = window.location.pathname.split(DEMO_ROOT).shift();
- function loadCss(url) {
- const link = document.createElement("link");
- link.rel = "stylesheet";
- link.href = ROOT + url;
- document.head.appendChild(link);
- }
- function loadScript(script) {
- const scriptElement = document.createElement("script");
- Object.keys(script).forEach((key) => {
- scriptElement[key] = key === "src" ? ROOT + script[key] : script[key];
- });
- document.head.appendChild(scriptElement);
- }
- CSS.forEach(loadCss);
- SCRIPTS.forEach(loadScript);
- })();
|