diff --git a/assets/js/hooks/Mapper/components/map/Map.tsx b/assets/js/hooks/Mapper/components/map/Map.tsx index 03a7677d..81621c86 100644 --- a/assets/js/hooks/Mapper/components/map/Map.tsx +++ b/assets/js/hooks/Mapper/components/map/Map.tsx @@ -1,4 +1,4 @@ -import React, { ForwardedRef, forwardRef, MouseEvent, useCallback } from 'react'; +import { ForwardedRef, forwardRef, MouseEvent, useCallback, useEffect } from 'react'; import ReactFlow, { Background, ConnectionMode, @@ -94,6 +94,7 @@ interface MapCompProps { minimapClasses?: string; isShowMinimap?: boolean; onSystemContextMenu: (event: MouseEvent, systemId: string) => void; + showKSpaceBG?: boolean; } const MapComp = ({ @@ -105,6 +106,7 @@ const MapComp = ({ onConnectionInfoClick, onSelectionContextMenu, isShowMinimap, + showKSpaceBG, }: MapCompProps) => { const [nodes, , onNodesChange] = useNodesState(initialNodes); const [edges, , onEdgesChange] = useEdgesState[]>(initialEdges); @@ -169,6 +171,13 @@ const MapComp = ({ localStorage.setItem(SESSION_KEY.viewPort, JSON.stringify(viewport)); }; + useEffect(() => { + update(x => ({ + ...x, + showKSpaceBG: showKSpaceBG, + })); + }, [showKSpaceBG, update]); + return ( <>
diff --git a/assets/js/hooks/Mapper/components/map/MapProvider.tsx b/assets/js/hooks/Mapper/components/map/MapProvider.tsx index f195e314..7b963f42 100644 --- a/assets/js/hooks/Mapper/components/map/MapProvider.tsx +++ b/assets/js/hooks/Mapper/components/map/MapProvider.tsx @@ -7,6 +7,7 @@ export type MapData = MapUnionTypes & { isConnecting: boolean; hoverNodeId: string | null; visibleNodes: Set; + showKSpaceBG: boolean; }; interface MapProviderProps { @@ -27,6 +28,7 @@ const INITIAL_DATA: MapData = { connections: [], hoverNodeId: null, visibleNodes: new Set(), + showKSpaceBG: false, }; export interface MapContextProps { @@ -38,6 +40,7 @@ export interface MapContextProps { const MapContext = createContext({ update: () => {}, data: { ...INITIAL_DATA }, + // @ts-ignore outCommand: async () => void 0, }); diff --git a/assets/js/hooks/Mapper/components/map/components/SolarSystemNode/SolarSystemNode.module.scss b/assets/js/hooks/Mapper/components/map/components/SolarSystemNode/SolarSystemNode.module.scss index c77dcc48..d19e1910 100644 --- a/assets/js/hooks/Mapper/components/map/components/SolarSystemNode/SolarSystemNode.module.scss +++ b/assets/js/hooks/Mapper/components/map/components/SolarSystemNode/SolarSystemNode.module.scss @@ -23,6 +23,62 @@ $tooltip-bg: #202020; // Темный фон для подсказок border-radius: 5px; position: relative; z-index: 1; + overflow: hidden; + + + &.Mataria, &.Amarria, &.Gallente, &.Caldaria { + &::Before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-size: cover; + background-position: 50% 50%; + z-index: -1; + background-repeat: no-repeat; + border-radius: 3px; + } + } + + &.Mataria { + &::before { + background-image: url("/images/mataria.png"); + opacity: 0.6; + background-position-x: -28px; + background-position-y: -3px; + } + } + + &.Caldaria { + &::before { + background-image: url("/images/caldaria.png"); + opacity: 0.6; + background-position-x: -16px; + background-position-y: -17px; + } + } + + &.Amarria { + &::before { + opacity: 0.45; + background-image: url("/images/amarr.png"); + background-position-x: 0px; + background-position-y: -1px; + width: calc(100% + 10px) + } + } + + &.Gallente { + &::before { + opacity: 0.6; + background-image: url("/images/gallente.png"); + background-position-x: -1px; + background-position-y: -10px; + } + } + &.selected { border-color: $pastel-pink; diff --git a/assets/js/hooks/Mapper/components/map/components/SolarSystemNode/SolarSystemNode.tsx b/assets/js/hooks/Mapper/components/map/components/SolarSystemNode/SolarSystemNode.tsx index 67edaaf8..6856cabb 100644 --- a/assets/js/hooks/Mapper/components/map/components/SolarSystemNode/SolarSystemNode.tsx +++ b/assets/js/hooks/Mapper/components/map/components/SolarSystemNode/SolarSystemNode.tsx @@ -19,6 +19,14 @@ import { PrimeIcons } from 'primereact/api'; import { LabelsManager } from '@/hooks/Mapper/utils/labelsManager.ts'; import { OutCommand } from '@/hooks/Mapper/types'; import { useDoubleClick } from '@/hooks/Mapper/hooks/useDoubleClick.ts'; +import { REGIONS_MAP, Spaces } from '@/hooks/Mapper/constants'; + +const SpaceToClass: Record = { + [Spaces.Caldari]: classes.Caldaria, + [Spaces.Matar]: classes.Mataria, + [Spaces.Amarr]: classes.Amarria, + [Spaces.Gallente]: classes.Gallente, +}; const sortedLabels = (labels: string[]) => { if (labels === null) { @@ -50,6 +58,7 @@ export const SolarSystemNode = memo(({ data, selected }: WrapNodeProps {visible && ( @@ -147,7 +160,11 @@ export const SolarSystemNode = memo(({ data, selected }: WrapNodeProps )} -
+
{visible && ( <>
@@ -183,7 +200,13 @@ export const SolarSystemNode = memo(({ data, selected }: WrapNodeProps +
{region_name}
)} diff --git a/assets/js/hooks/Mapper/components/mapRootContent/components/RightBar/RightBar.tsx b/assets/js/hooks/Mapper/components/mapRootContent/components/RightBar/RightBar.tsx index ca1e8fde..8067d205 100644 --- a/assets/js/hooks/Mapper/components/mapRootContent/components/RightBar/RightBar.tsx +++ b/assets/js/hooks/Mapper/components/mapRootContent/components/RightBar/RightBar.tsx @@ -13,6 +13,8 @@ interface RightBarProps { export const RightBar = ({ onShowOnTheMap }: RightBarProps) => { const { outCommand, interfaceSettings, setInterfaceSettings } = useMapRootState(); + const isShowMinimap = interfaceSettings.isShowMinimap === undefined ? true : interfaceSettings.isShowMinimap; + const handleAddCharacter = useCallback(() => { outCommand({ type: OutCommand.addCharacter, @@ -27,6 +29,13 @@ export const RightBar = ({ onShowOnTheMap }: RightBarProps) => { })); }, [setInterfaceSettings]); + const toggleKSpace = useCallback(() => { + setInterfaceSettings(x => ({ + ...x, + isShowKSpace: !x.isShowKSpace, + })); + }, [setInterfaceSettings]); + const toggleMenu = useCallback(() => { setInterfaceSettings(x => ({ ...x, @@ -67,19 +76,31 @@ export const RightBar = ({ onShowOnTheMap }: RightBarProps) => {
+ + + + diff --git a/assets/js/hooks/Mapper/components/mapWrapper/MapWrapper.tsx b/assets/js/hooks/Mapper/components/mapWrapper/MapWrapper.tsx index 16987eeb..528c06a3 100644 --- a/assets/js/hooks/Mapper/components/mapWrapper/MapWrapper.tsx +++ b/assets/js/hooks/Mapper/components/mapWrapper/MapWrapper.tsx @@ -24,7 +24,7 @@ export const MapWrapper = ({ refn }: MapWrapperProps) => { update, outCommand, data: { selectedConnections, selectedSystems, hubs, systems }, - interfaceSettings: { isShowMenu, isShowMinimap = STORED_INTERFACE_DEFAULT_VALUES.isShowMinimap }, + interfaceSettings: { isShowMenu, isShowMinimap = STORED_INTERFACE_DEFAULT_VALUES.isShowMinimap, isShowKSpace }, } = useMapRootState(); const { open, ...systemContextProps } = useContextMenuSystemHandlers({ systems, hubs, outCommand }); @@ -99,6 +99,7 @@ export const MapWrapper = ({ refn }: MapWrapperProps) => { onSelectionContextMenu={handleSystemMultipleContext} minimapClasses={!isShowMenu ? classes.MiniMap : undefined} isShowMinimap={isShowMinimap} + showKSpaceBG={isShowKSpace} /> {openSettings != null && ( diff --git a/assets/js/hooks/Mapper/constants.ts b/assets/js/hooks/Mapper/constants.ts index 61021563..4f2637e3 100644 --- a/assets/js/hooks/Mapper/constants.ts +++ b/assets/js/hooks/Mapper/constants.ts @@ -5,3 +5,62 @@ export enum SESSION_KEY { } export const GRADIENT_MENU_ACTIVE_CLASSES = 'bg-gradient-to-br from-transparent/10 to-fuchsia-300/10'; + +export enum Regions { + Derelik = 10000001, + TheForge = 10000002, + Lonetrek = 10000016, + SinqLaison = 10000032, + Aridia = 10000054, + BlackRise = 10000069, + TheBleakLands = 10000038, + TheCitadel = 10000033, + Devoid = 10000036, + Domain = 10000043, + Essence = 10000064, + Everyshore = 10000037, + Genesis = 10000067, + Heimatar = 10000030, + Kador = 10000052, + Khanid = 10000049, + KorAzor = 10000065, + Metropolis = 10000042, + MoldenHeath = 10000028, + Placid = 10000048, + Solitude = 10000044, + TashMurkon = 10000020, + VergeVendor = 10000068, +} + +export enum Spaces { + 'Caldari' = 'Caldari', + 'Gallente' = 'Gallente', + 'Matar' = 'Matar', + 'Amarr' = 'Amarr', +} + +export const REGIONS_MAP: Record = { + [Regions.Derelik]: Spaces.Amarr, + [Regions.TheForge]: Spaces.Caldari, + [Regions.Lonetrek]: Spaces.Caldari, + [Regions.SinqLaison]: Spaces.Gallente, + [Regions.Aridia]: Spaces.Amarr, + [Regions.BlackRise]: Spaces.Caldari, + [Regions.TheBleakLands]: Spaces.Amarr, + [Regions.TheCitadel]: Spaces.Caldari, + [Regions.Devoid]: Spaces.Amarr, + [Regions.Domain]: Spaces.Amarr, + [Regions.Essence]: Spaces.Gallente, + [Regions.Everyshore]: Spaces.Gallente, + [Regions.Genesis]: Spaces.Amarr, + [Regions.Heimatar]: Spaces.Matar, + [Regions.Kador]: Spaces.Amarr, + [Regions.Khanid]: Spaces.Amarr, + [Regions.KorAzor]: Spaces.Amarr, + [Regions.Metropolis]: Spaces.Matar, + [Regions.MoldenHeath]: Spaces.Matar, + [Regions.Placid]: Spaces.Gallente, + [Regions.Solitude]: Spaces.Gallente, + [Regions.TashMurkon]: Spaces.Amarr, + [Regions.VergeVendor]: Spaces.Gallente, +}; diff --git a/assets/js/hooks/Mapper/mapRootProvider/MapRootProvider.tsx b/assets/js/hooks/Mapper/mapRootProvider/MapRootProvider.tsx index 5d48b3a6..b0007d99 100644 --- a/assets/js/hooks/Mapper/mapRootProvider/MapRootProvider.tsx +++ b/assets/js/hooks/Mapper/mapRootProvider/MapRootProvider.tsx @@ -30,11 +30,13 @@ const INITIAL_DATA: MapRootData = { type InterfaceStoredSettings = { isShowMenu: boolean; isShowMinimap: boolean; + isShowKSpace: boolean; }; export const STORED_INTERFACE_DEFAULT_VALUES: InterfaceStoredSettings = { isShowMenu: false, isShowMinimap: true, + isShowKSpace: false, }; export interface MapRootContextProps { @@ -50,6 +52,7 @@ const MapRootContext = createContext({ update: () => {}, data: { ...INITIAL_DATA }, mapRef: { current: null }, + // @ts-ignore outCommand: async () => void 0, interfaceSettings: STORED_INTERFACE_DEFAULT_VALUES, setInterfaceSettings: () => null, diff --git a/assets/static/images/amarr.png b/assets/static/images/amarr.png new file mode 100644 index 00000000..696d0c9c Binary files /dev/null and b/assets/static/images/amarr.png differ diff --git a/assets/static/images/caldaria.png b/assets/static/images/caldaria.png new file mode 100644 index 00000000..e5b2b1bd Binary files /dev/null and b/assets/static/images/caldaria.png differ diff --git a/assets/static/images/gallente.png b/assets/static/images/gallente.png new file mode 100644 index 00000000..2ebcbe37 Binary files /dev/null and b/assets/static/images/gallente.png differ diff --git a/assets/static/images/mataria.png b/assets/static/images/mataria.png new file mode 100644 index 00000000..7fe0d918 Binary files /dev/null and b/assets/static/images/mataria.png differ