@expofp/floorplan/dist/esm/components/Maplibre/MaplibreAdapter.js

Interactive floor plan library for expos and events

import{jsx as j,jsxs as Y}from"react/jsx-runtime";import{isLayerDefs as ee}from"@expofp/renderer";import re from"color";import{comparer as te,reaction as oe,runInAction as ne}from"mobx";import{observer as ie}from"mobx-react-lite";import{useCallback as V,useEffect as v,useMemo as u,useRef as p,useState as B}from"react";import ae from"../../data";import{getLayerSvg as ce,getSvgArea as P,isSvgAreaExplicit as se}from"../../data/svg.js";import{createSceneDef as le}from"../../engine/defs";import o,{uiState as t}from"../../store";import L from"../../tools/settings";import N from"../../utils/is-debug";import{fitRectIsFraming as me,getVenueFitMarginPercent as ue,resolveVenueFitRect as pe}from"../../utils/scene-bounds";import fe from"../Map/drawing/config/config-all";import{loadLayersImages as de}from"../Map/drawing/config/loadBoothsImages";import{MapCursorCoords as ge}from"../Map/MapCursorCoords";import{MapViewport as be}from"../Map/MapViewport";import{clearSelection as ye}from"../Map/pointer";import{setMapScene as U}from"../Map/scene";import{useBuildRoute as Se}from"../Map/traffic/useBuildRoute";import{useManageTraffic as he}from"../Map/traffic/useManageTraffic";import{centerCoordinates as Re}from"../Map/viewport";import Ce from"./MaplibreWrapper";import{useCameraReactions as Me}from"./useCameraReactions";import{useDimming as ve}from"./useDimming";import{useKioskCameraEvents as Pe}from"./useKioskCameraEvents";import{useLayerVisibilitySync as Le}from"./useLayerVisibilitySync";import{usePoiMarkers as Ae}from"./usePoiMarkers";import{useWayfindingAndMarkers as xe}from"./useWayfindingAndMarkers";import{cameraForLocalRect as ze,deriveGeoConfig as De,getLocalRectGeoBounds as Te,getVisibleRectFitPadding as Ee,INITIAL_FIT_ZOOM_ADJUSTMENT as Oe}from"./utils/geo-config";import{applyMapOptions as Z,getTileSource as Ie,MAP_MIN_ZOOM as we}from"./utils/map-helpers";import{calculateTransformMatrix as _e}from"./utils/solver";const G="routes-api.expofp.com",ke=800;function Fe(a,y,s){return{getCameraState:()=>{const n=a.getCenter();return{lng:n.lng,lat:n.lat,zoom:a.getZoom(),bearing:a.getBearing(),pitch:a.getPitch()}},applyCameraState:n=>{a.easeTo({center:[n.lng,n.lat],zoom:n.zoom,bearing:n.bearing??y,pitch:n.pitch??s(),duration:ke,essential:!0})},resetPitch:()=>{const n=s();a.getPitch()!==n&&a.jumpTo({pitch:n})}}}function J(){o.poiMarkerStore.clear(),ne(()=>{o.layerStore.layers.forEach(a=>{a.configured=!1,a.children=[],a.loaded=!1}),o.layerStore.layersLoaded=!1})}const $e=()=>t.overlayPosition==="bottom",je=ie(function({viewMode:y}){const[s,n]=B(null),[T,E]=B(!1),m=p(null),d=p(null),A=p(null),O=p(null),S=p(null),r=u(()=>De(),[]),x=u(()=>pe({layerViewbox:o.layerStore.viewboxRectangle,explicitArea:se()?P():null,layerRectangle:o.layerStore.rectangle,sceneDef:s,svgArea:P()}),[s]),h=x.rect,g=u(()=>{if(!r)return null;const e=me(x.source)?0:ue(h,P()),i=Ee(0);e&&t.screenSize&&(i.left+=t.screenSize.width*e,i.right+=t.screenSize.width*e,i.top+=t.screenSize.height*e,i.bottom+=t.screenSize.height*e);const l=t.screenSize?ze(h,r.gpsConfig,r.bearing,{width:t.screenSize.width,height:t.screenSize.height},i):null;return l?{center:l.center,bearing:r.bearing,zoom:l.zoom}:{center:r.center,bearing:r.bearing,zoom:r.zoom,bounds:Te(h,r.gpsConfig),fitPadding:i,zoomAdjustment:Oe}},[r,x,h]),R=u(()=>r?_e(r.gpsConfig,ce()?.getAttribute("units")):null,[r]),I=t.mapSettings.pitchdegrees,w=t.maxPitch,b=u(()=>{const e=y==="map2d";return{pitch:e?0:I,maxPitch:e?0:w,minZoom:we}},[y,I,w]),z=p(b),K=u(()=>Ie(),[]),c=u(()=>{if(!s||!R)return null;const e=s.rootLayer.children,i=ee(e)?e.filter(l=>l.name.toLowerCase()!=="areamap"):e;return{...s,rootLayer:{...s.rootLayer,children:i},background:void 0,staticTransform:R}},[s,R]),_=p(null);v(()=>{_.current=c},[c]),v(()=>{if(c)return U(c),()=>U(void 0)},[c]);const{mapDimAnimatorRef:k,venueDimAnimatorRef:F,applyDimmingTarget:$,handleMapDimLayerReady:W}=ve(m,_);v(()=>{if(!r)return;let e=!1;J(),fe().then(({layers:f,cleanup:C})=>{if(e){C();return}A.current=C;const M=re(L.backgroundColor==="none"?"#ebebeb":L.backgroundColor).string();n(le(f,P(),M))}).catch(f=>{e||console.warn("Maplibre scene configuration failed.",f)});const i=k.current,l=F.current;return()=>{e=!0,J(),A.current?.(),A.current=null,S.current&&(o.maplibreStore.clearCameraPortIfCurrent(S.current),S.current=null),m.current=null,d.current=null,O.current=null,E(!1),i?.stop(),l?.stop(),t.sceneDefReady=!1}},[r,k,F]);const X=V((e,i)=>{m.current=e,d.current=e.getCanvas(),O.current=i,E(!0);const l=oe(()=>({popover:$e(),listTopPx:t.mobileToggleTopPx}),({popover:C,listTopPx:M})=>{const D=e.getContainer();D.classList.toggle("efp-map-attrib-popover",C),M?D.style.setProperty("--efp-map-attrib-popover-bottom",`calc(${M+8}px - var(--app-gap, 10px))`):D.style.removeProperty("--efp-map-attrib-popover-bottom")},{equals:te.structural,fireImmediately:!0});e.once("remove",l),e.once("idle",()=>Z(e,z.current));const f=Fe(e,r?.bearing??e.getBearing(),()=>z.current.pitch??0);S.current=f,o.maplibreStore.setCameraPort(f),o.fp.getCenterCoordinates=()=>Re(d.current),$({immediate:!0}),de(),o.layerStore.layersLoaded=!0,o.fp.onFpConfigured&&o.fp.onFpConfigured(),t.sceneDefReady=!0,i()},[$,r]);v(()=>{z.current=b,Z(m.current,b)},[b]),Pe(T,m),xe(c,d),Ae(T,m,r),Le(c,m,r),Me(m,r,c),Se({enabled:o.layerStore.layersLoaded&&t.buildRoute,scene:c??void 0});const H=ae.busRoutes??!1;he({permission:o.layerStore.layersLoaded&&H,scene:c??void 0,dataJsonUrl:`https://${G}/v1/routes?expo=${L.EXPO}`,websocketUrl:`wss://${G}/locations?expo=${L.EXPO}`});const q=V(e=>{console.warn("Maplibre map failed to load; falling back to floorplan mode.",e),o.maplibreStore.deactivateMaplibre()},[]);if(!r||!g||!R||!c)return null;const Q=`${g.center.join(",")}:${g.bearing}:${g.zoom}`;return Y(Ce,{sceneDef:c,geoConfig:g,tileSource:K,mapOptions:b,debug:N,onMapReady:X,onMapDimLayerReady:W,onMapLoadError:q,onPointerMissed:ye,children:[j(be,{}),N&&j(ge,{canvas:d})]},Q)});export default je;