| | |
| | | const [app, setApp] = useState(null); |
| | | const [mapContainer, setMapContainer] = useState(null); |
| | | |
| | | const [mode, setMode] = useState(null); |
| | | const [mode, setMode] = useState(MAP_MODE.OBSERVER_MODE); |
| | | const [dataFetched, setDataFetched] = useState(false); |
| | | const [insightVisible, setInsightVisible] = useState(false); |
| | | const [deviceVisible, setDeviceVisible] = useState(false); |
| | |
| | | const [batchSelectionVisible, setBatchSelectionVisible] = useState(false); |
| | | |
| | | const [curSprite, setCurSprite] = useState(null); |
| | | const prevCurSpriteRef = useRef(); |
| | | const [batchSprites, setBatchSprites] = useState([]); |
| | | |
| | | const [rcsStatus, setRcsStatus] = useState(null); |
| | |
| | | Http.setMapContainer(player.mapContainer); |
| | | websocket = new WebSocketClient('/ws/map/websocket'); |
| | | |
| | | await Http.fetchMapData(curZone, setRcsStatus); |
| | | await Http.fetchMapData(curZone, setRcsStatus, setCurSprite); |
| | | websocket.connect(); |
| | | websocket.onMessage = (wsMsg) => { |
| | | Tool.generateDynamicGraphic(curZone, JSON.parse(wsMsg), setCurSprite); |
| | |
| | | notify.info(translate('page.map.welcome')); |
| | | player.adaptScreen(); |
| | | setDataFetched(true); |
| | | setMode(MAP_MODE.OBSERVER_MODE); |
| | | }, 200) |
| | | } |
| | | initialize(); |
| | |
| | | if (!mapContainer) { |
| | | return; |
| | | } |
| | | prevCurSpriteRef.current = curSprite; |
| | | if (curSprite && prevCurSprite !== curSprite) { |
| | | Tool.removeSelectedEffect(); |
| | | } |
| | | Tool.removeSelectedEffect(); |
| | | if (curSprite) { |
| | | if (mode === MAP_MODE.OBSERVER_MODE) { |
| | | Tool.showSelectedEffect(curSprite); |
| | |
| | | setSettingsVisible(false); |
| | | } |
| | | }, [curSprite]); |
| | | const prevCurSprite = prevCurSpriteRef.current; |
| | | |
| | | // watch batchSprites |
| | | React.useEffect(() => { |