@expofp/floorplan/dist/esm/load.js

Interactive floor plan library for expos and events

import"./utils/silence-mobx-react-lite-warning";import{applyIntents as m,loadConfig as p,setConfig as u}from"@expofp/config";import{safeLocalStorage as h}from"@expofp/utils";import l from"debug";import{initHtmlHead as y}from"./_misc_to_move/initHtmlHead";import{logBuildInfo as w}from"./_misc_to_move/logBuildInfo";import{RUNTIME_LOADER_SPINNER_CLASS as v}from"./constants.js";import g from"./floorplan.loader";import{claimPlanSlot as E,disposePlan as S,registerPlanDisposer as k}from"./plan-lifecycle.js";import c from"./tools/report-error.js";import{brand as b}from"./utils/brand";import{applyEventHead as _,buildEventHead as x}from"./utils/event-head";import{formatEventTitle as $}from"./utils/event-title";import R from"./utils/is-own-domain";import{migrateLegacyStorageKeys as L}from"./utils/legacy-storage-keys";const s=l("efp:load");export async function load(r,e={}){E();try{return await C(r,e)}catch(n){try{S()}catch(o){s("teardown after a failed load:",o)}throw n}}async function C(r,e={}){window.addEventListener("error",c),k(()=>window.removeEventListener("error",c)),y(),w(),l("efp:device").enabled&&import("./_misc_to_move/logDeviceInfo").then(t=>t.logDeviceInfo()).catch(()=>{});const n=e.element;let o;if(typeof n=="string"){const t=document.querySelector(n);if(!t)throw new Error(`Element not found for selector: ${n}`);o=t}else n?o=n:(o=document.getElementById("floorplan"),o||(o=document.createElement("div"),I(o),document.body.appendChild(o)));B(),o.setAttribute("data-efp-floorplan-defaults",""),document.documentElement.style.overscrollBehavior||="none",document.body.style.overscrollBehavior||="none",requestAnimationFrame(()=>{o.style.backgroundColor="#ebebeb"}),L();let a;try{if(a=await p(r,e,window.location.search,h()??void 0),!a.fpSvgJsRef)throw new Error("No floor plan drawing: the manifest must set `legacyDataUrlBase` (live event) or `fpSvgJsRef` (offline copy)")}catch(t){const{showEventNotFound:f}=await import("./tools/event-not-found");throw f(o),t}if(s("config",a),u(a),R){const t=$(a,b);t&&(document.title=t),_(document,x(a),`${window.location.origin}/`)}const i=new g(e,o),d=window.___fpResolve;return window.___fp=i,d&&(i.ready.then(()=>d(i)).catch(t=>s("placeholder resolve skipped:",t)),delete window.___fpResolve),i.ready.then(()=>{const t=new CustomEvent("expofp:ready",{detail:{floorplan:i}});window.__expofpReady=t,window.dispatchEvent(t)}).catch(t=>s("ready event skipped:",t)),i.ready.then(()=>m(i,a.intents)).catch(t=>s("config intents skipped:",t)),i}function B(){const r="efp-floorplan-defaults";if(document.getElementById(r))return;const e=document.createElement("style");e.id=r,e.textContent=`
[data-efp-floorplan-defaults] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  touch-action: none;
  overscroll-behavior: none;
  background: #fff;
  transition: background-color 2s ease;
}`,document.head.prepend(e)}function I(r){if(!document.adoptedStyleSheets)return;const e=v,n=`
.${e} {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  transition: all 1s ease;
}

.${e} > svg {
  width: 60px;
  transform-origin: center;
  animation: ${e}-rotate 2s linear infinite;
}

.${e} > svg > circle {
  fill: none;
  stroke: var(--color-primary, #2382f4);
  stroke-dasharray: 1, 200;
  stroke-dashoffset: 0;
  stroke-linecap: round;
  stroke-width: 2;
  animation: ${e}-dash 1.5s ease-in-out infinite;
}

@keyframes ${e}-rotate {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes ${e}-dash {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
  }

  50% {
    stroke-dasharray: 90, 200;
    stroke-dashoffset: -35px;
  }

  100% {
    stroke-dashoffset: -125px;
  }
}`,o=new CSSStyleSheet;o.replaceSync(n),document.adoptedStyleSheets=[...document.adoptedStyleSheets,o],r.innerHTML=`<div class="${e}">
    <svg viewBox="25 25 50 50">
      <circle r="20" cy="50" cx="50"></circle>
    </svg>
  </div>`,requestAnimationFrame(()=>{r.querySelector(`.${e}`)?.style.setProperty("opacity","1")})}