364 lines
11 KiB
TypeScript
364 lines
11 KiB
TypeScript
import * as THREE from "three";
|
|
import * as Types from "../types/world/worldTypes";
|
|
import { create } from "zustand";
|
|
import { io } from "socket.io-client";
|
|
|
|
export const useSocketStore = create<any>((set: any, get: any) => ({
|
|
socket: null,
|
|
initializeSocket: (email: any) => {
|
|
const existingSocket = get().socket;
|
|
if (existingSocket) {
|
|
return;
|
|
}
|
|
|
|
const socket = io(
|
|
`http://${process.env.REACT_APP_SERVER_SOCKET_API_BASE_URL}/`,
|
|
{
|
|
reconnection: false,
|
|
auth: { email },
|
|
}
|
|
);
|
|
|
|
set({ socket });
|
|
},
|
|
disconnectSocket: () => {
|
|
set((state: any) => {
|
|
state.socket?.disconnect();
|
|
return { socket: null };
|
|
});
|
|
},
|
|
}));
|
|
|
|
export const useLoadingProgress = create<{
|
|
loadingProgress: number;
|
|
setLoadingProgress: (x: number) => void;
|
|
}>((set) => ({
|
|
loadingProgress: 1,
|
|
setLoadingProgress: (x: number) => set({ loadingProgress: x }),
|
|
}));
|
|
|
|
export const useOrganization = create<any>((set: any) => ({
|
|
organization: "",
|
|
setOrganization: (x: any) => set(() => ({ organization: x })),
|
|
}));
|
|
|
|
export const useToggleView = create<any>((set: any) => ({
|
|
toggleView: false,
|
|
setToggleView: (x: any) => set(() => ({ toggleView: x })),
|
|
}));
|
|
|
|
export const useUpdateScene = create<any>((set: any) => ({
|
|
updateScene: false,
|
|
setUpdateScene: (x: any) => set(() => ({ updateScene: x })),
|
|
}));
|
|
|
|
export const useWalls = create<any>((set: any) => ({
|
|
walls: [],
|
|
setWalls: (x: any) => set(() => ({ walls: x })),
|
|
}));
|
|
|
|
export const useZones = create<any>((set: any) => ({
|
|
zones: [],
|
|
setZones: (x: any) => set(() => ({ zones: x })),
|
|
}));
|
|
|
|
interface ZonePointsState {
|
|
zonePoints: THREE.Vector3[];
|
|
setZonePoints: (points: THREE.Vector3[]) => void;
|
|
}
|
|
|
|
export const useZonePoints = create<ZonePointsState>((set) => ({
|
|
zonePoints: [],
|
|
setZonePoints: (points) => set({ zonePoints: points }),
|
|
}));
|
|
|
|
export const useSelectedItem = create<any>((set: any) => ({
|
|
selectedItem: { name: "", id: "" },
|
|
setSelectedItem: (x: any) => set(() => ({ selectedItem: x })),
|
|
}));
|
|
|
|
export const useSelectedAssets = create<any>((set: any) => ({
|
|
selectedAssets: [],
|
|
setSelectedAssets: (x: any) => set(() => ({ selectedAssets: x })),
|
|
}));
|
|
|
|
export const useLayers = create<any>((set: any) => ({
|
|
Layers: 1,
|
|
setLayers: (x: any) => set(() => ({ Layers: x })),
|
|
}));
|
|
|
|
export const useCamPosition = create<any>((set: any) => ({
|
|
camPosition: { x: undefined, y: undefined, z: undefined },
|
|
setCamPosition: (newCamPosition: any) => set({ camPosition: newCamPosition }),
|
|
}));
|
|
|
|
export const useMenuVisible = create<any>((set: any) => ({
|
|
menuVisible: false,
|
|
setMenuVisible: (x: any) => set(() => ({ menuVisible: x })),
|
|
}));
|
|
|
|
export const useDeleteModels = create<any>((set: any) => ({
|
|
deleteModels: false,
|
|
setDeleteModels: (x: any) => set(() => ({ deleteModels: x })),
|
|
}));
|
|
|
|
export const useToolMode = create<any>((set: any) => ({
|
|
toolMode: null,
|
|
setToolMode: (x: any) => set(() => ({ toolMode: x })),
|
|
}));
|
|
|
|
export const useNewLines = create<any>((set: any) => ({
|
|
newLines: [],
|
|
setNewLines: (x: any) => set(() => ({ newLines: x })),
|
|
}));
|
|
|
|
export const useDeletedLines = create<any>((set: any) => ({
|
|
deletedLines: [],
|
|
setDeletedLines: (x: any) => set(() => ({ deletedLines: x })),
|
|
}));
|
|
|
|
export const useMovePoint = create<any>((set: any) => ({
|
|
movePoint: false,
|
|
setMovePoint: (x: any) => set(() => ({ movePoint: x })),
|
|
}));
|
|
|
|
export const useTransformMode = create<any>((set: any) => ({
|
|
transformMode: null,
|
|
setTransformMode: (x: any) => set(() => ({ transformMode: x })),
|
|
}));
|
|
|
|
export const useDeletePointOrLine = create<any>((set: any) => ({
|
|
deletePointOrLine: false,
|
|
setDeletePointOrLine: (x: any) => set(() => ({ deletePointOrLine: x })),
|
|
}));
|
|
|
|
export const useFloorItems = create<any>((set: any) => ({
|
|
floorItems: null,
|
|
setFloorItems: (callback: any) =>
|
|
set((state: any) => ({
|
|
floorItems:
|
|
typeof callback === "function" ? callback(state.floorItems) : callback,
|
|
})),
|
|
}));
|
|
|
|
export const useWallItems = create<any>((set: any) => ({
|
|
wallItems: [],
|
|
setWallItems: (callback: any) =>
|
|
set((state: any) => ({
|
|
wallItems:
|
|
typeof callback === "function" ? callback(state.wallItems) : callback,
|
|
})),
|
|
}));
|
|
|
|
export const useSelectedWallItem = create<any>((set: any) => ({
|
|
selectedWallItem: null,
|
|
setSelectedWallItem: (x: any) => set(() => ({ selectedWallItem: x })),
|
|
}));
|
|
|
|
export const useselectedFloorItem = create<any>((set: any) => ({
|
|
selectedFloorItem: null,
|
|
setselectedFloorItem: (x: any) => set(() => ({ selectedFloorItem: x })),
|
|
}));
|
|
|
|
export const useDeletableFloorItem = create<any>((set: any) => ({
|
|
deletableFloorItem: null,
|
|
setDeletableFloorItem: (x: any) => set(() => ({ deletableFloorItem: x })),
|
|
}));
|
|
|
|
export const useSetScale = create<any>((set: any) => ({
|
|
scale: null,
|
|
setScale: (x: any) => set(() => ({ scale: x })),
|
|
}));
|
|
|
|
export const useRoofVisibility = create<any>((set: any) => ({
|
|
roofVisibility: false,
|
|
setRoofVisibility: (x: any) => set(() => ({ roofVisibility: x })),
|
|
}));
|
|
|
|
export const useWallVisibility = create<any>((set: any) => ({
|
|
wallVisibility: false,
|
|
setWallVisibility: (x: any) => set(() => ({ wallVisibility: x })),
|
|
}));
|
|
|
|
export const useShadows = create<any>((set: any) => ({
|
|
shadows: false,
|
|
setShadows: (x: any) => set(() => ({ shadows: x })),
|
|
}));
|
|
|
|
export const useSunPosition = create<any>((set: any) => ({
|
|
sunPosition: { x: undefined, y: undefined, z: undefined },
|
|
setSunPosition: (newSuntPosition: any) =>
|
|
set({ sunPosition: newSuntPosition }),
|
|
}));
|
|
|
|
export const useRemoveLayer = create<any>((set: any) => ({
|
|
removeLayer: false,
|
|
setRemoveLayer: (x: any) => set(() => ({ removeLayer: x })),
|
|
}));
|
|
|
|
export const useRemovedLayer = create<any>((set: any) => ({
|
|
removedLayer: null,
|
|
setRemovedLayer: (x: any) => set(() => ({ removedLayer: x })),
|
|
}));
|
|
|
|
export const useActiveLayer = create<any>((set: any) => ({
|
|
activeLayer: 1,
|
|
setActiveLayer: (x: any) => set({ activeLayer: x }),
|
|
}));
|
|
|
|
export const useResetCamera = create<any>((set: any) => ({
|
|
resetCamera: false,
|
|
setResetCamera: (x: any) => set({ resetCamera: x }),
|
|
}));
|
|
|
|
export const useAddAction = create<any>((set: any) => ({
|
|
addAction: null,
|
|
setAddAction: (x: any) => set({ addAction: x }),
|
|
}));
|
|
|
|
export const useActiveTool = create<any>((set: any) => ({
|
|
activeTool: "Cursor",
|
|
setActiveTool: (x: any) => set({ activeTool: x }),
|
|
}));
|
|
|
|
export const use2DUndoRedo = create<any>((set: any) => ({
|
|
is2DUndoRedo: null,
|
|
set2DUndoRedo: (x: any) => set({ is2DUndoRedo: x }),
|
|
}));
|
|
|
|
export const useElevation = create<any>((set: any) => ({
|
|
elevation: 45,
|
|
setElevation: (x: any) => set({ elevation: x }),
|
|
}));
|
|
|
|
export const useAzimuth = create<any>((set: any) => ({
|
|
azimuth: -160,
|
|
setAzimuth: (x: any) => set({ azimuth: x }),
|
|
}));
|
|
|
|
export const useRenderDistance = create<any>((set: any) => ({
|
|
renderDistance: 50,
|
|
setRenderDistance: (x: any) => set({ renderDistance: x }),
|
|
}));
|
|
|
|
export const useCamMode = create<any>((set: any) => ({
|
|
camMode: "ThirdPerson",
|
|
setCamMode: (x: any) => set({ camMode: x }),
|
|
}));
|
|
|
|
export const useUserName = create<any>((set: any) => ({
|
|
userName: "",
|
|
setUserName: (x: any) => set({ userName: x }),
|
|
}));
|
|
|
|
export const useObjectPosition = create<any>((set: any) => ({
|
|
objectPosition: { x: undefined, y: undefined, z: undefined },
|
|
setObjectPosition: (newObjectPosition: any) =>
|
|
set({ objectPosition: newObjectPosition }),
|
|
}));
|
|
|
|
export const useObjectScale = create<any>((set: any) => ({
|
|
objectScale: { x: undefined, y: undefined, z: undefined },
|
|
setObjectScale: (newObjectScale: any) => set({ objectScale: newObjectScale }),
|
|
}));
|
|
|
|
export const useObjectRotation = create<any>((set: any) => ({
|
|
objectRotation: { x: undefined, y: undefined, z: undefined },
|
|
setObjectRotation: (newObjectRotation: any) =>
|
|
set({ objectRotation: newObjectRotation }),
|
|
}));
|
|
|
|
export const useDrieTemp = create<any>((set: any) => ({
|
|
drieTemp: undefined,
|
|
setDrieTemp: (x: any) => set({ drieTemp: x }),
|
|
}));
|
|
|
|
export const useActiveUsers = create<any>((set: any) => ({
|
|
activeUsers: [],
|
|
setActiveUsers: (x: any) => set({ activeUsers: x }),
|
|
}));
|
|
|
|
export const useDrieUIValue = create<any>((set: any) => ({
|
|
drieUIValue: { touch: null, temperature: null, humidity: null },
|
|
|
|
setDrieUIValue: (x: any) =>
|
|
set((state: any) => ({ drieUIValue: { ...state.drieUIValue, ...x } })),
|
|
|
|
setTouch: (value: any) =>
|
|
set((state: any) => ({
|
|
drieUIValue: { ...state.drieUIValue, touch: value },
|
|
})),
|
|
setTemperature: (value: any) =>
|
|
set((state: any) => ({
|
|
drieUIValue: { ...state.drieUIValue, temperature: value },
|
|
})),
|
|
setHumidity: (value: any) =>
|
|
set((state: any) => ({
|
|
drieUIValue: { ...state.drieUIValue, humidity: value },
|
|
})),
|
|
}));
|
|
|
|
export const useDrawMaterialPath = create<any>((set: any) => ({
|
|
drawMaterialPath: false,
|
|
setDrawMaterialPath: (x: any) => set({ drawMaterialPath: x }),
|
|
}));
|
|
|
|
export const useSelectedActionSphere = create<any>((set: any) => ({
|
|
selectedActionSphere: undefined,
|
|
setSelectedActionSphere: (x: any) => set({ selectedActionSphere: x }),
|
|
}));
|
|
|
|
export const useSelectedPath = create<any>((set: any) => ({
|
|
selectedPath: undefined,
|
|
setSelectedPath: (x: any) => set({ selectedPath: x }),
|
|
}));
|
|
|
|
interface SimulationPathsStore {
|
|
simulationPaths: (Types.ConveyorEventsSchema | Types.VehicleEventsSchema)[];
|
|
setSimulationPaths: (
|
|
paths: (Types.ConveyorEventsSchema | Types.VehicleEventsSchema)[]
|
|
) => void;
|
|
}
|
|
|
|
export const useSimulationPaths = create<SimulationPathsStore>((set) => ({
|
|
simulationPaths: [],
|
|
setSimulationPaths: (paths) => set({ simulationPaths: paths }),
|
|
}));
|
|
|
|
export const useIsConnecting = create<any>((set: any) => ({
|
|
isConnecting: false,
|
|
setIsConnecting: (x: any) => set({ isConnecting: x }),
|
|
}));
|
|
|
|
export const useStartSimulation = create<any>((set: any) => ({
|
|
startSimulation: false,
|
|
setStartSimulation: (x: any) => set({ startSimulation: x }),
|
|
}));
|
|
export const usezoneTarget = create<any>((set: any) => ({
|
|
zoneTarget: [],
|
|
setZoneTarget: (x: any) => set({ zoneTarget: x }),
|
|
}));
|
|
export const usezonePosition = create<any>((set: any) => ({
|
|
zonePosition: [],
|
|
setZonePosition: (x: any) => set({ zonePosition: x }),
|
|
}));
|
|
|
|
interface EditPositionState {
|
|
Edit: boolean;
|
|
setEdit: (value: boolean) => void;
|
|
}
|
|
|
|
export const useEditPosition = create<EditPositionState>((set) => ({
|
|
Edit: false,
|
|
setEdit: (value) => set({ Edit: value }), // Properly updating the state
|
|
}));
|
|
|
|
export const useAsset3dWidget = create<any>((set: any) => ({
|
|
widgetSelect: "",
|
|
setWidgetSelect: (x: any) => set({ widgetSelect: x }),
|
|
}));
|
|
export const useWidgetSubOption = create<any>((set: any) => ({
|
|
widgetSubOption: "2D",
|
|
setWidgetSubOption: (x: any) => set({ widgetSubOption: x }),
|
|
}));
|