@ray-js/robot-map-sdk 0.0.3-beta-21 → 0.0.3-beta-23

package/dist/application/MapApplication.js

@@ -1 +1 @@
-import{Application as t,isMobile as e,Assets as n}from"pixi.js";import{Interaction as a}from"./Interaction.js";import{merge as r}from"lodash-es";import{proxy as i}from"valtio/vanilla";import{MAIN_INSTANCE_KEY as o}from"../constant/index.js";import s from"mitt";import{Logger as c}from"../utils/logger.js";import{AppContext as h}from"./AppService.js";import{nanoid as m}from"nanoid/non-secure";import{calculateLineEndpoints as d,isPointInPolygon as p,binarySearch as l,areStructuredRoomsAdjacent as g,areMultipleRoomsConnected as u,areRasterRoomsAdjacent as w}from"../utils/algorithm.js";import{ViewportContainer as f}from"./ViewportContainer.js";import{AppContainer as y}from"./AppContainer.js";import{MapManager as M}from"../managers/MapManager.js";import{PathManager as S}from"../managers/PathManager.js";import{HeatmapManager as x}from"../managers/HeatmapManager.js";import{ControlsManager as P}from"../managers/ControlsManager.js";import{DetectedObjectManager as b}from"../managers/DetectedObjectManager.js";import{CustomElementsManager as v}from"../managers/CustomElementsManager.js";import{RoomManager as R}from"../managers/RoomManager.js";import{getOptimalAntialiasingStrategy as C}from"../utils/browser.js";import{DEFAULT_CONFIG as I,DEFAULT_RUNTIME_CONFIG as O}from"../constant/config.js";class F extends t{mapState=null;components={};managers={};config=I;runtime;scaleMin=.5;scaleMax=5;events={};instanceKey;containerElement;emitter=s();tickerState={renderReasons:new Set,renderTimer:null};pendingAsyncRender=!1;isFirstMapDraw=!0;constructor(t=o){super(),this.instanceKey=t,h.registerInstance(t,this),globalThis.__PIXI_APP__=this}async initialize(t){return h.provideAsync(this,async()=>{const{resizeTo:n,events:a,config:s,runtime:h={},...m}=t;this.config=r(this.config,s??{}),c.log("Applying config",this.config,s),this.runtime=i(Object.assign({},O,h));const d=this.instanceKey===o;this.containerElement=n;const p=d?{textureGCMaxIdle:e.any?180:3600,textureGCCheckCountMax:e.any?100:50,autoStart:!1,eventFeatures:{move:!0,globalMove:!1,click:!0,wheel:!0}}:{textureGCMaxIdle:60,textureGCCheckCountMax:10,autoStart:!1,eventFeatures:{move:!1,globalMove:!1,click:!1,wheel:!1}};await this.init({resizeTo:d?n:void 0,preferWebGLVersion:2,resolution:window.devicePixelRatio||1,antialias:C(),autoDensity:!0,backgroundColor:this.config.global.backgroundColor,...p,...m}),this.preloadAssets(),this.scaleMax=this.config.interaction.zoomRange.max,this.scaleMin=this.config.interaction.zoomRange.min,this.events=a,this.initializeViewportContainer(),this.initializeInteraction(),this.initializeAppContainer(),this.managers.mapManager=new M,this.managers.heatmapManager=new x,this.managers.pathManager=new S,this.managers.controlsManager=new P,this.managers.detectedObjectManager=new b,this.managers.customElementsManager=new v,this.managers.roomsManager=new R,document.addEventListener("visibilitychange",this.onVisibilityChange)})}async drawMap(t){return h.provideAsync(this,async()=>{c.log("[Map] drawMap",t);const{size:e,resolution:n,origin:a}=t;a[0]===this.mapState?.origin.x&&a[1]===this.mapState?.origin.y||(this.managers.pathManager.updatePositionByOrigin(...a),this.managers.controlsManager.updatePositionByOrigin(...a),this.managers.detectedObjectManager.updatePositionByOrigin(...a),this.managers.customElementsManager.updatePositionByOrigin(...a)),this.mapState={id:t.id,status:1===t.status,origin:{x:a[0],y:a[1]},charger:{x:t.charger.coordinate[0],y:t.charger.coordinate[1]},chargerDirection:t.charger.angle??0,resolution:n,width:e[0],height:e[1],mapType:"structured"},this.isFirstMapDraw&&(this.isFirstMapDraw=!1,this.events?.onMapFirstDrawed?.(this.mapState)),this.events?.onMapDrawed?.(this.mapState),await this.managers.mapManager.drawMap(t),this.renderOnce()})}async drawRasterMap(t){return h.provideAsync(this,async()=>{c.log("[Map] drawRasterMap",t);const{mapHeader:e,mapData:n}=t,{originX:a,originY:r}=e;a===this.mapState?.origin.x&&r===this.mapState?.origin.y||(this.managers.pathManager.updatePositionByOrigin(a,r),this.managers.controlsManager.updatePositionByOrigin(a,r),this.managers.detectedObjectManager.updatePositionByOrigin(a,r),this.managers.customElementsManager.updatePositionByOrigin(a,r)),this.mapState={id:e.id,status:e.mapStable,origin:{x:a,y:r},charger:{x:e.chargeX,y:e.chargeY},chargerDirection:e.chargeDirection??0,resolution:100*e.mapResolution,width:e.mapWidth,height:e.mapHeight,version:e.version,mapType:"raster"},this.isFirstMapDraw&&(this.isFirstMapDraw=!1,this.events?.onMapFirstDrawed?.(this.mapState)),this.events?.onMapDrawed?.(this.mapState),await this.managers.mapManager.drawRasterMap(n.parsed,this.mapState),this.renderOnce()})}drawPath(t){return h.provide(this,()=>{c.log("[Path] drawPath",t),this.events?.onPathDrawed?.({id:t.pathHeader.pathId,type:t.pathHeader.type,direction:t.pathHeader.direction,count:t.pathHeader.count,initFlag:t.pathHeader.initFlag,robotPosition:t.pathPoints[t.pathPoints.length-1]??null}),this.managers.pathManager.draw(t),this.renderOnce()})}async drawRoomProperty(t){return h.provide(this,()=>{c.log("[Room] drawRoomProperty",t),this.events?.onRoomPropertiesDrawed?.(t),this.managers.roomsManager.drawRoomProperty(t),this.renderOnceNextFrame()})}drawHeatmap({mapData:t,heatmapPoints:e,useGradient:n=!0}){return h.provide(this,()=>{c.log("[Heatmap] drawHeatmap",e),this.managers.heatmapManager.draw({mapData:t,heatmapPoints:e,useGradient:n}),this.renderOnce()})}drawForbiddenSweepZones(t){return h.provide(this,()=>{c.log("[Controls] drawForbiddenSweepZones",t),this.managers.controlsManager.drawForbiddenSweepZones(t),this.renderOnceNextFrame()})}drawForbiddenMopZones(t){return h.provide(this,()=>{c.log("[Controls] drawForbiddenMopZones",t),this.managers.controlsManager.drawForbiddenMopZones(t),this.renderOnceNextFrame()})}drawCleanZones(t){return h.provide(this,()=>{c.log("[Controls] drawCleanZones",t),this.managers.controlsManager.drawCleanZones(t),this.renderOnceNextFrame()})}drawVirtualWalls(t){return h.provide(this,()=>{c.log("[Controls] drawVirtualWalls",t),this.managers.controlsManager.drawVirtualWalls(t),this.renderOnceNextFrame()})}drawSpots(t){return h.provide(this,()=>{c.log("[Controls] drawSpots",t),this.managers.controlsManager.drawSpots(t),this.renderOnceNextFrame()})}async drawDetectedObjects(t){return h.provideAsync(this,async()=>{c.log("[DetectedObject] drawDetectedObjects",t),await this.managers.detectedObjectManager.drawDetectedObjects(t),this.renderOnceNextFrame()})}async drawCustomElements(t){return h.provideAsync(this,async()=>{c.log("[CustomElements] drawCustomElements",t),await this.managers.customElementsManager.drawCustomElements(t),this.renderOnceNextFrame()})}getForbiddenSweepZones(){return this.managers.controlsManager.getForbiddenSweepZones()}getForbiddenMopZones(){return this.managers.controlsManager.getForbiddenMopZones()}getCleanZones(){return this.managers.controlsManager.getCleanZones()}getVirtualWalls(){return this.managers.controlsManager.getVirtualWalls()}getSpots(){return this.managers.controlsManager.getSpots()}getEffectiveDividerPoints(){return this.managers.controlsManager.getEffectiveDividerPoints()}getDividerEndPoints(){return this.managers.controlsManager.getDividerEndPoints()}resetPanZoom(){this.components.interaction.setPanZoom()}fitMapToView(t,e=!1){return h.provide(this,()=>{if(!t||t.minX===t.maxX||t.minY===t.maxY)return void c.warn("地图边界无效，无法自动适配视图");const n=this.config.map.autoPaddingPercent||.1,a=this.getViewportBounds(),r=t.maxX-t.minX,i=t.maxY-t.minY,o=a.width,s=a.height,h=o*(1-2*n)/r,m=s*(1-2*n)/i,d=Math.min(h,m),p=Math.max(this.config.interaction.fitMinScale,this.scaleMin),l=Math.min(this.config.interaction.fitMaxScale,this.scaleMax),g=Math.max(p,Math.min(l,d)),u=o/2-(t.minX+r/2)*g,w=s/2-(t.minY+i/2)*g;this.components.interaction.setPanZoom({targetPosition:{x:u,y:w},targetScale:{x:g,y:g},setCenter:!0,setScale:!0},e)})}getViewportBounds(){return this.components.viewportContainer?.getViewportBounds()||{x:0,y:0,width:this.renderer.width,height:this.renderer.height}}updateRuntime(t){Object.assign(this.runtime,t),this.renderOnceNextFrame()}metersToPixels(t){return this.mapState?.resolution?t*(1/(this.mapState.resolution/100)):(c.warn("Map resolution not available, using default resolution (5cm/pixel)"),20*t)}pixelsToMeters(t){return this.mapState?.resolution?t*(this.mapState.resolution/100):(c.warn("Map resolution not available, using default resolution (5cm/pixel)"),.05*t)}toFixedSize(t,e){return t/(e??this.components.appContainer.scale.x)}fromFixedSize(t,e){return t*(e??this.components.appContainer.scale.x)}getViewportCenterPoint(){if(!this.mapState)return c.warn("Map state not available, cannot calculate center point"),null;const t=this.getViewportBounds(),e=t.x+t.width/2,n=t.y+t.height/2,a=this.components.appContainer,r=a.scale.x,i=(e-a.x)/r,o=(n-a.y)/r;return{x:i-this.mapState.origin.x,y:o-this.mapState.origin.y}}getMapCenterPoint(){if(!this.mapState)return c.warn("Map state not available, cannot calculate map center point"),null;const t=this.managers.mapManager.mapBounds;if(t.minX===1/0||t.minY===1/0||t.maxX===-1/0||t.maxY===-1/0)return c.warn("Invalid map bounds, cannot calculate map center point"),null;const e=(t.minX+t.maxX)/2,n=(t.minY+t.maxY)/2;return{x:e-this.mapState.origin.x,y:n-this.mapState.origin.y}}getWallPointsByViewportCenter(t){const{width:e=this.config.controls.virtualWall.minWidth,direction:n="horizontal",offsetX:a=0,offsetY:r=0}=t||{},i=this.getViewportCenterPoint()||{x:0,y:0},o=this.metersToPixels(e);return d(i.x,i.y,o,n).map(t=>({x:t.x+a,y:t.y+r}))}getForbiddenSweepZonePointsByViewportCenter(t){const e=this.config.controls.forbiddenSweepZone,{size:n=e.minSize,offsetX:a=0,offsetY:r=0}=t||{};return this.generateZonePoints(n,a,r)}getForbiddenMopZonePointsByViewportCenter(t){const e=this.config.controls.forbiddenMopZone,{size:n=e.minSize,offsetX:a=0,offsetY:r=0}=t||{};return this.generateZonePoints(n,a,r)}getCleanZonePointsByViewportCenter(t){const e=this.config.controls.cleanZone,{size:n=e.minSize,offsetX:a=0,offsetY:r=0}=t||{};return this.generateZonePoints(n,a,r)}getSpotPointByViewportCenter(t){const{offsetX:e=0,offsetY:n=0}=t||{},a=this.getViewportCenterPoint()||{x:0,y:0};return{x:a.x+e,y:a.y+n}}areRoomsAdjacent(t){const e=this.config.map.adjacencyThreshold;return h.provide(this,()=>{if(!t||0===t.length)return c.warn("[Room] No room IDs provided"),!1;if(1===t.length)return!0;const n=Array.from(new Set(t));return 1===n.length||("raster"===(this.mapState?.mapType??"structured")?this.areRasterRoomsAdjacentInternal(n,e):this.areStructuredRoomsAdjacentInternal(n,e))})}isPointInAnyRoom(t){return h.provide(this,()=>t&&"number"==typeof t.x&&"number"==typeof t.y?"raster"===(this.mapState?.mapType??"structured")?this.isPointInAnyRoomRasterInternal(t):this.isPointInAnyRoomStructuredInternal(t):(c.warn("[Room] Invalid point provided"),null))}isPointInAnyRoomStructuredInternal(t){if(!this.mapState)return c.warn("[Room] Map state not available"),null;const e={x:t.x+this.mapState.origin.x,y:t.y+this.mapState.origin.y},n=this.managers.mapManager.getAllRooms();for(const t of n)if(t.outlinePoints&&t.outlinePoints.length>=3&&p(e,t.outlinePoints))return this.managers.roomsManager.getRoomPropertyById(t.id)||(c.warn(`[Room] Room ${t.id} found in geometry but not in RoomManager`),null);return null}isPointInAnyRoomRasterInternal(t){if(!this.mapState)return c.warn("[Room] Map state not available"),null;const e=this.mapState.width,n=this.mapState.height,a=t.x+this.mapState.origin.x,r=t.y+this.mapState.origin.y,i=Math.round(a),o=Math.round(r);if(i<0||i>=e||o<0||o>=n)return c.warn(`[Room] Point (${i}, ${o}) is out of map bounds (${e}x${n})`),null;const s=o*e+i,h=this.managers.mapManager.getAllRooms();for(const t of h){const e=this.managers.mapManager.getRasterRoomPixels(t.id);if(e&&e.length>0&&l(e,s))return this.managers.roomsManager.getRoomPropertyById(t.id)||(c.warn(`[Room] Room ${t.id} found in geometry but not in RoomManager`),null)}return null}areStructuredRoomsAdjacentInternal(t,e){const n=[];for(const e of t){const t=this.managers.mapManager.getRoomById(e);if(!t)return c.warn(`[Room] Room ${e} not found in map`),!1;if(!t.outlinePoints||0===t.outlinePoints.length)return c.warn(`[Room] Room ${e} has no outline points`),!1;n.push({id:e,points:t.outlinePoints})}const a=[];for(let t=0;t<n.length;t++)for(let r=t+1;r<n.length;r++){const i=n[t],o=n[r];g(i.points,o.points,e)&&a.push([t,r])}return u(n.length,a)}areRasterRoomsAdjacentInternal(t,e){if(!this.mapState)return c.warn("[Room] Map state not available"),!1;const n=this.mapState.width,a=[];for(const e of t){const t=this.managers.mapManager.getRasterRoomPixels(e);if(!t)return c.warn(`[Room] Room ${e} pixel data not found in raster map`),!1;a.push({id:e,pixels:t})}const r=[];for(let t=0;t<a.length;t++)for(let i=t+1;i<a.length;i++){const o=a[t],s=a[i];w(o.pixels,s.pixels,n,e)&&r.push([t,i])}return u(a.length,r)}async snapshot(){this.render(),await new Promise(t=>setTimeout(t,0));const{snapshot:t}=this.config;return await this.renderer.extract.base64({target:this.components.appContainer,format:t.format,quality:t.quality,resolution:t.resolution,antialias:t.antialias})}async snapshotByData({map:t,path:e,roomProperties:n,customElements:a,forbiddenSweepZones:r,forbiddenMopZones:i,virtualWalls:o,detectedObjects:s},h={}){const d=`SNAPSHOT_${m()}`;c.log(`[MapApplication] ${d} snapshot start`);const p=new F(d);try{if(await p.initialize({config:this.config,runtime:h}),!t)throw new Error("Map data is required");if(t.startsWith("7b22")){const{decodeMapStructured:e}=await import("@ray-js/robot-protocol"),n=e(t);await p.drawMap(n)}else{const{decodeMap:e}=await import("@ray-js/robot-protocol"),n=e(t);if(!n)throw new Error("Failed to decode raster map data");await p.drawRasterMap(n)}if(e){const{decodePath:t}=await import("@ray-js/robot-protocol"),n=t(e);p.drawPath(n)}n&&n.length>0&&p.drawRoomProperty(n),r&&r.length>0&&p.drawForbiddenSweepZones(r),i&&i.length>0&&p.drawForbiddenMopZones(i),o&&o.length>0&&p.drawVirtualWalls(o),s&&s.length>0&&await p.drawDetectedObjects(s),a&&a.length>0&&await p.drawCustomElements(a);const m=await p.snapshot();return c.log(`[MapApplication] ${d} snapshot completed successfully`),m}catch(t){throw c.error(`[MapApplication] ${d} snapshot other map failed:`,t),t}finally{c.log(`[MapApplication] ${d} destroy`),p.destroy()}}renderOnce(){c.log("[Pixi] renderOnce"),this.render()}renderOnceNextFrame(){this.pendingAsyncRender||(this.pendingAsyncRender=!0,requestAnimationFrame(()=>{c.log("[Pixi] renderOnceNextFrame"),this.render(),this.pendingAsyncRender=!1}))}requestRender(t,e=!1){e?(this.tickerState.renderReasons.add(t),this.ticker.started||(c.debug(`🎬 [Ticker] START: ${t}`),this.ticker.start())):this.renderOnceNextFrame()}stopRender(t){this.tickerState.renderReasons.delete(t),0===this.tickerState.renderReasons.size&&this.scheduleStopRender("final",100)}destroy(){h.unregisterInstance(this.instanceKey),this.tickerState.renderTimer&&clearTimeout(this.tickerState.renderTimer),this.tickerState.renderReasons.clear(),this.emitter.all.clear(),document.removeEventListener("visibilitychange",this.onVisibilityChange),this.managers.pathManager.destroy(),this.managers.mapManager.destroy(),this.managers.controlsManager.destroy(),this.managers.detectedObjectManager.destroy(),this.managers.customElementsManager.destroy(),this.managers.roomsManager.destroy(),this.components.interaction.destroy(),this.components.viewportContainer.destroy(),this.components.appContainer.destroy(),super.destroy()}initializeViewportContainer(){this.components.viewportContainer=new f(this.config,this.containerElement),this.stage.addChild(this.components.viewportContainer)}initializeAppContainer(){this.components.appContainer=new y,this.components.interaction.addChild(this.components.appContainer)}initializeInteraction(){this.components.interaction=new a,this.components.viewportContainer.addChild(this.components.interaction)}scheduleStopRender(t,e){this.tickerState.renderTimer&&clearTimeout(this.tickerState.renderTimer),this.tickerState.renderTimer=setTimeout(()=>{this.tickerState.renderReasons.delete(t),0===this.tickerState.renderReasons.size&&(c.debug("⏸️ [Ticker] STOP"),this.ticker.stop())},e)}generateZonePoints(t,e,n){const a=this.getViewportCenterPoint()||{x:0,y:0},r=this.metersToPixels(t)/2,i=a.x+e,o=a.y+n;return[{x:i-r,y:o-r},{x:i+r,y:o-r},{x:i+r,y:o+r},{x:i-r,y:o+r}]}preloadAssets(){const t=this.config.robot.icon.src,e=this.config.chargingStation.icon.src,a=[];n.add({alias:"robot",src:t}),a.push("robot"),n.add({alias:"chargingStation",src:e}),a.push("chargingStation"),n.add({alias:"deleteIcon",src:this.config.controls.deleteIconSrc}),a.push("deleteIcon"),n.add({alias:"rotateIcon",src:this.config.controls.rotateIconSrc}),a.push("rotateIcon"),n.add({alias:"scaleIcon",src:this.config.controls.scaleIconSrc}),a.push("scaleIcon"),n.add({alias:"moveIcon",src:this.config.controls.moveIconSrc}),a.push("moveIcon"),n.add({alias:"checkmark",src:this.config.room.selectionIndicator.iconSrc}),a.push("checkmark"),n.add({alias:"spotIcon",src:this.config.controls.spot.iconSrc}),a.push("spotIcon"),this.config.room.property.cleanMode.assets.forEach((t,e)=>{const r=`cleanMode_${e}`;n.add({alias:r,src:t}),a.push(r)}),this.config.room.property.suction.assets.forEach((t,e)=>{const r=`fan_${e}`;n.add({alias:r,src:t}),a.push(r)}),this.config.room.property.cistern.assets.forEach((t,e)=>{const r=`water_${e}`;n.add({alias:r,src:t}),a.push(r)}),this.config.room.property.cleanTimes.assets.forEach((t,e)=>{const r=`cleanTimes${e+1}`;n.add({alias:r,src:t}),a.push(r)}),this.config.room.floorType.assets.forEach((t,e)=>{if(!t)return;const r=`floorType${e}`;n.add({alias:r,src:t}),a.push(r)}),n.backgroundLoad(a)}onVisibilityChange=()=>{"visible"===document.visibilityState||this.components.interaction?.clearTouches()}}export{F as MapApplication};
+import{Application as t,isMobile as e,Assets as n}from"pixi.js";import{Interaction as a}from"./Interaction.js";import{mergeWith as r}from"lodash-es";import{proxy as i}from"valtio/vanilla";import{MAIN_INSTANCE_KEY as o}from"../constant/index.js";import s from"mitt";import{Logger as c}from"../utils/logger.js";import{AppContext as h}from"./AppService.js";import{nanoid as m}from"nanoid/non-secure";import{calculateLineEndpoints as p,isPointInPolygon as d,binarySearch as l,areStructuredRoomsAdjacent as g,areMultipleRoomsConnected as u,areRasterRoomsAdjacent as w}from"../utils/algorithm.js";import{ViewportContainer as f}from"./ViewportContainer.js";import{AppContainer as y}from"./AppContainer.js";import{MapManager as M}from"../managers/MapManager.js";import{PathManager as S}from"../managers/PathManager.js";import{HeatmapManager as x}from"../managers/HeatmapManager.js";import{ControlsManager as P}from"../managers/ControlsManager.js";import{DetectedObjectManager as b}from"../managers/DetectedObjectManager.js";import{CustomElementsManager as v}from"../managers/CustomElementsManager.js";import{RoomManager as R}from"../managers/RoomManager.js";import{getOptimalAntialiasingStrategy as C}from"../utils/browser.js";import{DEFAULT_CONFIG as I,DEFAULT_RUNTIME_CONFIG as O}from"../constant/config.js";class j extends t{mapState=null;components={};managers={};config=I;runtime;scaleMin=.5;scaleMax=5;events={};instanceKey;containerElement;emitter=s();tickerState={renderReasons:new Set,renderTimer:null};pendingAsyncRender=!1;isFirstMapDraw=!0;constructor(t=o){super(),this.instanceKey=t,h.registerInstance(t,this),globalThis.__PIXI_APP__=this}async initialize(t){return h.provideAsync(this,async()=>{const{resizeTo:n,events:a,config:s,runtime:h={},...m}=t;this.config=r(this.config,s??{},(t,e)=>{if(Array.isArray(e))return e}),c.log("Applying config",this.config,s),this.runtime=i(Object.assign({},O,h));const p=this.instanceKey===o;this.containerElement=n;const d=p?{textureGCMaxIdle:e.any?180:3600,textureGCCheckCountMax:e.any?100:50,autoStart:!1,eventFeatures:{move:!0,globalMove:!1,click:!0,wheel:!0}}:{textureGCMaxIdle:60,textureGCCheckCountMax:10,autoStart:!1,eventFeatures:{move:!1,globalMove:!1,click:!1,wheel:!1}};await this.init({resizeTo:p?n:void 0,preferWebGLVersion:2,resolution:window.devicePixelRatio||1,antialias:C(),autoDensity:!0,backgroundColor:this.config.global.backgroundColor,...d,...m}),this.preloadAssets(),this.scaleMax=this.config.interaction.zoomRange.max,this.scaleMin=this.config.interaction.zoomRange.min,this.events=a,this.initializeViewportContainer(),this.initializeInteraction(),this.initializeAppContainer(),this.managers.mapManager=new M,this.managers.heatmapManager=new x,this.managers.pathManager=new S,this.managers.controlsManager=new P,this.managers.detectedObjectManager=new b,this.managers.customElementsManager=new v,this.managers.roomsManager=new R,document.addEventListener("visibilitychange",this.onVisibilityChange)})}async drawMap(t){return h.provideAsync(this,async()=>{c.log("[Map] drawMap",t);const{size:e,resolution:n,origin:a}=t;a[0]===this.mapState?.origin.x&&a[1]===this.mapState?.origin.y||(this.managers.pathManager.updatePositionByOrigin(...a),this.managers.controlsManager.updatePositionByOrigin(...a),this.managers.detectedObjectManager.updatePositionByOrigin(...a),this.managers.customElementsManager.updatePositionByOrigin(...a)),this.mapState={id:t.id,status:1===t.status,origin:{x:a[0],y:a[1]},charger:{x:t.charger.coordinate[0],y:t.charger.coordinate[1]},chargerDirection:t.charger.angle??0,resolution:n,width:e[0],height:e[1],mapType:"structured"},this.isFirstMapDraw&&(this.isFirstMapDraw=!1,this.events?.onMapFirstDrawed?.(this.mapState)),this.events?.onMapDrawed?.(this.mapState),await this.managers.mapManager.drawMap(t),this.renderOnce()})}async drawRasterMap(t){return h.provideAsync(this,async()=>{c.log("[Map] drawRasterMap",t);const{mapHeader:e,mapData:n}=t,{originX:a,originY:r}=e;a===this.mapState?.origin.x&&r===this.mapState?.origin.y||(this.managers.pathManager.updatePositionByOrigin(a,r),this.managers.controlsManager.updatePositionByOrigin(a,r),this.managers.detectedObjectManager.updatePositionByOrigin(a,r),this.managers.customElementsManager.updatePositionByOrigin(a,r)),this.mapState={id:e.id,status:e.mapStable,origin:{x:a,y:r},charger:{x:e.chargeX,y:e.chargeY},chargerDirection:e.chargeDirection??0,resolution:100*e.mapResolution,width:e.mapWidth,height:e.mapHeight,version:e.version,mapType:"raster"},this.isFirstMapDraw&&(this.isFirstMapDraw=!1,this.events?.onMapFirstDrawed?.(this.mapState)),this.events?.onMapDrawed?.(this.mapState),await this.managers.mapManager.drawRasterMap(n.parsed,this.mapState),this.renderOnce()})}drawPath(t){return h.provide(this,()=>{c.log("[Path] drawPath",t),this.events?.onPathDrawed?.({id:t.pathHeader.pathId,type:t.pathHeader.type,direction:t.pathHeader.direction,count:t.pathHeader.count,initFlag:t.pathHeader.initFlag,robotPosition:t.pathPoints[t.pathPoints.length-1]??null}),this.managers.pathManager.draw(t),this.renderOnce()})}async drawRoomProperty(t){return h.provide(this,()=>{c.log("[Room] drawRoomProperty",t),this.events?.onRoomPropertiesDrawed?.(t),this.managers.roomsManager.drawRoomProperty(t),this.renderOnceNextFrame()})}drawHeatmap({mapData:t,heatmapPoints:e,useGradient:n=!0}){return h.provide(this,()=>{c.log("[Heatmap] drawHeatmap",e),this.managers.heatmapManager.draw({mapData:t,heatmapPoints:e,useGradient:n}),this.renderOnce()})}drawForbiddenSweepZones(t){return h.provide(this,()=>{c.log("[Controls] drawForbiddenSweepZones",t),this.managers.controlsManager.drawForbiddenSweepZones(t),this.renderOnceNextFrame()})}drawForbiddenMopZones(t){return h.provide(this,()=>{c.log("[Controls] drawForbiddenMopZones",t),this.managers.controlsManager.drawForbiddenMopZones(t),this.renderOnceNextFrame()})}drawCleanZones(t){return h.provide(this,()=>{c.log("[Controls] drawCleanZones",t),this.managers.controlsManager.drawCleanZones(t),this.renderOnceNextFrame()})}drawVirtualWalls(t){return h.provide(this,()=>{c.log("[Controls] drawVirtualWalls",t),this.managers.controlsManager.drawVirtualWalls(t),this.renderOnceNextFrame()})}drawSpots(t){return h.provide(this,()=>{c.log("[Controls] drawSpots",t),this.managers.controlsManager.drawSpots(t),this.renderOnceNextFrame()})}async drawDetectedObjects(t){return h.provideAsync(this,async()=>{c.log("[DetectedObject] drawDetectedObjects",t),await this.managers.detectedObjectManager.drawDetectedObjects(t),this.renderOnceNextFrame()})}async drawCustomElements(t){return h.provideAsync(this,async()=>{c.log("[CustomElements] drawCustomElements",t),await this.managers.customElementsManager.drawCustomElements(t),this.renderOnceNextFrame()})}getForbiddenSweepZones(){return this.managers.controlsManager.getForbiddenSweepZones()}getForbiddenMopZones(){return this.managers.controlsManager.getForbiddenMopZones()}getCleanZones(){return this.managers.controlsManager.getCleanZones()}getVirtualWalls(){return this.managers.controlsManager.getVirtualWalls()}getSpots(){return this.managers.controlsManager.getSpots()}getEffectiveDividerPoints(){return this.managers.controlsManager.getEffectiveDividerPoints()}getDividerEndPoints(){return this.managers.controlsManager.getDividerEndPoints()}resetPanZoom(){this.components.interaction.setPanZoom()}fitMapToView(t,e=!1){return h.provide(this,()=>{if(!t||t.minX===t.maxX||t.minY===t.maxY)return void c.warn("地图边界无效，无法自动适配视图");const n=this.config.map.autoPaddingPercent||.1,a=this.getViewportBounds(),r=t.maxX-t.minX,i=t.maxY-t.minY,o=a.width,s=a.height,h=o*(1-2*n)/r,m=s*(1-2*n)/i,p=Math.min(h,m),d=Math.max(this.config.interaction.fitMinScale,this.scaleMin),l=Math.min(this.config.interaction.fitMaxScale,this.scaleMax),g=Math.max(d,Math.min(l,p)),u=o/2-(t.minX+r/2)*g,w=s/2-(t.minY+i/2)*g;this.components.interaction.setPanZoom({targetPosition:{x:u,y:w},targetScale:{x:g,y:g},setCenter:!0,setScale:!0},e)})}getViewportBounds(){return this.components.viewportContainer?.getViewportBounds()||{x:0,y:0,width:this.renderer.width,height:this.renderer.height}}updateRuntime(t){Object.assign(this.runtime,t),this.renderOnceNextFrame()}metersToPixels(t){return this.mapState?.resolution?t*(1/(this.mapState.resolution/100)):(c.warn("Map resolution not available, using default resolution (5cm/pixel)"),20*t)}pixelsToMeters(t){return this.mapState?.resolution?t*(this.mapState.resolution/100):(c.warn("Map resolution not available, using default resolution (5cm/pixel)"),.05*t)}toFixedSize(t,e){return t/(e??this.components.appContainer.scale.x)}fromFixedSize(t,e){return t*(e??this.components.appContainer.scale.x)}getViewportCenterPoint(){if(!this.mapState)return c.warn("Map state not available, cannot calculate center point"),null;const t=this.getViewportBounds(),e=t.x+t.width/2,n=t.y+t.height/2,a=this.components.appContainer,r=a.scale.x,i=(e-a.x)/r,o=(n-a.y)/r;return{x:i-this.mapState.origin.x,y:o-this.mapState.origin.y}}getMapCenterPoint(){if(!this.mapState)return c.warn("Map state not available, cannot calculate map center point"),null;const t=this.managers.mapManager.mapBounds;if(t.minX===1/0||t.minY===1/0||t.maxX===-1/0||t.maxY===-1/0)return c.warn("Invalid map bounds, cannot calculate map center point"),null;const e=(t.minX+t.maxX)/2,n=(t.minY+t.maxY)/2;return{x:e-this.mapState.origin.x,y:n-this.mapState.origin.y}}getWallPointsByViewportCenter(t){const{width:e=this.config.controls.virtualWall.minWidth,direction:n="horizontal",offsetX:a=0,offsetY:r=0}=t||{},i=this.getViewportCenterPoint()||{x:0,y:0},o=this.metersToPixels(e);return p(i.x,i.y,o,n).map(t=>({x:t.x+a,y:t.y+r}))}getForbiddenSweepZonePointsByViewportCenter(t){const e=this.config.controls.forbiddenSweepZone,{size:n=e.minSize,offsetX:a=0,offsetY:r=0}=t||{};return this.generateZonePoints(n,a,r)}getForbiddenMopZonePointsByViewportCenter(t){const e=this.config.controls.forbiddenMopZone,{size:n=e.minSize,offsetX:a=0,offsetY:r=0}=t||{};return this.generateZonePoints(n,a,r)}getCleanZonePointsByViewportCenter(t){const e=this.config.controls.cleanZone,{size:n=e.minSize,offsetX:a=0,offsetY:r=0}=t||{};return this.generateZonePoints(n,a,r)}getSpotPointByViewportCenter(t){const{offsetX:e=0,offsetY:n=0}=t||{},a=this.getViewportCenterPoint()||{x:0,y:0};return{x:a.x+e,y:a.y+n}}areRoomsAdjacent(t){const e=this.config.map.adjacencyThreshold;return h.provide(this,()=>{if(!t||0===t.length)return c.warn("[Room] No room IDs provided"),!1;if(1===t.length)return!0;const n=Array.from(new Set(t));return 1===n.length||("raster"===(this.mapState?.mapType??"structured")?this.areRasterRoomsAdjacentInternal(n,e):this.areStructuredRoomsAdjacentInternal(n,e))})}isPointInAnyRoom(t){return h.provide(this,()=>t&&"number"==typeof t.x&&"number"==typeof t.y?"raster"===(this.mapState?.mapType??"structured")?this.isPointInAnyRoomRasterInternal(t):this.isPointInAnyRoomStructuredInternal(t):(c.warn("[Room] Invalid point provided"),null))}isPointInAnyRoomStructuredInternal(t){if(!this.mapState)return c.warn("[Room] Map state not available"),null;const e={x:t.x+this.mapState.origin.x,y:t.y+this.mapState.origin.y},n=this.managers.mapManager.getAllRooms();for(const t of n)if(t.outlinePoints&&t.outlinePoints.length>=3&&d(e,t.outlinePoints))return this.managers.roomsManager.getRoomPropertyById(t.id)||(c.warn(`[Room] Room ${t.id} found in geometry but not in RoomManager`),null);return null}isPointInAnyRoomRasterInternal(t){if(!this.mapState)return c.warn("[Room] Map state not available"),null;const e=this.mapState.width,n=this.mapState.height,a=t.x+this.mapState.origin.x,r=t.y+this.mapState.origin.y,i=Math.round(a),o=Math.round(r);if(i<0||i>=e||o<0||o>=n)return c.warn(`[Room] Point (${i}, ${o}) is out of map bounds (${e}x${n})`),null;const s=o*e+i,h=this.managers.mapManager.getAllRooms();for(const t of h){const e=this.managers.mapManager.getRasterRoomPixels(t.id);if(e&&e.length>0&&l(e,s))return this.managers.roomsManager.getRoomPropertyById(t.id)||(c.warn(`[Room] Room ${t.id} found in geometry but not in RoomManager`),null)}return null}areStructuredRoomsAdjacentInternal(t,e){const n=[];for(const e of t){const t=this.managers.mapManager.getRoomById(e);if(!t)return c.warn(`[Room] Room ${e} not found in map`),!1;if(!t.outlinePoints||0===t.outlinePoints.length)return c.warn(`[Room] Room ${e} has no outline points`),!1;n.push({id:e,points:t.outlinePoints})}const a=[];for(let t=0;t<n.length;t++)for(let r=t+1;r<n.length;r++){const i=n[t],o=n[r];g(i.points,o.points,e)&&a.push([t,r])}return u(n.length,a)}areRasterRoomsAdjacentInternal(t,e){if(!this.mapState)return c.warn("[Room] Map state not available"),!1;const n=this.mapState.width,a=[];for(const e of t){const t=this.managers.mapManager.getRasterRoomPixels(e);if(!t)return c.warn(`[Room] Room ${e} pixel data not found in raster map`),!1;a.push({id:e,pixels:t})}const r=[];for(let t=0;t<a.length;t++)for(let i=t+1;i<a.length;i++){const o=a[t],s=a[i];w(o.pixels,s.pixels,n,e)&&r.push([t,i])}return u(a.length,r)}async snapshot(){this.render(),await new Promise(t=>setTimeout(t,0));const{snapshot:t}=this.config;return await this.renderer.extract.base64({target:this.components.appContainer,format:t.format,quality:t.quality,resolution:t.resolution,antialias:t.antialias})}async snapshotByData({map:t,path:e,roomProperties:n,customElements:a,forbiddenSweepZones:r,forbiddenMopZones:i,virtualWalls:o,detectedObjects:s},h={}){const p=`SNAPSHOT_${m()}`;c.log(`[MapApplication] ${p} snapshot start`);const d=new j(p);try{if(await d.initialize({config:this.config,runtime:h}),!t)throw new Error("Map data is required");if(t.startsWith("7b22")){const{decodeMapStructured:e}=await import("@ray-js/robot-protocol"),n=e(t);await d.drawMap(n)}else{const{decodeMap:e}=await import("@ray-js/robot-protocol"),n=e(t);if(!n)throw new Error("Failed to decode raster map data");await d.drawRasterMap(n)}if(e){const{decodePath:t}=await import("@ray-js/robot-protocol"),n=t(e);d.drawPath(n)}n&&n.length>0&&d.drawRoomProperty(n),r&&r.length>0&&d.drawForbiddenSweepZones(r),i&&i.length>0&&d.drawForbiddenMopZones(i),o&&o.length>0&&d.drawVirtualWalls(o),s&&s.length>0&&await d.drawDetectedObjects(s),a&&a.length>0&&await d.drawCustomElements(a);const m=await d.snapshot();return c.log(`[MapApplication] ${p} snapshot completed successfully`),m}catch(t){throw c.error(`[MapApplication] ${p} snapshot other map failed:`,t),t}finally{c.log(`[MapApplication] ${p} destroy`),d.destroy()}}renderOnce(){c.log("[Pixi] renderOnce"),this.render()}renderOnceNextFrame(){this.pendingAsyncRender||(this.pendingAsyncRender=!0,requestAnimationFrame(()=>{c.log("[Pixi] renderOnceNextFrame"),this.render(),this.pendingAsyncRender=!1}))}requestRender(t,e=!1){e?(this.tickerState.renderReasons.add(t),this.ticker.started||(c.debug(`🎬 [Ticker] START: ${t}`),this.ticker.start())):this.renderOnceNextFrame()}stopRender(t){this.tickerState.renderReasons.delete(t),0===this.tickerState.renderReasons.size&&this.scheduleStopRender("final",100)}destroy(){h.unregisterInstance(this.instanceKey),this.tickerState.renderTimer&&clearTimeout(this.tickerState.renderTimer),this.tickerState.renderReasons.clear(),this.emitter.all.clear(),document.removeEventListener("visibilitychange",this.onVisibilityChange),this.managers.pathManager.destroy(),this.managers.mapManager.destroy(),this.managers.controlsManager.destroy(),this.managers.detectedObjectManager.destroy(),this.managers.customElementsManager.destroy(),this.managers.roomsManager.destroy(),this.components.interaction.destroy(),this.components.viewportContainer.destroy(),this.components.appContainer.destroy(),super.destroy()}initializeViewportContainer(){this.components.viewportContainer=new f(this.config,this.containerElement),this.stage.addChild(this.components.viewportContainer)}initializeAppContainer(){this.components.appContainer=new y,this.components.interaction.addChild(this.components.appContainer)}initializeInteraction(){this.components.interaction=new a,this.components.viewportContainer.addChild(this.components.interaction)}scheduleStopRender(t,e){this.tickerState.renderTimer&&clearTimeout(this.tickerState.renderTimer),this.tickerState.renderTimer=setTimeout(()=>{this.tickerState.renderReasons.delete(t),0===this.tickerState.renderReasons.size&&(c.debug("⏸️ [Ticker] STOP"),this.ticker.stop())},e)}generateZonePoints(t,e,n){const a=this.getViewportCenterPoint()||{x:0,y:0},r=this.metersToPixels(t)/2,i=a.x+e,o=a.y+n;return[{x:i-r,y:o-r},{x:i+r,y:o-r},{x:i+r,y:o+r},{x:i-r,y:o+r}]}preloadAssets(){const t=this.config.robot.icon.src,e=this.config.chargingStation.icon.src,a=[];n.add({alias:"robot",src:t}),a.push("robot"),n.add({alias:"chargingStation",src:e}),a.push("chargingStation"),n.add({alias:"deleteIcon",src:this.config.controls.deleteIconSrc}),a.push("deleteIcon"),n.add({alias:"rotateIcon",src:this.config.controls.rotateIconSrc}),a.push("rotateIcon"),n.add({alias:"scaleIcon",src:this.config.controls.scaleIconSrc}),a.push("scaleIcon"),n.add({alias:"moveIcon",src:this.config.controls.moveIconSrc}),a.push("moveIcon"),n.add({alias:"checkmark",src:this.config.room.selectionIndicator.iconSrc}),a.push("checkmark"),n.add({alias:"spotIcon",src:this.config.controls.spot.iconSrc}),a.push("spotIcon"),this.config.room.property.cleanMode.assets.forEach((t,e)=>{const r=`cleanMode_${e}`;n.add({alias:r,src:t}),a.push(r)}),this.config.room.property.suction.assets.forEach((t,e)=>{const r=`fan_${e}`;n.add({alias:r,src:t}),a.push(r)}),this.config.room.property.cistern.assets.forEach((t,e)=>{const r=`water_${e}`;n.add({alias:r,src:t}),a.push(r)}),this.config.room.property.cleanTimes.assets.forEach((t,e)=>{const r=`cleanTimes${e+1}`;n.add({alias:r,src:t}),a.push(r)}),this.config.room.floorType.assets.forEach((t,e)=>{if(!t)return;const r=`floorType${e}`;n.add({alias:r,src:t}),a.push(r)}),this.config.room.property.customAssets&&Object.entries(this.config.room.property.customAssets).forEach(([t,e])=>{e.forEach((e,r)=>{const i=`custom_${t}_${r}`;n.add({alias:i,src:e}),a.push(i)})}),n.backgroundLoad(a)}onVisibilityChange=()=>{"visible"===document.visibilityState||this.components.interaction?.clearTouches()}}export{j as MapApplication};

package/dist/components/Base/FixedSizeDOMContainer.js

@@ -1 +1 @@
-import{DOMContainer as e}from"pixi.js";import{throttle as t}from"lodash-es";import{useAppService as i}from"../../application/AppService.js";class s extends e{throttledUpdateScale;fixedWidth=0;fixedHeight=0;isFixedSizeSet=!1;userCenterX=0;userCenterY=0;constructor(e){super(e),this.anchor.set(0,0),this.throttledUpdateScale=t(this.updateScale.bind(this),30,{leading:!0,trailing:!0}),this.registerScaleListener()}setFixedSize(e,t){this.fixedWidth=e,this.fixedHeight=t,this.isFixedSizeSet=!0,this.applyFixedSize(),this.updatePositionFromCenter()}setCenterPosition(e,t){this.userCenterX=e,this.userCenterY=t,this.updatePositionFromCenter()}updatePositionFromCenter(){if(!this.isFixedSizeSet)return void this.position.set(this.userCenterX,this.userCenterY);const e=i().currentScale,t=this.fixedWidth/2/e,s=this.fixedHeight/2/e;this.position.set(this.userCenterX-t,this.userCenterY-s)}registerScaleListener(){i().emitter.on("antiScale",this.throttledUpdateScale)}applyFixedSize(){if(!this.isFixedSizeSet)return;const e=i().currentScale;if(0===e)return;const t=1/e;this.scale.set(t),this.element&&(this.element.style.width=`${this.fixedWidth}px`,this.element.style.height=`${this.fixedHeight}px`)}updateScale(e){this.isFixedSizeSet&&0!==e&&(this.applyFixedSize(),this.updatePositionFromCenter())}updateTransform(e){return super.updateTransform(e)}destroy(e){i().emitter.off("antiScale",this.throttledUpdateScale),super.destroy(e)}}export{s as FixedSizeDOMContainer};
+import{DOMContainer as e}from"pixi.js";import{throttle as t}from"lodash-es";import{useAppService as i}from"../../application/AppService.js";class s extends e{throttledUpdateScale;fixedWidth=0;fixedHeight=0;isFixedSizeSet=!1;userCenterX=0;userCenterY=0;sizeFixed=!0;constructor(e){super(e),this.anchor.set(0,0),this.throttledUpdateScale=t(this.updateScale.bind(this),30,{leading:!0,trailing:!0}),this.registerScaleListener()}setFixedSize(e,t){this.fixedWidth=e,this.fixedHeight=t,this.isFixedSizeSet=!0,this.applyFixedSize(),this.updatePositionFromCenter()}setCenterPosition(e,t){this.userCenterX=e,this.userCenterY=t,this.updatePositionFromCenter()}setSizeFixed(e){this.sizeFixed=e,this.isFixedSizeSet&&(this.applyFixedSize(),this.updatePositionFromCenter())}updatePositionFromCenter(){if(!this.isFixedSizeSet)return void this.position.set(this.userCenterX,this.userCenterY);const e=i().currentScale;let t,s;this.sizeFixed?(t=this.fixedWidth/2/e,s=this.fixedHeight/2/e):(t=this.fixedWidth/2,s=this.fixedHeight/2),this.position.set(this.userCenterX-t,this.userCenterY-s)}registerScaleListener(){i().emitter.on("antiScale",this.throttledUpdateScale)}applyFixedSize(){if(!this.isFixedSizeSet)return;const e=i().currentScale;if(0!==e){if(this.sizeFixed){const t=1/e;this.scale.set(t)}else this.scale.set(1);this.element&&(this.element.style.width=`${this.fixedWidth}px`,this.element.style.height=`${this.fixedHeight}px`)}}updateScale(e){this.isFixedSizeSet&&0!==e&&(this.applyFixedSize(),this.updatePositionFromCenter())}updateTransform(e){return super.updateTransform(e)}destroy(e){i().emitter.off("antiScale",this.throttledUpdateScale),super.destroy(e)}}export{s as FixedSizeDOMContainer};

package/dist/components/CustomElements/CustomHTML.js

@@ -1 +1 @@
-import{FixedSizeDOMContainer as e}from"../Base/FixedSizeDOMContainer.js";import{useAppService as t}from"../../application/AppService.js";class i extends e{elementData;domClickHandler=null;resizeObserver=null;debugMarker=null;constructor(e){const t=document.createElement("div");i.setupDefaultStyles(t,e),t.innerHTML=e.htmlContent,super({element:t}),this.elementData=e}async initialize(){this.alpha=0,this.elementData.width&&this.elementData.height?(this.setFixedSize(this.elementData.width,this.elementData.height),this.setCenterPosition(this.elementData.x,this.elementData.y),this.waitForElementInsertion()):(this.position.set(this.elementData.x,this.elementData.y),this.setupAutoSize()),void 0!==this.elementData.rotation&&(this.rotation=this.elementData.rotation),this.elementData.interactive?this.setupClickHandler():this.eventMode="none"}setupAutoSize(){this.element&&(this.element.style.width="auto",this.element.style.height="auto",this.waitForElementDimensions())}waitForElementInsertion(){if(!this.element)return;const e=()=>{this.element&&(this.element.isConnected?this.showElement():requestAnimationFrame(e))};requestAnimationFrame(e)}waitForElementDimensions(){this.element&&("undefined"!=typeof ResizeObserver?(this.resizeObserver=new ResizeObserver(e=>{const t=e[0];t&&t.contentRect.width>0&&t.contentRect.height>0&&(this.setFixedSize(t.contentRect.width,t.contentRect.height),this.setCenterPosition(this.elementData.x,this.elementData.y),0===this.alpha&&this.showElement(),this.resizeObserver?.disconnect(),this.resizeObserver=null)}),this.resizeObserver.observe(this.element)):this.pollForElementDimensions())}pollForElementDimensions(){if(!this.element)return;const e=()=>{if(!this.element)return;if(!this.element.isConnected)return void requestAnimationFrame(e);const t=this.element.getBoundingClientRect();t.width>0&&t.height>0?(this.setFixedSize(t.width,t.height),this.setCenterPosition(this.elementData.x,this.elementData.y),0===this.alpha&&this.showElement()):requestAnimationFrame(e)};requestAnimationFrame(e)}showElement(){this.alpha=this.elementData.opacity??1,this.element.style.pointerEvents=this.elementData.interactive?"auto":"none",this.interactive=this.elementData.interactive??!1,this.elementData.interactive&&this.element&&(this.element.style.setProperty("-webkit-tap-highlight-color","transparent"),this.element.style.setProperty("-webkit-touch-callout","none")),t().getApp().renderOnceNextFrame()}setupClickHandler(){this.element&&(this.domClickHandler=e=>{e.preventDefault(),e.stopPropagation(),this.handleClick()},this.element.addEventListener("click",this.domClickHandler))}handleClick(){const e=t();e.events?.onClickCustomElement?.(this.getElementData())}getElementData(){return{...this.elementData}}async updateElementData(e){const t=this.elementData;this.elementData=e,t.htmlContent!==e.htmlContent&&this.element&&(this.element.innerHTML=e.htmlContent,e.width&&e.height||this.waitForElementDimensions()),t.width===e.width&&t.height===e.height||(e.width&&e.height?(this.setFixedSize(e.width,e.height),this.element&&(this.element.style.width=`${e.width}px`,this.element.style.height=`${e.height}px`)):this.setupAutoSize()),e.width&&e.height?this.setCenterPosition(e.x,e.y):this.position.set(e.x,e.y),this.rotation=e.rotation??0,this.alpha=e.opacity??1,e.interactive?this.domClickHandler||this.setupClickHandler():(this.eventMode="none",this.domClickHandler&&this.element&&(this.element.removeEventListener("click",this.domClickHandler),this.domClickHandler=null))}isSameData(e){return this.elementData.id===e.id&&this.elementData.type===e.type&&this.elementData.htmlContent===e.htmlContent&&this.elementData.x===e.x&&this.elementData.y===e.y&&this.elementData.width===e.width&&this.elementData.height===e.height&&this.elementData.rotation===e.rotation&&this.elementData.opacity===e.opacity&&this.elementData.interactive===e.interactive}static setupDefaultStyles(e,t){const i={position:"relative",boxSizing:"border-box",webkitFontSmoothing:"antialiased",textRendering:"optimizeLegibility",background:"transparent",userSelect:"auto",webkitUserSelect:"auto"};t.width&&t.height?(i.width=`${t.width}px`,i.height=`${t.height}px`,i.overflow="hidden"):(i.width=t.width?`${t.width}px`:"auto",i.height=t.height?`${t.height}px`:"auto",i.overflow="visible"),Object.assign(e.style,i),e.style.setProperty("-webkit-tap-highlight-color","transparent"),e.style.setProperty("-webkit-touch-callout","none")}destroy(){this.resizeObserver&&(this.resizeObserver.disconnect(),this.resizeObserver=null),this.domClickHandler&&this.element&&(this.element.removeEventListener("click",this.domClickHandler),this.domClickHandler=null),this.debugMarker&&(this.debugMarker.destroy(),this.debugMarker=null),super.destroy()}}export{i as CustomHTML};
+import{FixedSizeDOMContainer as e}from"../Base/FixedSizeDOMContainer.js";import{useAppService as t}from"../../application/AppService.js";class i extends e{elementData;domClickHandler=null;resizeObserver=null;debugMarker=null;constructor(e){const t=document.createElement("div");i.setupDefaultStyles(t,e),t.innerHTML=e.htmlContent,super({element:t}),this.elementData=e}async initialize(){this.alpha=0,this.elementData.width&&this.elementData.height?(this.setFixedSize(this.elementData.width,this.elementData.height),this.setCenterPosition(this.elementData.x,this.elementData.y),this.setSizeFixed(this.elementData.sizeFixed??!0),this.waitForElementInsertion()):(this.position.set(this.elementData.x,this.elementData.y),this.setupAutoSize()),void 0!==this.elementData.rotation&&(this.rotation=this.elementData.rotation),this.elementData.interactive?this.setupClickHandler():this.eventMode="none"}setupAutoSize(){this.element&&(this.element.style.width="auto",this.element.style.height="auto",this.waitForElementDimensions())}waitForElementInsertion(){if(!this.element)return;const e=()=>{this.element&&(this.element.isConnected?this.showElement():requestAnimationFrame(e))};requestAnimationFrame(e)}waitForElementDimensions(){this.element&&("undefined"!=typeof ResizeObserver?(this.resizeObserver=new ResizeObserver(e=>{const t=e[0];t&&t.contentRect.width>0&&t.contentRect.height>0&&(this.setFixedSize(t.contentRect.width,t.contentRect.height),this.setCenterPosition(this.elementData.x,this.elementData.y),this.setSizeFixed(this.elementData.sizeFixed??!0),0===this.alpha&&this.showElement(),this.resizeObserver?.disconnect(),this.resizeObserver=null)}),this.resizeObserver.observe(this.element)):this.pollForElementDimensions())}pollForElementDimensions(){if(!this.element)return;const e=()=>{if(!this.element)return;if(!this.element.isConnected)return void requestAnimationFrame(e);const t=this.element.getBoundingClientRect();t.width>0&&t.height>0?(this.setFixedSize(t.width,t.height),this.setCenterPosition(this.elementData.x,this.elementData.y),this.setSizeFixed(this.elementData.sizeFixed??!0),0===this.alpha&&this.showElement()):requestAnimationFrame(e)};requestAnimationFrame(e)}showElement(){this.alpha=this.elementData.opacity??1,this.element.style.pointerEvents=this.elementData.interactive?"auto":"none",this.interactive=this.elementData.interactive??!1,this.elementData.interactive&&this.element&&(this.element.style.setProperty("-webkit-tap-highlight-color","transparent"),this.element.style.setProperty("-webkit-touch-callout","none")),t().getApp().renderOnceNextFrame()}setupClickHandler(){this.element&&(this.domClickHandler=e=>{e.preventDefault(),e.stopPropagation(),this.handleClick()},this.element.addEventListener("click",this.domClickHandler))}handleClick(){const e=t();e.events?.onClickCustomElement?.(this.getElementData())}getElementData(){return{...this.elementData}}async updateElementData(e){const t=this.elementData;this.elementData=e,t.htmlContent!==e.htmlContent&&this.element&&(this.element.innerHTML=e.htmlContent,e.width&&e.height||this.waitForElementDimensions()),t.width===e.width&&t.height===e.height||(e.width&&e.height?(this.setFixedSize(e.width,e.height),this.element&&(this.element.style.width=`${e.width}px`,this.element.style.height=`${e.height}px`)):this.setupAutoSize()),e.width&&e.height?this.setCenterPosition(e.x,e.y):this.position.set(e.x,e.y),t.sizeFixed!==e.sizeFixed&&void 0!==e.sizeFixed&&this.setSizeFixed(e.sizeFixed),this.rotation=e.rotation??0,this.alpha=e.opacity??1,e.interactive?this.domClickHandler||this.setupClickHandler():(this.eventMode="none",this.domClickHandler&&this.element&&(this.element.removeEventListener("click",this.domClickHandler),this.domClickHandler=null))}isSameData(e){return this.elementData.id===e.id&&this.elementData.type===e.type&&this.elementData.htmlContent===e.htmlContent&&this.elementData.x===e.x&&this.elementData.y===e.y&&this.elementData.width===e.width&&this.elementData.height===e.height&&this.elementData.rotation===e.rotation&&this.elementData.opacity===e.opacity&&this.elementData.interactive===e.interactive&&this.elementData.sizeFixed===e.sizeFixed}static setupDefaultStyles(e,t){const i={position:"relative",boxSizing:"border-box",webkitFontSmoothing:"antialiased",textRendering:"optimizeLegibility",background:"transparent",userSelect:"auto",webkitUserSelect:"auto"};t.width&&t.height?(i.width=`${t.width}px`,i.height=`${t.height}px`,i.overflow="hidden"):(i.width=t.width?`${t.width}px`:"auto",i.height=t.height?`${t.height}px`:"auto",i.overflow="visible"),Object.assign(e.style,i),e.style.setProperty("-webkit-tap-highlight-color","transparent"),e.style.setProperty("-webkit-touch-callout","none")}destroy(){this.resizeObserver&&(this.resizeObserver.disconnect(),this.resizeObserver=null),this.domClickHandler&&this.element&&(this.element.removeEventListener("click",this.domClickHandler),this.domClickHandler=null),this.debugMarker&&(this.debugMarker.destroy(),this.debugMarker=null),super.destroy()}}export{i as CustomHTML};

package/dist/components/RoomInfo/RoomProperty.js

@@ -1 +1 @@
-import{Container as e,Graphics as t,Text as o,TextStyle as i}from"pixi.js";import{EnhancedSprite as n}from"../Base/EnhancedSprite.js";import{useAppService as s}from"../../application/AppService.js";class r extends e{background;cleanModeIcon;suctionIcon;cisternIcon;cleanTimesIcon;orderContainer;orderBackground;orderText;bubble=null;isFolded=!1;roomId;roomIndex;constructor(r){super();const c=s(),l=c.roomConfig;this.roomId=r.id,this.roomIndex=r.index,this.background=new t;const{property:h,colors:{propertyTheme:d}}=l;l.property.foldable&&(this.bubble=new t);const a=d[(r.colorIndex??r.index)%d.length];this.cleanModeIcon=new n,this.cleanModeIcon.tint=a,this.cleanModeIcon.anchor.set(0,0),this.suctionIcon=new n,this.suctionIcon.tint=a,this.suctionIcon.anchor.set(0,0),this.cisternIcon=new n,this.cisternIcon.tint=a,this.cisternIcon.anchor.set(0,0),this.cleanTimesIcon=new n,this.cleanTimesIcon.tint=a,this.cleanTimesIcon.anchor.set(0,0),this.orderContainer=new e,this.orderBackground=new t,this.orderText=new o({text:"",style:new i({fontSize:h.cleanOrder.fontSize,fontFamily:h.cleanOrder.fontFamily,fontWeight:h.cleanOrder.fontWeight,fill:h.cleanOrder.color,align:"center",trim:!0})}),this.orderText.anchor.set(.5,.5),this.orderContainer.addChild(this.orderBackground),this.orderContainer.addChild(this.orderText),this.addChild(this.background),this.bubble&&this.addChild(this.bubble),this.addChild(this.cleanModeIcon),this.addChild(this.suctionIcon),this.addChild(this.cisternIcon),this.addChild(this.cleanTimesIcon),this.addChild(this.orderContainer),this.visible=c.runtimeSnapshot.showRoomProperty,this.updateProperty(r)}async updateProperty(e){await this.updateIcons(e),this.updateBackground()}getDisplayElements(e){const t=s(),{displayOrders:o}=t.roomConfig.property,{showRoomOrder:i,showRoomProperty:n}=t.runtimeSnapshot,r=e.order||0,c=i&&r>0,l=n&&o.includes("cleanMode"),h=n&&o.includes("suction"),d=n&&o.includes("cistern"),a=n&&o.includes("cleanTimes")&&e.cleanTimes>0,u={cleanMode:{element:this.cleanModeIcon,show:l,isOrder:!1},suction:{element:this.suctionIcon,show:h,isOrder:!1},cistern:{element:this.cisternIcon,show:d,isOrder:!1},cleanTimes:{element:this.cleanTimesIcon,show:a,isOrder:!1}},b=[];return c&&b.push({element:this.orderContainer,show:!0,isOrder:!0}),o.forEach(e=>{const t=u[e];t&&t.show&&b.push(t)}),{shouldShowOrder:c,shouldShowCleanMode:l,shouldShowSuction:h,shouldShowCistern:d,shouldShowCleanTimes:a,elementsToShow:b,orderValue:r}}async updateIcons(e){const t=s(),{iconWidth:o,iconHeight:i,container:n,cleanOrder:r,foldable:c,iconGap:l}=t.roomConfig.property,{propertyTheme:h}=t.roomConfig.colors,{paddingHorizontal:d,paddingVertical:a}=n,{shouldShowOrder:u,shouldShowCleanMode:b,shouldShowSuction:p,shouldShowCistern:g,shouldShowCleanTimes:m,elementsToShow:I,orderValue:f}=this.getDisplayElements(e);this.orderContainer.visible=u,this.cleanModeIcon.visible=b,this.suctionIcon.visible=p,this.cisternIcon.visible=g,this.cleanTimesIcon.visible=m,c&&this.isFolded&&(this.orderContainer.visible=!1,this.cleanModeIcon.visible=!1,this.suctionIcon.visible=!1,this.cisternIcon.visible=!1,this.cleanTimesIcon.visible=!1);const C=[];if(b&&C.push(this.cleanModeIcon.loadTextureAndSetSize(`cleanMode_${e.cleanMode}`,{width:o,height:i,sizeFixed:!1})),p&&C.push(this.suctionIcon.loadTextureAndSetSize(`fan_${e.suction}`,{width:o,height:i,sizeFixed:!1})),g&&C.push(this.cisternIcon.loadTextureAndSetSize(`water_${e.cistern}`,{width:o,height:i,sizeFixed:!1})),m){const t=e.cleanTimes||1;C.push(this.cleanTimesIcon.loadTextureAndSetSize(`cleanTimes${t}`,{width:o,height:i,sizeFixed:!1}))}if(await Promise.all(C),u){this.orderText.text=f.toString();const e=t.getRoomData(this.roomId),n=e?.colorIndex??this.roomIndex;this.orderBackground.clear(),this.orderBackground.setFillStyle({color:h[n%h.length]}),this.orderBackground.circle(o/2,i/2,o/2).fill(),this.orderText.position.set(o/2,i/2)}let y=d;I.forEach((e,t)=>{const{element:i,isOrder:n}=e;i.position.set(y,a),y+=o,t<I.length-1&&(y+=n?r.gapRight:l)})}updateBackground(){const e=s().roomConfig,{container:t,foldable:o}=e.property,{borderRadius:i,tailHeight:n,tailWidth:r,backgroundColor:c}=t,l=this.calculateContentWidth(),h=this.calculateContentHeight(),d=Math.min(r,l/2);if(this.background.clear(),this.bubble&&this.bubble.clear(),this.background.setFillStyle({color:c}),this.background.roundRect(0,0,l,h,i).fill(),o&&this.bubble){const e=(l-d)/2;this.bubble.setFillStyle({color:c}),this.bubble.poly([e,h-1,e+d,h-1,e+d/2,h+n]).fill()}}calculateContentWidth(){const e=s(),{iconWidth:t,container:o,cleanOrder:i,iconGap:n}=e.roomConfig.property,{paddingHorizontal:r}=o,c=e.getRoomData(this.roomId);if(!c)return 2*r;const{elementsToShow:l}=this.getDisplayElements(c);let h=r;return l.forEach((e,o)=>{const{isOrder:s}=e;h+=t,o<l.length-1&&(h+=s?i.gapRight:n)}),h+=r,h}calculateContentHeight(){const e=s().roomConfig,{iconHeight:t,container:o}=e.property;return o.paddingVertical+t+o.paddingVertical}getTotalHeight(){const e=s(),{foldable:t,container:o}=e.roomConfig.property,{tailHeight:i}=o;return this.calculateContentHeight()+(t?i:0)}getTotalWidth(){return this.calculateContentWidth()}setFolded(e){const t=s(),{foldable:o}=t.roomConfig.property;if(o)if(this.isFolded=e,e)this.background.visible=!1,this.cleanModeIcon.visible=!1,this.suctionIcon.visible=!1,this.cisternIcon.visible=!1,this.cleanTimesIcon.visible=!1,this.orderContainer.visible=!1,this.bubble&&(this.bubble.visible=!0,this.bubble.rotation=Math.PI,this.repositionFoldedBubble());else{this.background.visible=!0,this.bubble&&(this.bubble.visible=!0,this.bubble.rotation=0,this.bubble.position.set(0,0)),this.updateBackground();const e=t.getRoomData(this.roomId);e&&this.updateIcons(e)}}isFoldedState(){const e=s(),{foldable:t}=e.roomConfig.property;return!!t&&this.isFolded}repositionFoldedBubble(){const e=s(),{foldable:t}=e.roomConfig.property;if(!t||!this.bubble)return;const o=e.roomConfig,{tailHeight:i}=o.property.container,n=this.calculateContentWidth(),r=this.calculateContentHeight(),c=n/2;this.bubble.position.set(c,r+i/2)}refreshColor(){const e=s(),{propertyTheme:t}=e.roomConfig.colors,o=e.getRoomData(this.roomId),i=o?.colorIndex??this.roomIndex,n=t[i%t.length];if(this.cleanModeIcon&&(this.cleanModeIcon.tint=n),this.suctionIcon&&(this.suctionIcon.tint=n),this.cisternIcon&&(this.cisternIcon.tint=n),this.cleanTimesIcon&&(this.cleanTimesIcon.tint=n),this.orderBackground&&this.orderBackground.visible){const{property:o}=e.roomConfig,n=o.iconWidth,s=o.iconHeight;this.orderBackground.clear(),this.orderBackground.setFillStyle({color:t[i%t.length]}),this.orderBackground.circle(n/2,s/2,n/2).fill()}}destroy(){this.cleanModeIcon?.destroy(),this.suctionIcon?.destroy(),this.cisternIcon?.destroy(),this.cleanTimesIcon?.destroy(),super.destroy()}}export{r as RoomProperty};
+import{Container as e,Graphics as t,Text as o,TextStyle as r}from"pixi.js";import{EnhancedSprite as i}from"../Base/EnhancedSprite.js";import{useAppService as n}from"../../application/AppService.js";class s extends e{background;propertyIcons=new Map;orderContainer;orderBackground;orderText;bubble=null;isFolded=!1;roomId;roomIndex;constructor(i){super();const s=n(),l=s.roomConfig;this.roomId=i.id,this.roomIndex=i.index,this.background=new t;const{property:a,colors:{propertyTheme:d}}=l;l.property.foldable&&(this.bubble=new t);const c=d[(i.colorIndex??i.index)%d.length];this.initializePropertyIcons(a.displayOrders,c),this.orderContainer=new e,this.orderBackground=new t,this.orderText=new o({text:"",style:new r({fontSize:a.cleanOrder.fontSize,fontFamily:a.cleanOrder.fontFamily,fontWeight:a.cleanOrder.fontWeight,fill:a.cleanOrder.color,align:"center",trim:!0})}),this.orderText.anchor.set(.5,.5),this.orderContainer.addChild(this.orderBackground),this.orderContainer.addChild(this.orderText),this.addChild(this.background),this.bubble&&this.addChild(this.bubble),this.propertyIcons.forEach(({sprite:e})=>{this.addChild(e)}),this.addChild(this.orderContainer),this.visible=s.runtimeSnapshot.showRoomProperty,this.updateProperty(i)}initializePropertyIcons(e,t){const o=["cleanMode","suction","cistern","cleanTimes"];e.forEach(e=>{const r=o.includes(e),n=new i;n.tint=t,n.anchor.set(0,0),this.propertyIcons.set(e,{fieldName:e,sprite:n,isBuiltin:r})})}async updateProperty(e){await this.updateIcons(e),this.updateBackground()}getFieldValue(e,t){if(["cleanMode","suction","cistern","cleanTimes"].includes(t))return e[t]??null;if(e.customData&&t in e.customData){const o=e.customData[t];return"number"==typeof o?o:null}return null}getAssetAlias(e,t){const o={cleanMode:e=>`cleanMode_${e}`,suction:e=>`fan_${e}`,cistern:e=>`water_${e}`,cleanTimes:e=>`cleanTimes${e}`};return e in o?o[e](t):`custom_${e}_${t}`}shouldShowField(e,t,o){const r=n(),{showRoomProperty:i}=r.runtimeSnapshot;return!(null===o||!i||"cleanTimes"===t&&o<=0)}getDisplayElements(e){const t=n(),{displayOrders:o}=t.roomConfig.property,{showRoomOrder:r}=t.runtimeSnapshot,i=e.order||0,s=[];return r&&i>0&&s.push({element:this.orderContainer,show:!0,isOrder:!0,fieldName:"order"}),o.forEach(t=>{const o=this.propertyIcons.get(t);if(!o)return;const r=this.getFieldValue(e,t);this.shouldShowField(e,t,r)&&null!==r&&s.push({element:o.sprite,show:!0,isOrder:!1,fieldName:t,value:r})}),{elementsToShow:s,orderValue:i}}async updateIcons(e){const t=n(),{iconWidth:o,iconHeight:r,container:i,cleanOrder:s,foldable:l,iconGap:a}=t.roomConfig.property,{propertyTheme:d}=t.roomConfig.colors,{paddingHorizontal:c,paddingVertical:h}=i,{elementsToShow:p,orderValue:u}=this.getDisplayElements(e);if(this.orderContainer.visible=!1,this.propertyIcons.forEach(({sprite:e})=>{e.visible=!1}),l&&this.isFolded)return;const b=[];p.forEach(t=>{if(t.isOrder){this.orderContainer.visible=!0,this.orderText.text=u.toString();const t=e.colorIndex??this.roomIndex;this.orderBackground.clear(),this.orderBackground.setFillStyle({color:d[t%d.length]}),this.orderBackground.circle(o/2,r/2,o/2).fill(),this.orderText.position.set(o/2,r/2)}else{const e=this.propertyIcons.get(t.fieldName);if(e){e.sprite.visible=!0;const i=this.getAssetAlias(t.fieldName,t.value);b.push(e.sprite.loadTextureAndSetSize(i,{width:o,height:r,sizeFixed:!1}))}}}),await Promise.all(b);let g=c;p.forEach((e,t)=>{const{element:r,isOrder:i}=e;r.position.set(g,h),g+=o,t<p.length-1&&(g+=i?s.gapRight:a)})}updateBackground(){const e=n().roomConfig,{container:t,foldable:o}=e.property,{borderRadius:r,tailHeight:i,tailWidth:s,backgroundColor:l}=t,a=this.calculateContentWidth(),d=this.calculateContentHeight(),c=Math.min(s,a/2);if(this.background.clear(),this.bubble&&this.bubble.clear(),this.background.setFillStyle({color:l}),this.background.roundRect(0,0,a,d,r).fill(),o&&this.bubble){const e=(a-c)/2;this.bubble.setFillStyle({color:l}),this.bubble.poly([e,d-1,e+c,d-1,e+c/2,d+i]).fill()}}calculateContentWidth(){const e=n(),{iconWidth:t,container:o,cleanOrder:r,iconGap:i}=e.roomConfig.property,{paddingHorizontal:s}=o,l=e.getRoomData(this.roomId);if(!l)return 2*s;const{elementsToShow:a}=this.getDisplayElements(l);let d=s;return a.forEach((e,o)=>{const{isOrder:n}=e;d+=t,o<a.length-1&&(d+=n?r.gapRight:i)}),d+=s,d}calculateContentHeight(){const e=n().roomConfig,{iconHeight:t,container:o}=e.property;return o.paddingVertical+t+o.paddingVertical}getTotalHeight(){const e=n(),{foldable:t,container:o}=e.roomConfig.property,{tailHeight:r}=o;return this.calculateContentHeight()+(t?r:0)}getTotalWidth(){return this.calculateContentWidth()}setFolded(e){const t=n(),{foldable:o}=t.roomConfig.property;if(o)if(this.isFolded=e,e)this.background.visible=!1,this.orderContainer.visible=!1,this.propertyIcons.forEach(({sprite:e})=>{e.visible=!1}),this.bubble&&(this.bubble.visible=!0,this.bubble.rotation=Math.PI,this.repositionFoldedBubble());else{this.background.visible=!0,this.bubble&&(this.bubble.visible=!0,this.bubble.rotation=0,this.bubble.position.set(0,0)),this.updateBackground();const e=t.getRoomData(this.roomId);e&&this.updateIcons(e)}}isFoldedState(){const e=n(),{foldable:t}=e.roomConfig.property;return!!t&&this.isFolded}repositionFoldedBubble(){const e=n(),{foldable:t}=e.roomConfig.property;if(!t||!this.bubble)return;const o=e.roomConfig,{tailHeight:r}=o.property.container,i=this.calculateContentWidth(),s=this.calculateContentHeight(),l=i/2;this.bubble.position.set(l,s+r/2)}refreshColor(){const e=n(),{propertyTheme:t}=e.roomConfig.colors,o=e.getRoomData(this.roomId),r=o?.colorIndex??this.roomIndex,i=t[r%t.length];if(this.propertyIcons.forEach(({sprite:e})=>{e.tint=i}),this.orderBackground&&this.orderBackground.visible){const{property:o}=e.roomConfig,i=o.iconWidth,n=o.iconHeight;this.orderBackground.clear(),this.orderBackground.setFillStyle({color:t[r%t.length]}),this.orderBackground.circle(i/2,n/2,i/2).fill()}}destroy(){this.propertyIcons.forEach(({sprite:e})=>{e.destroy()}),this.propertyIcons.clear(),super.destroy()}}export{s as RoomProperty};

package/dist/components/RoomInfo/index.js

@@ -1 +1 @@
-import{RoomName as o}from"./RoomName.js";import{RoomProperty as t}from"./RoomProperty.js";import{RoomSelectionIndicator as e}from"./RoomSelectionIndicator.js";import{ClickHandler as i}from"../../mixins/ClickHandler.js";import{FixedSizeContainer as r}from"../Base/FixedSizeContainer.js";import{useAppService as s}from"../../application/AppService.js";class n extends r{roomId;roomName;roomProperty=null;roomSelectionIndicator=null;clickHandler=null;constructor(t){super();const e=s();this.enableRenderGroup(),this.roomId=t.id,t.centerPoint&&this.position.set(t.centerPoint.x,t.centerPoint.y),this.roomName=new o(t),this.roomName.visible=e.runtimeSnapshot.showRoomName,this.createRoomProperty(t),this.createRoomSelectionIndicator(t),this.updateLayout(),this.clickHandler=new i(this,{onClick:()=>{e.events?.onClickRoomProperties?.(t)}})}shouldShowRoomProperty(){const o=s(),{showRoomOrder:t,showRoomProperty:e,selectRoomIds:i,enableRoomSelection:r,roomSelectionMode:n}=o.runtimeSnapshot,m=o.getRoomData(this.roomId);if(!m)return!1;if(r&&"checkmark"===n&&i.includes(this.roomId))return!1;const a=t&&(m.order||0)>0,c=e&&(m.suction&&o.roomConfig.property.displayOrders.includes("suction")||m.cistern&&o.roomConfig.property.displayOrders.includes("cistern")||m.cleanTimes>0&&o.roomConfig.property.displayOrders.includes("cleanTimes"));return a||c}shouldShowRoomSelectionIndicator(){const o=s(),{enableRoomSelection:t,roomSelectionMode:e}=o.runtimeSnapshot;return t&&"checkmark"===e}updateRoomPropertyVisibility(){const o=s();if(this.roomProperty){if(this.shouldShowRoomProperty()){this.roomProperty.visible=!0;const t=o.runtimeSnapshot.roomPropertyFoldIds.includes(this.roomId);this.roomProperty.setFolded(t);const e=o.getRoomData(this.roomId);e&&this.roomProperty.updateProperty(e)}else this.roomProperty.visible=!1;this.updateLayout()}}async updateRoomSelectionIndicatorVisibility(){const o=s();if(this.roomSelectionIndicator){if(this.shouldShowRoomSelectionIndicator()){const t=o.getRoomData(this.roomId);t&&await this.roomSelectionIndicator.updateIndicator(t)}else this.roomSelectionIndicator.visible=!1;this.updateLayout()}}async createRoomProperty(o){const e=s();this.roomProperty&&(this.removeChild(this.roomProperty),this.roomProperty.destroy()),this.roomProperty=new t(o),await this.roomProperty.updateProperty(o),this.addChild(this.roomProperty),this.addChild(this.roomName),this.roomName.visible=e.runtimeSnapshot.showRoomName,this.updateRoomPropertyVisibility()}async createRoomSelectionIndicator(o){this.roomSelectionIndicator&&(this.removeChild(this.roomSelectionIndicator),this.roomSelectionIndicator.destroy()),this.roomSelectionIndicator=new e(o),this.addChild(this.roomSelectionIndicator),await this.updateRoomSelectionIndicatorVisibility()}updateLayout(){const o=s(),{property:{offsetY:t,offsetX:e},selectionIndicator:{offsetY:i,offsetX:r}}=o.roomConfig,n=this.roomProperty?.visible||!1,m=this.roomName.visible,a=this.roomSelectionIndicator?.visible||!1;if(n&&this.roomProperty)if(this.roomProperty.isFoldedState())this.roomProperty.position.set(e,-t);else{const o=this.roomProperty.getTotalHeight(),i=this.roomProperty.getTotalWidth();m?(this.roomProperty.position.set(-i/2+e,-t-o),this.roomName.position.set(0,0)):this.roomProperty.position.set(-i/2+e,-o/2-t)}if(a&&this.roomSelectionIndicator){const o=this.roomSelectionIndicator.getTotalHeight(),t=this.roomSelectionIndicator.getTotalWidth();m?(this.roomSelectionIndicator.position.set(-t/2+r,-i-o),this.roomName.position.set(0,0)):this.roomSelectionIndicator.position.set(-t/2+r,-o/2-i)}!m||n||a||this.roomName.position.set(0,0)}updateName(o){this.roomName.updateName(o)}updateRoomNameVisibility(o){this.roomName.visible=o,this.updateLayout()}updatePosition(o){this.position.set(o.x,o.y)}async refreshColor(){this.roomName&&this.roomName.refreshColor(),this.roomProperty&&this.roomProperty.refreshColor(),this.roomSelectionIndicator&&await this.roomSelectionIndicator.refreshColor()}destroy(){this.clickHandler?.destroy(),this.clickHandler=null,this.roomProperty?.destroy(),this.roomProperty=null,this.roomSelectionIndicator?.destroy(),this.roomSelectionIndicator=null,this.roomName?.destroy(),super.destroy()}}export{n as RoomInfo};
+import{RoomName as o}from"./RoomName.js";import{RoomProperty as t}from"./RoomProperty.js";import{RoomSelectionIndicator as e}from"./RoomSelectionIndicator.js";import{ClickHandler as i}from"../../mixins/ClickHandler.js";import{FixedSizeContainer as r}from"../Base/FixedSizeContainer.js";import{useAppService as s}from"../../application/AppService.js";class n extends r{roomId;roomName;roomProperty=null;roomSelectionIndicator=null;clickHandler=null;constructor(t){super();const e=s();this.enableRenderGroup(),this.roomId=t.id,t.centerPoint&&this.position.set(t.centerPoint.x,t.centerPoint.y),this.roomName=new o(t),this.roomName.visible=e.runtimeSnapshot.showRoomName,this.createRoomProperty(t),this.createRoomSelectionIndicator(t),this.updateLayout(),this.clickHandler=new i(this,{onClick:()=>{e.events?.onClickRoomProperties?.(t)}})}shouldShowRoomProperty(){const o=s(),{showRoomOrder:t,showRoomProperty:e,selectRoomIds:i,enableRoomSelection:r,roomSelectionMode:n}=o.runtimeSnapshot,m=o.getRoomData(this.roomId);if(!m)return!1;if(r&&"checkmark"===n&&i.includes(this.roomId))return!1;const a=t&&(m.order||0)>0;let c=!1;if(e){const{displayOrders:t}=o.roomConfig.property;c=t.some(o=>"suction"===o&&null!=m.suction||"cistern"===o&&null!=m.cistern||"cleanMode"===o&&null!=m.cleanMode||"cleanTimes"===o&&m.cleanTimes>0||!(!m.customData||!(o in m.customData)||"number"!=typeof m.customData[o]||null==m.customData[o]))}return a||c}shouldShowRoomSelectionIndicator(){const o=s(),{enableRoomSelection:t,roomSelectionMode:e}=o.runtimeSnapshot;return t&&"checkmark"===e}updateRoomPropertyVisibility(){const o=s();if(this.roomProperty){if(this.shouldShowRoomProperty()){this.roomProperty.visible=!0;const t=o.runtimeSnapshot.roomPropertyFoldIds.includes(this.roomId);this.roomProperty.setFolded(t);const e=o.getRoomData(this.roomId);e&&this.roomProperty.updateProperty(e)}else this.roomProperty.visible=!1;this.updateLayout()}}async updateRoomSelectionIndicatorVisibility(){const o=s();if(this.roomSelectionIndicator){if(this.shouldShowRoomSelectionIndicator()){const t=o.getRoomData(this.roomId);t&&await this.roomSelectionIndicator.updateIndicator(t)}else this.roomSelectionIndicator.visible=!1;this.updateLayout()}}async createRoomProperty(o){const e=s();this.roomProperty&&(this.removeChild(this.roomProperty),this.roomProperty.destroy()),this.roomProperty=new t(o),await this.roomProperty.updateProperty(o),this.addChild(this.roomProperty),this.addChild(this.roomName),this.roomName.visible=e.runtimeSnapshot.showRoomName,this.updateRoomPropertyVisibility()}async createRoomSelectionIndicator(o){this.roomSelectionIndicator&&(this.removeChild(this.roomSelectionIndicator),this.roomSelectionIndicator.destroy()),this.roomSelectionIndicator=new e(o),this.addChild(this.roomSelectionIndicator),await this.updateRoomSelectionIndicatorVisibility()}updateLayout(){const o=s(),{property:{offsetY:t,offsetX:e},selectionIndicator:{offsetY:i,offsetX:r}}=o.roomConfig,n=this.roomProperty?.visible||!1,m=this.roomName.visible,a=this.roomSelectionIndicator?.visible||!1;if(n&&this.roomProperty)if(this.roomProperty.isFoldedState())this.roomProperty.position.set(e,-t);else{const o=this.roomProperty.getTotalHeight(),i=this.roomProperty.getTotalWidth();m?(this.roomProperty.position.set(-i/2+e,-t-o),this.roomName.position.set(0,0)):this.roomProperty.position.set(-i/2+e,-o/2-t)}if(a&&this.roomSelectionIndicator){const o=this.roomSelectionIndicator.getTotalHeight(),t=this.roomSelectionIndicator.getTotalWidth();m?(this.roomSelectionIndicator.position.set(-t/2+r,-i-o),this.roomName.position.set(0,0)):this.roomSelectionIndicator.position.set(-t/2+r,-o/2-i)}!m||n||a||this.roomName.position.set(0,0)}updateName(o){this.roomName.updateName(o)}updateRoomNameVisibility(o){this.roomName.visible=o,this.updateLayout()}updatePosition(o){this.position.set(o.x,o.y)}async refreshColor(){this.roomName&&this.roomName.refreshColor(),this.roomProperty&&this.roomProperty.refreshColor(),this.roomSelectionIndicator&&await this.roomSelectionIndicator.refreshColor()}destroy(){this.clickHandler?.destroy(),this.clickHandler=null,this.roomProperty?.destroy(),this.roomProperty=null,this.roomSelectionIndicator?.destroy(),this.roomSelectionIndicator=null,this.roomName?.destroy(),super.destroy()}}export{n as RoomInfo};

package/dist/index.d.ts

@@ -125,8 +125,14 @@ export declare type AppConfig = {
         }
         /** 房间属性配置 */
         property: {
-            /** 显示顺序 */
-            displayOrders: ('cleanMode' | 'suction' | 'cistern' | 'cleanTimes')[]
+            /** 显示顺序（支持内置字段和自定义字段名） */
+            displayOrders: (
+            | 'cleanMode'
+            | 'suction'
+            | 'cistern'
+            | 'cleanTimes'
+            | string
+            )[]
             /** 图标宽度 */
             iconWidth: number
             /** 图标高度 */
@@ -187,6 +193,8 @@ export declare type AppConfig = {
                 /** 右侧间隔 */
                 gapRight: number
             }
+            /** 自定义属性资源配置 */
+            customAssets?: Record<string, string[]>
         }
         /** 选择指示器配置 */
         selectionIndicator: {
@@ -553,7 +561,7 @@ declare class AppService {
             fontWeight: TextStyleFontWeight;
         };
         property: {
-            displayOrders: ("cleanMode" | "suction" | "cistern" | "cleanTimes")[];
+            displayOrders: ("cleanMode" | "suction" | "cistern" | "cleanTimes" | string)[];
             iconWidth: number;
             iconHeight: number;
             foldable: boolean;
@@ -587,6 +595,7 @@ declare class AppService {
                 fontSize: number;
                 gapRight: number;
             };
+            customAssets?: Record<string, string[]>;
         };
         selectionIndicator: {
             iconSrc: string;