| | |
| | | MenuItem, |
| | | Button, |
| | | Box, |
| | | SpeedDial, |
| | | SpeedDialAction, |
| | | useTheme, |
| | | Fab, |
| | | } from '@mui/material'; |
| | | import { |
| | | MoreVert as MoreVertIcon, |
| | | Edit as EditIcon, |
| | | FileCopy as FileCopyIcon, |
| | | Save as SaveIcon, |
| | | Print as PrintIcon, |
| | | Share as ShareIcon, |
| | | } from '@mui/icons-material'; |
| | | import { MAP_MODE } from "./constants"; |
| | | import Player from './player'; |
| | | import * as Tool from './tool'; |
| | |
| | | await Http.fetchMapData(); |
| | | websocket.connect(); |
| | | websocket.onMessage = (wsMsg) => { |
| | | Tool.generateDynamicGraphic(curZone, JSON.parse(wsMsg)); |
| | | Tool.generateDynamicGraphic(curZone, JSON.parse(wsMsg), setCurSprite); |
| | | } |
| | | |
| | | |
| | | setTimeout(() => { |
| | | player.adaptScreen(); |
| | | notify.info(translate('page.map.welcome')); |
| | | player.adaptScreen(); |
| | | setDataFetched(true); |
| | | setMode(MAP_MODE.OBSERVER_MODE); |
| | | }, 200) |
| | |
| | | player.hideStarryBackground(); |
| | | |
| | | player.activateMapMultiSelect((selectedSprites, restartFn) => { |
| | | setBatchSprites(selectedSprites); |
| | | Tool.multipleSelectEnhancer(selectedSprites, setCurSprite, setBatchSprites); |
| | | }); |
| | | |
| | | mapContainer.children.forEach(child => { |
| | |
| | | // player.showStarryBackground(); // 0x2f68ac |
| | | |
| | | player.activateMapMultiSelect((selectedSprites, restartFn) => { |
| | | setBatchSprites(selectedSprites); |
| | | Tool.multipleSelectEnhancer(selectedSprites, setCurSprite, setBatchSprites); |
| | | }); |
| | | |
| | | mapContainer.children.forEach(child => { |
| | |
| | | setBatchSelectionVisible(false) |
| | | } |
| | | }, [batchSprites]) |
| | | |
| | | const actions = [ |
| | | { icon: <FileCopyIcon />, name: '复制' }, |
| | | { icon: <SaveIcon />, name: '保存' }, |
| | | { icon: <PrintIcon />, name: '打印' }, |
| | | { icon: <ShareIcon />, name: '分享' }, |
| | | { icon: <EditIcon />, name: '编辑' }, |
| | | ]; |
| | | |
| | | return ( |
| | | <Box |
| | |
| | | flexGrow: 1, // fill remaining of map space |
| | | position: 'relative', |
| | | backgroundColor: '#fff', |
| | | ...(mode === MAP_MODE.SETTINGS_MODE && { |
| | | animation: 'settingsPulse 1.5s infinite', |
| | | '@keyframes settingsPulse': { |
| | | '0%': { |
| | | boxShadow: `0 0 3px 1px ${theme.palette.primary.main.replace('rgb', 'rgba').replace(')', `, 0.1)`)}`, |
| | | }, |
| | | '50%': { |
| | | boxShadow: `0 0 8px 3px ${theme.palette.primary.main.replace('rgb', 'rgba').replace(')', `, 0.5)`)}`, |
| | | }, |
| | | '100%': { |
| | | boxShadow: `0 0 3px 1px ${theme.palette.primary.main.replace('rgb', 'rgba').replace(')', `, 0.1)`)}`, |
| | | }, |
| | | }, |
| | | }) |
| | | }} |
| | | > |
| | | <Box |
| | |
| | | height: '100%', |
| | | }} /> |
| | | </Box> |
| | | |
| | | {/* <SpeedDial |
| | | ariaLabel="SpeedDial 示例" |
| | | sx={{ position: 'absolute', bottom: 16, right: 16 }} |
| | | icon={<MoreVertIcon />} |
| | | > |
| | | {actions.map((action) => ( |
| | | <SpeedDialAction |
| | | key={action.name} |
| | | icon={action.icon} |
| | | tooltipTitle={action.name} |
| | | /> |
| | | ))} |
| | | </SpeedDial> */} |
| | | |
| | | <Box |
| | | sx={{ |