@expofp/floorplan 3.45.11 → 3.45.12

package/dist/esm/components/Map/drawing/config/config-markers.js

@@ -1 +1 @@
-import{Box as T}from"@expofp/geometry";import{update as M}from"@expofp/renderer";import{reaction as R}from"mobx";import{createImageDef as L}from"../../../../engine/defs";import f,{layersStore as P,uiState as V}from"../../../../store";import{setMarkerResolver as B}from"../../pointer";import{createImageCanvas as W,getBounds as x,imageCanvasCssSize as A}from"./canvases";const _="_selected";export const MARKER_LAYER_NAME="markers";export function rescaleMarker(s,h,u){const{center:r,rotation:a,elevation:o}=s.bounds,{width:i,height:m}=h;return s.bounds=x(r.x,r.y,i,m,u,a,o),[s]}function Y(s){y=s}export function configMarkers(s){const{scene:h}=s,u=[],r=new Map,a=new Map;let o=[];const i=h.rootLayer.children.find(e=>e.name===MARKER_LAYER_NAME);i.onScale=({pixelSize:e})=>Y(e),B(markerAt),M(i);async function m(e){const t=[];e.forEach(c=>{const{name:d,content:n,width:l,height:g,scale:k}=c;if(r.has(d))return;const p=new Image,w=new Promise((b,D)=>{p.onload=()=>{r.set(d,{img:p,width:l,height:g,scale:k}),b()},p.onerror=v=>{D(v)}});t.push(w),p.src=n,p.crossOrigin="anonymous"}),await Promise.all(t)}const I=(e,t)=>{e.onScale=({pixelSize:c})=>rescaleMarker(e,t,c)},$=e=>{e.screenSpace||(e.onRoll=({roll:t})=>{if(t!==e.bounds.rotation)return e.bounds.rotate(t-e.bounds.rotation,e.bounds),[e]})};function C(e,t){const c=a.get(e);if(c)return c;const d=W(t.img,t.width,t.height,window.devicePixelRatio,t.scale||1);return a.set(e,d),d}function F(){const e=f.routeStore.markersData.markers;if(!e.length)return;o=[];const t=1,c=0,d=V.is3DView;e.forEach(n=>{const l=r.get(n.icon);if(!l)return;const g=r.get(n.selectedIcon);if(!g)return;const k=l.scale||1,p=C(n.icon,l),w=C(n.selectedIcon,g),b=P.findLayer(n.z)?.visible??!0,D=A(l.img,l.width,l.height,k),v=A(g.img,g.width,g.height,k),N=x(n.x,n.y,D.width,D.height,t,c),O=x(n.x,n.y,v.width,v.height,t,c);let S;switch(n.position){case"lefttop":S=[0,0];break;case"centertop":S=[.5,0];break;case"centerbottom":S=[.5,1];break;default:S=[.5,.5]}const E={...L(p,N,{hidden:!b,origin:S}),id:n.id,scale:k,screenSpace:d},z={...L(w,O,{hidden:!(b&&n.active),origin:S}),id:`${n.id}${_}`,scale:k,screenSpace:d};I(E,D),I(z,v),o.push(E,z)}),i.children=o,o.forEach($)}function H(){i.children=[],o=[]}function K(){const e=f.routeStore.markersData.markers;e.length&&e.forEach(t=>{const c=o.find(l=>l.id===t.id),d=o.find(l=>l.id===`${t.id}${_}`);if(!c||!d)return;const n=P.findLayer(t.z)?.visible??!0;t.active?(c.hidden=!0,d.hidden=!(n&&t.active)):(c.hidden=!n,d.hidden=!0)})}return u.push(R(()=>[f.routeStore.selectedMarkers,f.layerStore.visible],()=>{if(!f.routeStore.markersData.markers.length){H(),M(i);return}K(),M(...o)})),u.push(R(()=>f.routeStore.markersData.markers,()=>{m(f.routeStore.markersData.icons).then(()=>{F(),M(i)})},{fireImmediately:!0})),function(){u.forEach(t=>t()),u.length=0,i.onScale=void 0,B(),y=1,M(i)}}export function markerAt(s,h){return getMarkerFromClick(s,h,y)}export function getMarkerFromClick(s,h,u){for(const r of f.routeStore.markersData.markers){const a=f.routeStore.markersData.icons.find(m=>m.name===r.icon);if(!a)continue;const o=a.width*(a.scale||1)*u,i=a.height*(a.scale||1)*u;if(j(s,h,r.x,r.y,o,i)){const m=f.layerStore.findLayer(r.z);if(!m||m&&m.visible)return r}}return null}function j(s,h,u,r,a,o){return T.fromCenter({x:u,y:r},{x:2*a,y:2*o}).containsPoint({x:s,y:h})}let y=1;
+import{Box as T}from"@expofp/geometry";import{update as M}from"@expofp/renderer";import{reaction as R}from"mobx";import{createImageDef as L}from"../../../../engine/defs";import{attachExactRoll as V}from"../../../../engine/utils/rotation.js";import u,{layersStore as P,uiState as W}from"../../../../store";import{setMarkerResolver as B}from"../../pointer";import{createImageCanvas as Y,getBounds as y,imageCanvasCssSize as A}from"./canvases";const _="_selected";export const MARKER_LAYER_NAME="markers";export function rescaleMarker(s,h,f){const{center:r,rotation:a,elevation:o}=s.bounds,{width:i,height:m}=h;return s.bounds=y(r.x,r.y,i,m,f,a,o),[s]}function j(s){b=s}export function configMarkers(s){const{scene:h}=s,f=[],r=new Map,a=new Map;let o=[];const i=h.rootLayer.children.find(e=>e.name===MARKER_LAYER_NAME);i.onScale=({pixelSize:e})=>j(e),B(markerAt),M(i);async function m(e){const t=[];e.forEach(c=>{const{name:d,content:n,width:l,height:g,scale:k}=c;if(r.has(d))return;const p=new Image,x=new Promise((w,D)=>{p.onload=()=>{r.set(d,{img:p,width:l,height:g,scale:k}),w()},p.onerror=v=>{D(v)}});t.push(x),p.src=n,p.crossOrigin="anonymous"}),await Promise.all(t)}const E=(e,t)=>{e.onScale=({pixelSize:c})=>rescaleMarker(e,t,c)},$=e=>{e.screenSpace||V(e)};function I(e,t){const c=a.get(e);if(c)return c;const d=Y(t.img,t.width,t.height,window.devicePixelRatio,t.scale||1);return a.set(e,d),d}function F(){const e=u.routeStore.markersData.markers;if(!e.length)return;o=[];const t=1,c=0,d=W.is3DView;e.forEach(n=>{const l=r.get(n.icon);if(!l)return;const g=r.get(n.selectedIcon);if(!g)return;const k=l.scale||1,p=I(n.icon,l),x=I(n.selectedIcon,g),w=P.findLayer(n.z)?.visible??!0,D=A(l.img,l.width,l.height,k),v=A(g.img,g.width,g.height,k),N=y(n.x,n.y,D.width,D.height,t,c),O=y(n.x,n.y,v.width,v.height,t,c);let S;switch(n.position){case"lefttop":S=[0,0];break;case"centertop":S=[.5,0];break;case"centerbottom":S=[.5,1];break;default:S=[.5,.5]}const C={...L(p,N,{hidden:!w,origin:S}),id:n.id,scale:k,screenSpace:d},z={...L(x,O,{hidden:!(w&&n.active),origin:S}),id:`${n.id}${_}`,scale:k,screenSpace:d};E(C,D),E(z,v),o.push(C,z)}),i.children=o,o.forEach($)}function H(){i.children=[],o=[]}function K(){const e=u.routeStore.markersData.markers;e.length&&e.forEach(t=>{const c=o.find(l=>l.id===t.id),d=o.find(l=>l.id===`${t.id}${_}`);if(!c||!d)return;const n=P.findLayer(t.z)?.visible??!0;t.active?(c.hidden=!0,d.hidden=!(n&&t.active)):(c.hidden=!n,d.hidden=!0)})}return f.push(R(()=>[u.routeStore.selectedMarkers,u.layerStore.visible],()=>{if(!u.routeStore.markersData.markers.length){H(),M(i);return}K(),M(...o)})),f.push(R(()=>u.routeStore.markersData.markers,()=>{m(u.routeStore.markersData.icons).then(()=>{F(),M(i)})},{fireImmediately:!0})),function(){f.forEach(t=>t()),f.length=0,i.onScale=void 0,B(),b=1,M(i)}}export function markerAt(s,h){return getMarkerFromClick(s,h,b)}export function getMarkerFromClick(s,h,f){for(const r of u.routeStore.markersData.markers){const a=u.routeStore.markersData.icons.find(m=>m.name===r.icon);if(!a)continue;const o=a.width*(a.scale||1)*f,i=a.height*(a.scale||1)*f;if(q(s,h,r.x,r.y,o,i)){const m=u.layerStore.findLayer(r.z);if(!m||m&&m.visible)return r}}return null}function q(s,h,f,r,a,o){return T.fromCenter({x:f,y:r},{x:2*a,y:2*o}).containsPoint({x:s,y:h})}let b=1;

package/dist/esm/components/Map/traffic/useManageTraffic.js

@@ -1 +1 @@
-import{lineAngle as fe,pointDistance as he,Rect as be}from"@expofp/geometry";import{update as z}from"@expofp/renderer";import{useEffect as Ce,useRef as S}from"react";import _e from"../../../tools/base-runtime-url";import{loadImage as ve}from"../../../utils/loadImage";import{mapCamera as Pe}from"../camera";import{createCanvas as ge,createImageCanvas as Fe,getBounds as B,imageCanvasCssSize as Ne}from"../drawing/config/canvases";import{getRouteLayerRegex as De,getRouteStopLayerRegex as Oe,TRAFFIC_VEHICLES as ce}from"./trafficLayers";import{UpdateQueue as He}from"./UpdateQueue";const se=2,Ve=se*3.5,J=se*12,K=J*.7,ze=8,ie=2,me=.6,pe=8,We="transport_locations",ke=150,Ge="#a4aab6",we=1e3,Ue=2e4,Ie=500;export function useManageTraffic({permission:e,scene:t,dataJsonUrl:n,websocketUrl:a}){const o=S(1),r=S(new Map),c=S(new Map),s=S(null),f=S(null),d=S(0),w=S(1),b=S(new He),R=S(new Map),E=S(we),m=S(new Map),x=S(void 0);Ce(()=>{if(!e||!t)return;let u=!1,v;const T=t.rootLayer.children,p=c.current,I=r.current,y=b.current;async function Re(){try{let l;try{const i=await fetch(n,{method:"GET",headers:{"Content-Type":"application/json"}});if(!i.ok||i.status===204)return;l=await i.json()}catch(i){console.warn("useManageTraffic failed to get JSON",i)}if(u||!l||l.disabled||l.error)return;o.current=Ee(Pe()?.state().pixelSize??1);const W=new Map(l.routes.map(({id:i,color:h})=>[i,h])),C=new Map;W.forEach(i=>{C.set(i,je({radius:Ve,color:i,scale:window.devicePixelRatio}))});const U=De(),Y=T.filter(i=>U.test(i.name)),X=Oe(),$=T.filter(i=>X.test(i.name));l.routes.slice(0,Y.length).forEach(({id:i,color:h,path:g,stops:O,hiddenPoints:L},k)=>{R.current.set(i,g);const M=Y[k];if(M){const H=new Map(L?.map(F=>[le(F),F])??[]);for(let F=1;F<g.length;F++){const A=g[F-1],V=g[F];H.has(le(A))||H.has(le(V))||M.children.push({points:{p0:A,p1:V},color:h,width:se})}M.children.length&&y.add(()=>z(M))}const _=$[k],P=C.get(h);_&&P&&O?.length&&(O.forEach(H=>{_.children.push({source:P,bounds:B(H.x,H.y,...Q(P),o.current)})}),_.children.length&&y.add(()=>z(_)))});const D=T.find(i=>i.name===ce);if(!D){console.warn(`useManageTraffic: the scene has no "${ce}" layer`);return}const j=new Map;D.onScale=({pixelSize:i})=>{o.current=Ee(i);const h=[];for(const g of $){const O=g.children;for(const L of O){const k=L.source;L.bounds=B(L.bounds.center.x,L.bounds.center.y,...Q(k),o.current,L.bounds.rotation),h.push(L)}}for(const g of r.current.values()){const O=g.source;g.bounds=B(g.bounds.center.x,g.bounds.center.y,...Q(O),o.current,g.bounds.rotation),h.push(g)}return h},y.add(()=>z(D)),W.forEach((i,h)=>{j.set(h,xe({id:h,width:J,height:J,color:i,scale:window.devicePixelRatio}))});const Le=xe({id:"orphan",width:J,height:J,color:Ge,scale:window.devicePixelRatio});let q=null;try{const i=await ve(`${_e}icons/bus-white.svg`);if(u)return;q=Fe(i,K,K,window.devicePixelRatio);const{width:h,height:g}=Ne(i,K,K);ne.set(q,[h,g])}catch(i){console.error(i)}f.current=i=>{try{const h=JSON.parse(i.data);if(h.type!==We)return;const g=i.timeStamp||performance.now();w.current=Math.round(g-d.current),d.current=g;const O=Math.max(w.current??Ie,Ie),L=D.children;let k=!1;h.data.forEach(({id:M,x:_,y:P,route_id:H,hidden:F})=>{p.has(M)&&(p.get(M)?.(),p.delete(M));const A=I.get(M),V=I.get(ue(M))??null;if(F&&A&&V){A.hidden=!0,V.hidden=!0,y.add(()=>z(A,V));return}if(m.current.set(M,performance.now()),!A){const G=j.get(H)??Le,N={source:G,bounds:B(_,P,...Q(G),o.current,0)};if(I.set(M,N),q){const Z=ue(M),re={source:q,bounds:B(_,P,...Q(q),o.current,0)};qe(re),q.setAttribute("id",Z),I.set(Z,re),L.push(N,re)}else L.push(N);k=!0;return}const Ae=A.bounds.center,oe=Qe(Ae,{x:_,y:P},R.current.get(H));if(oe.reduce((G,N,Z)=>Z===0?G:G+ae(oe[Z-1],N),0)>=ke||document.hidden)Me({updateQueue:y,vehicle:A,vehicleFinery:V,x:_,y:P,scale:o.current,angle:$e(A.bounds.center,{x:_,y:P})});else{const G=Xe(oe,O,N=>{Me({updateQueue:y,vehicle:A,vehicleFinery:V,x:N.x,y:N.y,scale:o.current,angle:N.angle})});p.set(M,G)}}),k&&y.add(()=>z(D))}catch(h){console.error("handleSocketMessage",h)}},d.current=performance.now(),te(),window.addEventListener("online",de),Te(l.config?(Number(l.config.vehicle_inactive_interval)||20)*1e3:Ue)}catch(l){console.warn(l)}}Re();function te(){u||s.current?.readyState===WebSocket.OPEN||s.current?.readyState===WebSocket.CONNECTING||(s.current=new WebSocket(a),s.current.onmessage=f.current,s.current.onopen=()=>{E.current=we},s.current.onclose=()=>{if(u||!navigator.onLine)return;v=window.setTimeout(te,E.current);const l=3e4;E.current=Math.min(E.current*2,l)})}function de(){te()}function Te(l){clearInterval(x.current),!u&&(x.current=window.setInterval(()=>{const W=performance.now(),C=[],U=[];m.current.forEach((Y,X)=>{if(W-Y<l)return;const $=I.get(X);$&&($.hidden=!0,U.push($),C.push(X));const D=ue(X),j=I.get(D);j&&(j.hidden=!0,U.push(j),C.push(D))}),U.length&&y.add(()=>z(...U)),C.forEach(Y=>m.current.delete(Y))},l))}return()=>{u=!0,clearTimeout(v);const l=s.current;l&&(l.onopen=null,l.onmessage=null,l.onclose=null,l.close(),s.current=null),f.current=null;const W=T.find(C=>C.name===ce);W&&(W.onScale=void 0),p.forEach(C=>C?.()),p.clear(),I.clear(),y.destroy(),window.removeEventListener("online",de),clearInterval(x.current)}},[e,t,n,a])}function Q(e){const t=ne.get(e);if(!t)throw new Error("useManageTraffic: an icon was drawn without a recorded CSS size");return t}function ye(e){return e*2}function Ye(e,t){const n=t*me,a=pe*2;return[t+ie+n/2+a,e+n+ie+a]}function Ee(e){return Math.min(e||1,ze)}function $e(e,t){return fe(e,t)}function je({radius:e,scale:t,color:n}){const a=Math.ceil(e*2*t),o=ge(a,a,t);ne.set(o,[ye(e),ye(e)]);const r=o.getContext("2d");r.imageSmoothingEnabled=!1;const c=a/2,s=e*.78,f=e*.33;return r.translate(c,c),r.scale(t,t),r.beginPath(),r.arc(0,0,e,0,2*Math.PI),r.fillStyle="#FFFFFF",r.fill(),r.beginPath(),r.arc(0,0,s,0,2*Math.PI),r.fillStyle=n,r.fill(),r.beginPath(),r.arc(0,0,f,0,2*Math.PI),r.fillStyle="#FFFFFF",r.fill(),o}function xe({id:e,width:t,height:n,color:a,scale:o}){const r=ie*o,c=t/2*o,s=n*o,f=me,d=.01,w=s*f,b=s,R=pe*o,E=b+r+w/2+R*2,m=c*2+w+r+R*2,x=ge(E,m,o);ne.set(x,Ye(t,n)),x.setAttribute("id",e);const u=x.getContext("2d"),v=E/2,T=m/2;u.save(),u.translate(v,T),u.rotate(-Math.PI/2),u.translate(-v,-T);const p=v,I=T-b/2+c,y=I+w;return u.shadowColor="rgba(16, 24, 40, 0.2)",u.shadowBlur=R/2,u.beginPath(),u.arc(p,I,c,Math.PI,0,!1),u.bezierCurveTo(p+c,I+s*.3,p+d*c,y,p,y),u.bezierCurveTo(p-d*c,y,p-c,I+s*.3,p-c,I),u.closePath(),u.fillStyle=a,u.fill(),u.strokeStyle="#FFFFFF",u.lineWidth=r,u.stroke(),u.restore(),x}function ae(e,t){return he(e,t)}function ue(e){return`${e}_finery`}function qe(e){e.onRoll=({roll:t})=>{const{bounds:n}=e;if(t!==n.rotation)return n.rotate(t-n.rotation,n),[e]}}function Me({updateQueue:e,vehicle:t,vehicleFinery:n,x:a,y:o,scale:r,angle:c}){const s=t.source;if(t.bounds=B(a,o,...Q(s),r,c),t.hidden=!1,n){const{size:f,rotation:d,elevation:w}=n.bounds;n.bounds=new be({x:a,y:o},f,d,w),n.hidden=!1,e.add(()=>z(n,t))}else e.add(()=>z(t))}function ee(e,t,n){return{x:e.x+(t.x-e.x)*n,y:e.y+(t.y-e.y)*n}}function Se(e,t){let n=1/0,a={index:0,t:0};for(let o=0;o<t.length-1;o++){const r=t[o],c=t[o+1],s=c.x-r.x,f=c.y-r.y,d=s*s+f*f,w=d?((e.x-r.x)*s+(e.y-r.y)*f)/d:0,b=Math.max(0,Math.min(1,w)),R=ee(r,c,b),E=ae(e,R);E<n&&(n=E,a={index:o,t:b})}return a}function Be(e,t,n){const a=ae(e,t),o=Math.max(2,Math.ceil(a/n)+1),r=[];for(let c=0;c<o;c++){const s=c/(o-1),f=ee(e,t,s);r.push(f)}return r}function Qe(e,t,n){if(!n||!n.length)return Be(e,t,10);const a=Se(e,n),o=Se(t,n),r=[],c=s=>r.push(s);a.index+1<n.length?c(ee(n[a.index],n[a.index+1],a.t)):c(n[a.index]);for(let s=a.index+1;s<=o.index&&s<n.length;s++)c(n[s]);return o.index+1<n.length?c(ee(n[o.index],n[o.index+1],o.t)):c(n[o.index]),r}function Xe(e,t,n,a){if(e.length<2)return()=>{};let o=null,r;const c=[];let s=0;for(let d=0;d<e.length-1;d++){const w=he(e[d],e[d+1]);c.push(w),s+=w}const f=d=>{o||(o=d);const w=d-o,b=Math.min(w/t,1),R=b*s;let E=0,m=0;for(;m<c.length&&E+c[m]<R;)E+=c[m],m++;m>=c.length&&(m=c.length-1);const x=e[m],u=e[Math.min(m+1,e.length-1)],v=c[m]||0,T=v===0?0:(R-E)/v,p=x.x+(u.x-x.x)*T,I=x.y+(u.y-x.y)*T,y=fe(x,u);n({x:p,y:I,angle:y}),b<1?r=requestAnimationFrame(f):a&&a()};return r=requestAnimationFrame(f),()=>{r&&cancelAnimationFrame(r)}}function le(e){return`${e.x},${e.y}`}const ne=new WeakMap;
+import{lineAngle as fe,pointDistance as he,Rect as be}from"@expofp/geometry";import{update as z}from"@expofp/renderer";import{useEffect as ve,useRef as S}from"react";import{attachExactRoll as Ce}from"../../../engine/utils/rotation.js";import _e from"../../../tools/base-runtime-url";import{loadImage as Fe}from"../../../utils/loadImage";import{mapCamera as Pe}from"../camera";import{createCanvas as ge,createImageCanvas as Ne,getBounds as B,imageCanvasCssSize as De}from"../drawing/config/canvases";import{getRouteLayerRegex as Oe,getRouteStopLayerRegex as He,TRAFFIC_VEHICLES as ce}from"./trafficLayers";import{UpdateQueue as Ve}from"./UpdateQueue";const se=2,ze=se*3.5,J=se*12,K=J*.7,We=8,ie=2,me=.6,pe=8,ke="transport_locations",Ge=150,Ye="#a4aab6",we=1e3,$e=2e4,Ie=500;export function useManageTraffic({permission:e,scene:n,dataJsonUrl:o,websocketUrl:a}){const t=S(1),r=S(new Map),c=S(new Map),s=S(null),f=S(null),d=S(0),w=S(1),b=S(new Ve),R=S(new Map),E=S(we),m=S(new Map),x=S(void 0);ve(()=>{if(!e||!n)return;let l=!1,_;const T=n.rootLayer.children,p=c.current,I=r.current,y=b.current;async function Re(){try{let u;try{const i=await fetch(o,{method:"GET",headers:{"Content-Type":"application/json"}});if(!i.ok||i.status===204)return;u=await i.json()}catch(i){console.warn("useManageTraffic failed to get JSON",i)}if(l||!u||u.disabled||u.error)return;t.current=Ee(Pe()?.state().pixelSize??1);const W=new Map(u.routes.map(({id:i,color:h})=>[i,h])),v=new Map;W.forEach(i=>{v.set(i,qe({radius:ze,color:i,scale:window.devicePixelRatio}))});const Y=Oe(),$=T.filter(i=>Y.test(i.name)),X=He(),U=T.filter(i=>X.test(i.name));u.routes.slice(0,$.length).forEach(({id:i,color:h,path:g,stops:O,hiddenPoints:L},k)=>{R.current.set(i,g);const M=$[k];if(M){const H=new Map(L?.map(P=>[ue(P),P])??[]);for(let P=1;P<g.length;P++){const A=g[P-1],V=g[P];H.has(ue(A))||H.has(ue(V))||M.children.push({points:{p0:A,p1:V},color:h,width:se})}M.children.length&&y.add(()=>z(M))}const C=U[k],F=v.get(h);C&&F&&O?.length&&(O.forEach(H=>{C.children.push({source:F,bounds:B(H.x,H.y,...Q(F),t.current)})}),C.children.length&&y.add(()=>z(C)))});const D=T.find(i=>i.name===ce);if(!D){console.warn(`useManageTraffic: the scene has no "${ce}" layer`);return}const j=new Map;D.onScale=({pixelSize:i})=>{t.current=Ee(i);const h=[];for(const g of U){const O=g.children;for(const L of O){const k=L.source;L.bounds=B(L.bounds.center.x,L.bounds.center.y,...Q(k),t.current,L.bounds.rotation),h.push(L)}}for(const g of r.current.values()){const O=g.source;g.bounds=B(g.bounds.center.x,g.bounds.center.y,...Q(O),t.current,g.bounds.rotation),h.push(g)}return h},y.add(()=>z(D)),W.forEach((i,h)=>{j.set(h,xe({id:h,width:J,height:J,color:i,scale:window.devicePixelRatio}))});const Le=xe({id:"orphan",width:J,height:J,color:Ye,scale:window.devicePixelRatio});let q=null;try{const i=await Fe(`${_e}icons/bus-white.svg`);if(l)return;q=Ne(i,K,K,window.devicePixelRatio);const{width:h,height:g}=De(i,K,K);ne.set(q,[h,g])}catch(i){console.error(i)}f.current=i=>{try{const h=JSON.parse(i.data);if(h.type!==ke)return;const g=i.timeStamp||performance.now();w.current=Math.round(g-d.current),d.current=g;const O=Math.max(w.current??Ie,Ie),L=D.children;let k=!1;h.data.forEach(({id:M,x:C,y:F,route_id:H,hidden:P})=>{p.has(M)&&(p.get(M)?.(),p.delete(M));const A=I.get(M),V=I.get(le(M))??null;if(P&&A&&V){A.hidden=!0,V.hidden=!0,y.add(()=>z(A,V));return}if(m.current.set(M,performance.now()),!A){const G=j.get(H)??Le,N={source:G,bounds:B(C,F,...Q(G),t.current,0)};if(I.set(M,N),q){const Z=le(M),re={source:q,bounds:B(C,F,...Q(q),t.current,0)};Ce(re),q.setAttribute("id",Z),I.set(Z,re),L.push(N,re)}else L.push(N);k=!0;return}const Ae=A.bounds.center,oe=Qe(Ae,{x:C,y:F},R.current.get(H));if(oe.reduce((G,N,Z)=>Z===0?G:G+ae(oe[Z-1],N),0)>=Ge||document.hidden)Me({updateQueue:y,vehicle:A,vehicleFinery:V,x:C,y:F,scale:t.current,angle:je(A.bounds.center,{x:C,y:F})});else{const G=Xe(oe,O,N=>{Me({updateQueue:y,vehicle:A,vehicleFinery:V,x:N.x,y:N.y,scale:t.current,angle:N.angle})});p.set(M,G)}}),k&&y.add(()=>z(D))}catch(h){console.error("handleSocketMessage",h)}},d.current=performance.now(),te(),window.addEventListener("online",de),Te(u.config?(Number(u.config.vehicle_inactive_interval)||20)*1e3:$e)}catch(u){console.warn(u)}}Re();function te(){l||s.current?.readyState===WebSocket.OPEN||s.current?.readyState===WebSocket.CONNECTING||(s.current=new WebSocket(a),s.current.onmessage=f.current,s.current.onopen=()=>{E.current=we},s.current.onclose=()=>{if(l||!navigator.onLine)return;_=window.setTimeout(te,E.current);const u=3e4;E.current=Math.min(E.current*2,u)})}function de(){te()}function Te(u){clearInterval(x.current),!l&&(x.current=window.setInterval(()=>{const W=performance.now(),v=[],Y=[];m.current.forEach(($,X)=>{if(W-$<u)return;const U=I.get(X);U&&(U.hidden=!0,Y.push(U),v.push(X));const D=le(X),j=I.get(D);j&&(j.hidden=!0,Y.push(j),v.push(D))}),Y.length&&y.add(()=>z(...Y)),v.forEach($=>m.current.delete($))},u))}return()=>{l=!0,clearTimeout(_);const u=s.current;u&&(u.onopen=null,u.onmessage=null,u.onclose=null,u.close(),s.current=null),f.current=null;const W=T.find(v=>v.name===ce);W&&(W.onScale=void 0),p.forEach(v=>v?.()),p.clear(),I.clear(),y.destroy(),window.removeEventListener("online",de),clearInterval(x.current)}},[e,n,o,a])}function Q(e){const n=ne.get(e);if(!n)throw new Error("useManageTraffic: an icon was drawn without a recorded CSS size");return n}function ye(e){return e*2}function Ue(e,n){const o=n*me,a=pe*2;return[n+ie+o/2+a,e+o+ie+a]}function Ee(e){return Math.min(e||1,We)}function je(e,n){return fe(e,n)}function qe({radius:e,scale:n,color:o}){const a=Math.ceil(e*2*n),t=ge(a,a,n);ne.set(t,[ye(e),ye(e)]);const r=t.getContext("2d");r.imageSmoothingEnabled=!1;const c=a/2,s=e*.78,f=e*.33;return r.translate(c,c),r.scale(n,n),r.beginPath(),r.arc(0,0,e,0,2*Math.PI),r.fillStyle="#FFFFFF",r.fill(),r.beginPath(),r.arc(0,0,s,0,2*Math.PI),r.fillStyle=o,r.fill(),r.beginPath(),r.arc(0,0,f,0,2*Math.PI),r.fillStyle="#FFFFFF",r.fill(),t}function xe({id:e,width:n,height:o,color:a,scale:t}){const r=ie*t,c=n/2*t,s=o*t,f=me,d=.01,w=s*f,b=s,R=pe*t,E=b+r+w/2+R*2,m=c*2+w+r+R*2,x=ge(E,m,t);ne.set(x,Ue(n,o)),x.setAttribute("id",e);const l=x.getContext("2d"),_=E/2,T=m/2;l.save(),l.translate(_,T),l.rotate(-Math.PI/2),l.translate(-_,-T);const p=_,I=T-b/2+c,y=I+w;return l.shadowColor="rgba(16, 24, 40, 0.2)",l.shadowBlur=R/2,l.beginPath(),l.arc(p,I,c,Math.PI,0,!1),l.bezierCurveTo(p+c,I+s*.3,p+d*c,y,p,y),l.bezierCurveTo(p-d*c,y,p-c,I+s*.3,p-c,I),l.closePath(),l.fillStyle=a,l.fill(),l.strokeStyle="#FFFFFF",l.lineWidth=r,l.stroke(),l.restore(),x}function ae(e,n){return he(e,n)}function le(e){return`${e}_finery`}function Me({updateQueue:e,vehicle:n,vehicleFinery:o,x:a,y:t,scale:r,angle:c}){const s=n.source;if(n.bounds=B(a,t,...Q(s),r,c),n.hidden=!1,o){const{size:f,rotation:d,elevation:w}=o.bounds;o.bounds=new be({x:a,y:t},f,d,w),o.hidden=!1,e.add(()=>z(o,n))}else e.add(()=>z(n))}function ee(e,n,o){return{x:e.x+(n.x-e.x)*o,y:e.y+(n.y-e.y)*o}}function Se(e,n){let o=1/0,a={index:0,t:0};for(let t=0;t<n.length-1;t++){const r=n[t],c=n[t+1],s=c.x-r.x,f=c.y-r.y,d=s*s+f*f,w=d?((e.x-r.x)*s+(e.y-r.y)*f)/d:0,b=Math.max(0,Math.min(1,w)),R=ee(r,c,b),E=ae(e,R);E<o&&(o=E,a={index:t,t:b})}return a}function Be(e,n,o){const a=ae(e,n),t=Math.max(2,Math.ceil(a/o)+1),r=[];for(let c=0;c<t;c++){const s=c/(t-1),f=ee(e,n,s);r.push(f)}return r}function Qe(e,n,o){if(!o||!o.length)return Be(e,n,10);const a=Se(e,o),t=Se(n,o),r=[],c=s=>r.push(s);a.index+1<o.length?c(ee(o[a.index],o[a.index+1],a.t)):c(o[a.index]);for(let s=a.index+1;s<=t.index&&s<o.length;s++)c(o[s]);return t.index+1<o.length?c(ee(o[t.index],o[t.index+1],t.t)):c(o[t.index]),r}function Xe(e,n,o,a){if(e.length<2)return()=>{};let t=null,r;const c=[];let s=0;for(let d=0;d<e.length-1;d++){const w=he(e[d],e[d+1]);c.push(w),s+=w}const f=d=>{t||(t=d);const w=d-t,b=Math.min(w/n,1),R=b*s;let E=0,m=0;for(;m<c.length&&E+c[m]<R;)E+=c[m],m++;m>=c.length&&(m=c.length-1);const x=e[m],l=e[Math.min(m+1,e.length-1)],_=c[m]||0,T=_===0?0:(R-E)/_,p=x.x+(l.x-x.x)*T,I=x.y+(l.y-x.y)*T,y=fe(x,l);o({x:p,y:I,angle:y}),b<1?r=requestAnimationFrame(f):a&&a()};return r=requestAnimationFrame(f),()=>{r&&cancelAnimationFrame(r)}}function ue(e){return`${e.x},${e.y}`}const ne=new WeakMap;

package/dist/esm/engine/utils/rotation.d.ts

@@ -9,5 +9,13 @@ export declare function flipImageDef(imageDef: ImageDef, angle: number): boolean
  * @returns The same def.
  */
 export declare function attachCardinalSnap(imageDef: ImageDef): ImageDef;
+/**
+ * Declares the camera-roll rule on a def that has to stay upright on screen: it turns to the plan's
+ * exact roll, where {@link attachCardinalSnap} follows it in quarter turns. So an unchanged roll is
+ * the only no-op.
+ * @param imageDef - The def to keep upright.
+ * @returns The same def.
+ */
+export declare function attachExactRoll(imageDef: ImageDef): ImageDef;
 export declare function rotateImageDef(imageDef: ImageDef, angle: number): boolean;
 //# sourceMappingURL=rotation.d.ts.map

package/dist/esm/engine/utils/rotation.js

@@ -1 +1 @@
-import{flipAngle as h,getQuarterTurns as f,shouldFlip as y}from"../update-def";export function isInnerInsideOuter(t,o){if(!o)return!1;const n=Math.cos(o.rotation??0),s=Math.sin(o.rotation??0),r=o.size.x/2,c=o.size.y/2;return l(t,t.rotation+Math.PI/2).every(a=>{const i=a.x-o.center.x,u=a.y-o.center.y,e=i*n+u*s,x=u*n-i*s;return Math.abs(e)<=r&&Math.abs(x)<=c})}function l(t,o=t.rotation){const n=t.size.x/2,s=t.size.y/2,r=Math.sin(o),c=Math.cos(o),a=t.center.x,i=t.center.y;return[{x:-n,y:-s},{x:n,y:-s},{x:n,y:s},{x:-n,y:s}].map(e=>({x:a+e.x*c-e.y*r,y:i+e.x*r+e.y*c}))}export function flipImageDef(t,o){const n=t.bounds;return y(o,n.rotation)?(n.rotate(h(n.rotation)-n.rotation,n),!0):!1}export function attachCardinalSnap(t){return t.onRoll=({roll:o})=>rotateImageDef(t,o)?[t]:void 0,t}export function rotateImageDef(t,o){const n=t.bounds,s=f(o,n.rotation);return s===0?!1:(n.rotate(s*Math.PI/2,n),!0)}
+import{flipAngle as h,getQuarterTurns as y,shouldFlip as f}from"../update-def";export function isInnerInsideOuter(n,o){if(!o)return!1;const t=Math.cos(o.rotation??0),s=Math.sin(o.rotation??0),r=o.size.x/2,c=o.size.y/2;return l(n,n.rotation+Math.PI/2).every(a=>{const i=a.x-o.center.x,u=a.y-o.center.y,e=i*t+u*s,x=u*t-i*s;return Math.abs(e)<=r&&Math.abs(x)<=c})}function l(n,o=n.rotation){const t=n.size.x/2,s=n.size.y/2,r=Math.sin(o),c=Math.cos(o),a=n.center.x,i=n.center.y;return[{x:-t,y:-s},{x:t,y:-s},{x:t,y:s},{x:-t,y:s}].map(e=>({x:a+e.x*c-e.y*r,y:i+e.x*r+e.y*c}))}export function flipImageDef(n,o){const t=n.bounds;return f(o,t.rotation)?(t.rotate(h(t.rotation)-t.rotation,t),!0):!1}export function attachCardinalSnap(n){return n.onRoll=({roll:o})=>rotateImageDef(n,o)?[n]:void 0,n}export function attachExactRoll(n){return n.onRoll=({roll:o})=>{const{bounds:t}=n;if(o!==t.rotation)return t.set(t.center.x,t.center.y,t.size.x,t.size.y,o,t.elevation),[n]},n}export function rotateImageDef(n,o){const t=n.bounds,s=y(o,t.rotation);return s===0?!1:(t.rotate(s*Math.PI/2,t),!0)}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@expofp/floorplan",
-  "version": "3.45.11",
+  "version": "3.45.12",
   "repository": {
     "type": "git",
     "url": "https://github.com/expofp/efp-app.git",
@@ -69,15 +69,15 @@
     "tslib": "^2.3.0",
     "uuid": "^9.0.1",
     "zod": "4.4.3",
-    "@expofp/config": "3.45.11",
-    "@expofp/debug": "3.45.11",
-    "@expofp/geometry": "3.45.11",
-    "@expofp/renderer": "3.45.11",
-    "@expofp/resolve": "3.45.11",
-    "@expofp/schema": "3.45.11",
-    "@expofp/ui": "3.45.11",
-    "@expofp/utils": "3.45.11",
-    "@expofp/wayfinding": "3.45.11"
+    "@expofp/config": "3.45.12",
+    "@expofp/debug": "3.45.12",
+    "@expofp/geometry": "3.45.12",
+    "@expofp/renderer": "3.45.12",
+    "@expofp/resolve": "3.45.12",
+    "@expofp/schema": "3.45.12",
+    "@expofp/ui": "3.45.12",
+    "@expofp/utils": "3.45.12",
+    "@expofp/wayfinding": "3.45.12"
   },
   "devDependencies": {
     "@babel/plugin-proposal-decorators": "^8.0.2",