robossembler/webstudio
7
0
Fork 0
Code Issues 8 Pull requests Projects Releases Packages Wiki Activity Actions

progress

Browse source
This commit is contained in:
IDONTSUDO 2024-07-23 13:33:19 +03:00
parent d8b5018cb2
commit 318d0a7893
60 changed files with 746 additions and 524 deletions
Download patch file Download diff file Expand all files Collapse all files

10
ui/src/core/extensions/object.ts
View file

@ -1,7 +1,9 @@
/* eslint-disable no-extend-native */
export const ObjectExtensionsIsKeyExists = (obj: any, keys: string[]): boolean => {
return true;
};
// {"objectThatSticksName":"cube2","objectThatSticksNamePoints":[{"x":25,"y":4.987889622413917,"z":10.504078531217838}],"objectsToWhichItSticksName":"cube1","objectsToWhichItSticksPoints":[{"x":5,"y":3.0783236330074963,"z":1.1333166084347885}]}
export const ObjectIsNotEmpty = (obj: Object | undefined) => {
if (obj === undefined) {
return false;
}
return Object.keys(obj).length !== 0;
};

26
ui/src/core/hook/key_listner.tsx
View file

@ -1,26 +0,0 @@
import React from "react";
export const useKeyLister = (fn: Function) => {
// eslint-disable-next-line react-hooks/exhaustive-deps
const pressed = new Map();
const registerKeyPress = React.useCallback(
(event: KeyboardEvent, codes: string[], callBack: Function) => {
if (codes.hasIncludeElement(event.code)) {
pressed.addValueOrMakeCallback(event.code, event.type, (e) => {
if (Array.from(pressed.values()).equals(["keydown", "keydown"], false)) {
callBack();
}
});
}
},
[pressed]
);
React.useEffect(() => {
window.addEventListener("keyup", (e) => registerKeyPress(e, ["KeyQ", "KeyW"], () => fn));
window.addEventListener("keydown", (e) => registerKeyPress(e, ["KeyQ", "KeyW"], () => {}));
}, [fn, registerKeyPress]);
return [];
};

1
ui/src/core/model/camera_model.ts
View file

@ -9,6 +9,7 @@ export enum CameraTypes {
}
export class CameraModel implements Instance {
type = SceneModelsTypes.CAMERA;
jointType = 'fixed';
constructor(
public quaternion: number[],
public vector3: Vector3,

17
ui/src/core/model/core_vector3.ts
View file

@ -1,17 +0,0 @@
import { Vector3 } from "three";
export class CoreVector3 {
vector: Vector3;
constructor(vector: Vector3) {
this.vector = vector;
}
static divideLineIntoEqualSegments(beginPoint: Vector3, endPoint: Vector3, segments: number): Vector3[] {
return Number(segments)
.fromArray()
.map((el) => new Vector3().lerpVectors(beginPoint, endPoint, (el * 1) / segments));
}
add(vector: Vector3) {
return new CoreVector3(new Vector3(this.vector.x + vector.x, this.vector.y + vector.y, this.vector.z + vector.z));
}
}

2
ui/src/core/model/database_model.ts
View file

@ -1,3 +1,3 @@
export interface DatabaseModel {
export interface DatabaseModelId {
_id?: string;
}

26
ui/src/core/model/point_model.ts
View file

@ -4,6 +4,8 @@ import { SceneModelsTypes } from "./scene_models_type";
import { Instance } from "./scene_asset";
import { CoreThreeRepository } from "../repository/core_three_repository";
import { Type } from "class-transformer";
import { SceneItems, SceneMangerStore } from "../../features/scene_manager/presentation/scene_manager_store";
import { Pose } from "../../features/behavior_tree_builder/presentation/ui/forms/move_to_pose/move_to_pose_robot_model";
export class PointModel implements Instance {
type = SceneModelsTypes.POINT;
@ -11,7 +13,7 @@ export class PointModel implements Instance {
@Type(() => Vector3)
vector3: Vector3;
color: string = "#E91E63";
size: number = 0.5;
size: number = 0.01;
quaternion: number[];
icon: string = "Point";
@ -25,10 +27,30 @@ export class PointModel implements Instance {
this.color,
this.size
);
toSceneItems = (sceneMangerStore: SceneMangerStore): SceneItems => {
return {
fn: () => {},
name: this.name,
isSelected: false,
icon: this.icon,
};
};
toDependency = (): Pose => {
return {
name: this.name,
position: this.vector3,
orientation: {
x: this.quaternion[0],
y: this.quaternion[1],
z: this.quaternion[2],
w: this.quaternion[3],
},
};
};
isValid(): Result<string, PointModel> {
return Result.ok();
}
static empty() {
return new PointModel();
}

11
ui/src/core/model/robot_model.ts
View file

@ -16,7 +16,7 @@ interface RobotJoint {
lower: Number;
upper: Number;
};
angel: Number;
angle: Number;
name: string;
}
@ -50,24 +50,23 @@ export class RobotModel implements Instance {
icon: string = "Robot";
toSceneItems = (sceneMangerStore: SceneMangerStore): SceneItems => {
return {
fn: () => { },
fn: () => {},
name: this.name,
isSelected: false,
icon: "Robot",
};
};
toWebGl = (coreThreeRepository: CoreThreeRepository) => {
console.log(JSON.stringify(this));
coreThreeRepository.loadUrdfRobot(this);
};
update(coreThreeRepository: CoreThreeRepository): any {
update = (coreThreeRepository: CoreThreeRepository) => {
const robot = coreThreeRepository.scene.getObjectByName(this.name) as URDFRobot;
robot.position.copy(this.vector3);
robot.quaternion.copy(new Quaternion().fromArray(this.quaternion));
this.jointPosition.forEach((el) => {
robot.setJointValue(el.name, el.angel);
robot.setJointValue(el.name, el.angle);
});
}
};
isValid(): Result<string, RobotModel> {
return Result.ok(this);
}

26
ui/src/core/model/scene_asset.ts
View file

@ -9,8 +9,10 @@ import { ZoneModel } from "./zone_model";
import { CoreThreeRepository } from "../repository/core_three_repository";
import { LightModel } from "./light_model";
import { Vector3 } from "three";
import { SceneItems } from "../../features/scene_manager/presentation/scene_manager_store";
export abstract class Instance {
type: string;
abstract icon: string;
@Type(() => Vector3)
vector3: Vector3;
@ -21,6 +23,7 @@ export abstract class Instance {
}
export class SceneAsset {
name: string;
@IsArray()
@Type(() => Instance, {
discriminator: {
@ -37,4 +40,27 @@ export class SceneAsset {
keepDiscriminatorProperty: true,
})
scene: (Instance | SolidModel | CameraModel | RobotModel | PointModel | ZoneModel)[];
toSceneItems = (): SceneItems[] => {
return this.scene.map((el) => {
return {
fn: () => {},
name: el.name,
icon: el.icon,
isSelected: false,
};
});
};
getElementByName = <T>(name: string) => this.scene.filter((el) => el.name.isEqual(name)).at(0) as T;
getAllRobotsTopics = () => this.scene.filter((el) => el.type.isEqual(SceneModelsTypes.ROBOT)).map((el) => el.name);
getAllCameraTopics = () => {};
getAllPoints = () => this.scene.filter((el) => el.type.isEqual(SceneModelsTypes.POINT)).map((el) => el.name);
static newScene = (
scene: (Instance | SolidModel | CameraModel | RobotModel | PointModel | ZoneModel)[],
name: string
) => {
const sceneAsset = new SceneAsset();
sceneAsset.scene = scene;
sceneAsset.name = name;
return sceneAsset;
};
}

4
ui/src/core/model/skill_model.ts
View file

@ -198,7 +198,7 @@ export class SkillModel implements ISkill {
}
export class SkillDependency implements IDependency {
constructor(public skills: ISkillDependency[]) { }
constructor(public skills: ISkillDependency[]) {}
static empty() {
return new SkillDependency([]);
}
@ -320,7 +320,7 @@ export class Skills {
if (skill.sid?.isEqual(sid)) {
skill.BTAction.map((action) => {
action.param.map((param) => {
if (param.type.isEqual(skillType)) {
if (param.type.isEqualR(skillType)) {
acc.push(param.dependency);
}
return param;

58
ui/src/core/model/solid_model.ts
View file

@ -1,26 +1,68 @@
import { Quaternion, Scene, Vector3 } from "three";
import { Object3D, Object3DEventMap, Quaternion, Vector3 } from "three";
import { SceneModelsTypes } from "./scene_models_type";
import { Instance } from "./scene_asset";
import { CoreThreeRepository } from "../repository/core_three_repository";
import { Type } from "class-transformer";
import { SceneItems } from "../../features/scene_manager/presentation/scene_manager_store";
import { Parts } from "../../features/details/details_http_repository";
export class SolidModel implements Instance {
icon: string = "Solid";
type = SceneModelsTypes.SOLID;
@Type(() => Vector3)
public vector3: Vector3;
constructor(
vector3:Vector3,
vector3: Vector3,
public quaternion: number[],
public name: string,
public solidType: string,
public mesh: string,
public collisionMesh: string
public collisionMesh: string,
public spawnType: string
) {
this.vector3 = vector3
this.vector3 = vector3;
}
update = (coreThreeRepository: CoreThreeRepository) => this.toWebGl(coreThreeRepository)
icon: string = "Solid";
toWebGl = (coreThreeRepository: CoreThreeRepository) => coreThreeRepository.loader(this.mesh, () => {}, this.name);
toSceneItems = (): SceneItems => {
return {
fn: () => {},
name: this.name,
isSelected: false,
icon: "Solid",
};
};
static empty = () => new SolidModel(new Vector3(0, 0, 0), [], "", "", "", "");
update = (coreThreeRepository: CoreThreeRepository) => {
const object = coreThreeRepository.getObjectsAtName(this.name) as Object3D<Object3DEventMap>;
object.position.copy(this.vector3)
object.quaternion.copy(new Quaternion().fromArray(this.quaternion))
};
toWebGl = (coreThreeRepository: CoreThreeRepository) => {
this.spawnType.isEqualR("BoundBox").fold(
() =>
coreThreeRepository.loader(
this.mesh,
() => (
coreThreeRepository.raiseAnObjectAboveZeroVector(this.name),
(this.quaternion = coreThreeRepository.scene.getObjectByName(this.name)!.quaternion.toArray()),
(this.vector3 = coreThreeRepository.scene.getObjectByName(this.name)!.position)
),
this.name,
this.vector3
),
() => console.log("UNKNOWN SPAWN TYPE SOLID MODEL")
);
};
fromParts = (parts: Parts): SolidModel => {
const solidModel = SolidModel.empty();
solidModel.mesh = parts.daeUrl;
solidModel.name = parts.name;
solidModel.solidType = parts.solidType;
return solidModel;
};
static empty = () => new SolidModel(new Vector3(0, 0, 0), [], "", "", "", "", "");
}

4
ui/src/core/model/trigger_model.ts
View file

@ -1,6 +1,6 @@
import { DatabaseModel } from "./database_model";
import { DatabaseModelId } from "./database_model";
export interface ITriggerModel extends DatabaseModel {
export interface ITriggerModel extends DatabaseModelId {
type: string;
description: string;
value: string[];

36
ui/src/core/repository/babylon_repository.ts
View file

@ -1,36 +0,0 @@
// import { Scene, Engine, MeshBuilder, FreeCamera, HemisphericLight, Vector3, SceneLoader } from 'babylonjs';
// import { GLTFFileLoader } from 'babylonjs-loaders';
// export class BabylonRepository {
// engine: Engine;
// canvas: HTMLCanvasElement;
// scene: Scene;
// sceneLoader: SceneLoader
// constructor(canvas: HTMLCanvasElement) {
// this.sceneLoader = new SceneLoader();
// this.engine = new Engine(canvas, true);
// this.scene = new Scene(this.engine);
// this.engine.runRenderLoop(() => {
// this.scene.render();
// });
// this.scene.createDefaultCameraOrLight(true, true, true);
// new HemisphericLight("hemiLight", new Vector3(0, 1, 0));
// SceneLoader.RegisterPlugin(new GLTFFileLoader())
// SceneLoader.ImportMeshAsync("",
// "http://localhost:4001/1dfc4e1a-9c1a-4fa2-96b2-19c86acb6ea4/assets/libs/objects/",
// "sol_gear.glb", this.scene)
// }
// deleteAllObjectsScene = () => this.scene.meshes.forEach((el) => this.scene.removeMesh(el, true))
// loadHttp = (url: string) => {
// const divide = url.divideByIndex(url.lastIndexOf('/'))
// SceneLoader.ImportMeshAsync("",
// `${divide.at(0)}/`,
// `${divide.at(1)}`, this.scene).then((frame) => {
// });
// }
// }

32
ui/src/core/repository/core_three_repository.ts
View file

@ -34,7 +34,6 @@ import { TransformControls } from "three/examples/jsm/controls/TransformControls
import { SceneMode } from "../../features/scene_manager/model/scene_view";
import { UrdfTransforms, coordsToQuaternion } from "../../features/simulations/tranforms_model";
import { ISpawnHelper, SceneItems } from "../../features/scene_manager/presentation/scene_manager_store";
import { CameraModel } from "../model/camera_model";
import { SolidModel } from "../model/solid_model";
import { Instance, SceneAsset } from "../model/scene_asset";
import { ZoneModel } from "../model/zone_model";
@ -64,7 +63,6 @@ interface IEmissiveCache {
type SceneFrames = { [K in string]: URDFLink };
export class CoreThreeRepository extends TypedEvent<any> {
scene = new Scene();
camera: PerspectiveCamera;
webGlRender: WebGLRenderer;
@ -190,14 +188,18 @@ export class CoreThreeRepository extends TypedEvent<any> {
this.urdfLoader.load(robotModel.httpUrl, (robot) => {
robot.userData[UserData.selectedObject] = true;
robot.name = robotModel.name;
if (robotModel.vector3) robot.position.copy(new Vector3(0, 0, 0));
if (robotModel.vector3) robot.position.copy(robotModel.vector3);
if (robotModel.quaternion) robot.quaternion.copy(new Quaternion().fromArray(robotModel.quaternion));
// robot.setJointValue("ee_link_joint", 4);
if (robotModel.jointPosition.isNotEmpty()) {
robotModel.jointPosition.forEach((el) => {
robot.setJointValue(el.name, el.angle);
});
}
if (robotModel.jointPosition.isEmpty()) {
Object.entries(robot.joints).forEach(([name, uRDFJoint]) => {
if (uRDFJoint.jointType !== "fixed") {
robotModel.jointPosition.push({
angel: uRDFJoint.angle,
angle: uRDFJoint.angle,
limit: {
lower: uRDFJoint.limit.lower,
upper: uRDFJoint.limit.upper,
@ -208,8 +210,6 @@ export class CoreThreeRepository extends TypedEvent<any> {
});
}
// Object.entries(robot.joints).forEach(([k, v]) => robot.setJointValue(k, 1));
this.scene.add(robot);
// @ts-expect-error
@ -229,21 +229,6 @@ export class CoreThreeRepository extends TypedEvent<any> {
this.sceneFrame = robot.frames;
});
solidSpawn = (
solidSpawn: ISpawnHelper,
loadCallback?: (obj: Object3D<Object3DEventMap> | undefined) => void,
vector3?: Vector3
) =>
this.loader(
solidSpawn.url,
() => {
this.raiseAnObjectAboveZeroVector(solidSpawn.name);
if (loadCallback) loadCallback(this.scene.getObjectByName(solidSpawn.name));
},
solidSpawn.name,
vector3
);
loadHttpAndPreview(path: string, name: string, loadCallback?: Function) {
this.loader(
path,
@ -271,8 +256,6 @@ export class CoreThreeRepository extends TypedEvent<any> {
}
}
addSceneCamera = (cameraModel: CameraModel) => cameraModel.toWebGl(this);
updateSolidBody = (solidBodyModel: SolidModel) => {
const mesh = this.scene.getObjectByName(solidBodyModel.name);
mesh?.position.copy(solidBodyModel.vector3);
@ -445,6 +428,7 @@ export class CoreThreeRepository extends TypedEvent<any> {
if (position) result.scene.position.copy(position);
if (quaternion) result.scene.quaternion.copy(quaternion);
this.scene.add(result.scene);
callBack();
},
(err) => console.log(err)
);

7
ui/src/core/repository/http_repository.ts
View file

@ -2,6 +2,8 @@ import { ClassConstructor, plainToInstance } from "class-transformer";
import { Result } from "../helper/result";
import { Parts } from "../../features/details/details_http_repository";
import { UUID } from "../../features/all_projects/data/project_http_repository";
import { SceneModel } from "../../features/scene_manager/model/scene_model";
import { SceneAsset } from "../model/scene_asset";
export enum HttpMethod {
GET = "GET",
@ -100,7 +102,12 @@ export class CoreHttpRepository extends HttpRepository {
getAssetsActiveProject = async (): Promise<Result<HttpError, Parts[]>> => {
return this._jsonRequest<Parts[]>(HttpMethod.GET, "/projects/assets");
};
getSceneAsset = (id: string) =>
this._jsonToClassInstanceRequest(HttpMethod.GET, `/scenes/by_id?id=${id}`, SceneAsset) as Promise<
Result<HttpError, SceneAsset>
>;
async getActiveProjectId() {
return this._jsonRequest<UUID>(HttpMethod.GET, "/projects/get/active/project/id");
}
getAllScenes = () => this._jsonRequest<SceneModel[]>(HttpMethod.GET, "/scenes");
}

4
ui/src/core/store/base_store.ts
View file

@ -118,7 +118,7 @@ export abstract class FormState<V, E> extends UiErrorState<E> {
//@ts-ignore
this.viewModel = Object.assign(this.viewModel, value);
}
loadDependency = (viewModel: V) => {
this.viewModel = viewModel;
loadDependency = (viewModel: V | undefined) => {
if (viewModel) this.viewModel = viewModel;
};
}

1
ui/src/core/ui/form_builder/form_builder.tsx
View file

@ -51,6 +51,7 @@ export const FormBuilder = observer((props: IFormBuilder) => {
);
}
if (element.type.isEqual(InputType.ARRAY)) {
return (
<div style={{ border: "1px black solid", margin: 20 }}>
<div

30
ui/src/core/ui/toggle/toggle.tsx Normal file
View file

@ -0,0 +1,30 @@
import { useState } from "react";
import { Icon } from "../icons/icons";
import { CoreText, CoreTextType } from "../text/text";
import { set } from "ts-pattern/dist/patterns";
interface IToggleProps {
name: string;
child: React.ReactNode;
isOpen: boolean;
}
export const Toggle = (props: IToggleProps) => {
const [isOpen, setOpen] = useState(props.isOpen);
return (
<div style={{ border: "1px black solid" }}>
<div
style={{
display: "flex",
justifyContent: "space-between",
margin: 0,
padding:5,
alignItems: "center",
}}
onClick={() => setOpen(!isOpen)}
>
<CoreText style={{ height: 33 }} text={props.name} type={CoreTextType.large} />
<Icon type="PlusCircle" style={{ width: 33 }} />
</div>
{isOpen ? props.child : <></>}
</div>
);
};

1
ui/src/features/behavior_tree_builder/data/behavior_tree_builder_repository.ts
View file

@ -5,6 +5,7 @@ import { BehaviorTreeModel } from "../model/behavior_tree_model";
import { BehaviorTreeViewModel } from "../model/behavior_tree_view_model";
export class BehaviorTreeBuilderHttpRepository extends CoreHttpRepository {
getAllBtInstances = async () => this._jsonRequest<BehaviorTreeModel[]>(HttpMethod.GET, "/behavior/trees");
getBtSkills = async (): Promise<Result<HttpError, Skills>> => {
return (await this._jsonToClassInstanceRequest<Skills>(

15
ui/src/features/behavior_tree_builder/model/behavior_tree_model.ts
View file

@ -3,12 +3,15 @@ import { Result } from "../../../core/helper/result";
import { Skills } from "../../../core/model/skill_model";
import { NodeBehaviorTree } from "./node_behavior_tree";
import { IsOptional } from "class-validator";
import { BehaviorTreeBuilderHttpRepository } from "../data/behavior_tree_builder_repository";
import { message } from "antd";
export class BehaviorTreeModel {
@IsOptional()
@Type(() => Skills)
public sceneId: string;
public skills?: Skills;
public scene: NodeBehaviorTree[];
public scene: NodeBehaviorTree[] = [];
public xml: string;
public name: string;
public project: string;
@ -26,6 +29,16 @@ export class BehaviorTreeModel {
this.scene = scene;
this.xml = xml;
}
getSceneDependency = async (behaviorTreeBuilderHttpRepository: BehaviorTreeBuilderHttpRepository) =>
(await behaviorTreeBuilderHttpRepository.getSceneAsset(this.sceneId)).fold(
(s) => {
},
(e) => {
message.error('Get Scene Dependency error')
}
);
static empty() {
return new BehaviorTreeModel(Skills.empty(), [], "", "", "", "");
}

6
ui/src/features/behavior_tree_builder/model/behavior_tree_view_model.ts
View file

@ -1,11 +1,11 @@
import { Result } from "../../../core/helper/result";
export class BehaviorTreeViewModel {
constructor(public name: string, public project: string) {}
constructor(public name: string, public project: string, public sceneId: string) {}
static empty() {
return new BehaviorTreeViewModel("", "");
return new BehaviorTreeViewModel("", "", "");
}
valid(): Result<string, BehaviorTreeViewModel> {
if (this.project.isEmpty()) {
return Result.error("project is empty");

28
ui/src/features/behavior_tree_builder/model/editor_view.ts
View file

@ -25,6 +25,8 @@ export interface IUpdateEvent {
export class NodeRerenderObserver extends TypedEvent<IUpdateEvent> {}
export class ReteForceUpdateObserver extends TypedEvent<any> {}
export class BehaviorTreeBuilderModel {
public static btRootTag: string = '<root BTCPP_format="4"><BehaviorTree ID="Main">${bt}</BehaviorTree></root>';
public static result = "";
static fromReteScene(
editor: NodeEditor<Schemes>,
@ -33,8 +35,6 @@ export class BehaviorTreeBuilderModel {
): Result<string, string> {
try {
this.result = "";
// eslint-disable-next-line array-callback-return
this.getFirstSequence(editor).map((sortedSequence) => {
const firstNodeId = sortedSequence.getKeyFromValueIsExists(1) as string;
this.findSequence(firstNodeId, editor, sortedSequence, 2);
@ -42,25 +42,7 @@ export class BehaviorTreeBuilderModel {
this.toXML(sortedSequence as Map<string, number>, editor, area, firstNodeId, skills);
this.result += `</${this.getNodeLabelAtId(editor, firstNodeId, skills)}>`;
});
return Result.ok(
xmlFormat(`<?xml version="1.0" encoding="UTF-8"?>
<root main_tree_to_execute="Main">
<BehaviorTree ID="Main">
${this.result}
</BehaviorTree>
<TreeNodesModel>
<Action ID="RbsBtAction">
<input_port name="do" />
<input_port name="command" />
<input_port name="server_name" />
<input_port name="server_timeout" />
</Action>
</TreeNodesModel>
</root>`)
);
return Result.ok(xmlFormat(this.btRootTag.replace("${bt}", this.result)));
} catch (error) {
return Result.error("BtBuilderModel fromReteScene error");
}
@ -68,9 +50,9 @@ export class BehaviorTreeBuilderModel {
public static getNodeLabelAtId(editor: NodeEditor<Schemes>, id: string, skills?: Skills) {
if (skills?.getSkillsNames().find((el) => el.name.isEqual(editor.getNode(id).label))) {
return `Action ID="RbsBtAction" do="${skills.getSkillDo(editor.getNode(id).label)}" command="${
return `Action ID="RbsAction" do="${skills.getSkillDo(editor.getNode(id).label)}" command="${
editor.getNode(id).label
}" sid=${id} server_name="rbs_interface" server_timeout="1000"`;
}" sid=${id}"`;
}
return editor.getNode(id).label;
}

15
ui/src/features/behavior_tree_builder/presentation/behavior_tree_builder_screen.tsx
View file

@ -13,6 +13,7 @@ import { CoreInput } from "../../../core/ui/input/input";
import { CoreText, CoreTextType } from "../../../core/ui/text/text";
import { useNavigate, useParams } from "react-router-dom";
import { IForms, forms } from "./ui/forms/forms";
import { CoreSelect } from "../../../core/ui/select/select";
export const behaviorTreeBuilderScreenPath = "behavior/tree/screen/path";
export interface DOMReact {
@ -131,6 +132,14 @@ export const BehaviorTreeBuilderScreen = observer(() => {
<div style={{ display: "flex", flexDirection: "column", justifyContent: "space-between", height: "100%" }}>
<div>
<CoreInput label="Имя дерева" onChange={(text) => store.updateForm({ name: text })} />
<CoreSelect
items={store.scenes?.map((el) => el.name) ?? []}
value={""}
label={"Сцена"}
onChange={(text) =>
store.updateForm({ sceneId: store.scenes?.filter((el) => el.name.isEqual(text)).at(0)?._id })
}
/>
</div>
<div style={{ display: "flex" }}>
<CoreButton text="Сохранить" filled={true} onClick={() => store.createNewBehaviorTree()} />
@ -150,10 +159,11 @@ export const BehaviorTreeBuilderScreen = observer(() => {
{store.skillTemplates?.getForms(store.selected ?? "").map((formType, index) =>
forms(
store.filledOutTemplates?.getDependencyBySkillLabelAndType(
forms(null, () => {}).find((form) => form.name.isEqual(formType))?.name ?? "",
forms(null, () => {}, store).find((form) => form.name.isEqual(formType))?.name ?? "",
store.selectedSid ?? ""
),
(dependency) => store.formUpdateDependency(dependency, formType)
(dependency) => store.formUpdateDependency(dependency, formType),
store
)
.rFind<IForms>((form) => form.name.isEqual(formType))
.fold(
@ -169,4 +179,3 @@ export const BehaviorTreeBuilderScreen = observer(() => {
/>
);
});

51
ui/src/features/behavior_tree_builder/presentation/behavior_tree_builder_store.tsx
View file

@ -24,7 +24,8 @@ import { behaviorTreeBuilderStore } from "./behavior_tree_builder_screen";
import clone from "just-clone";
import { BehaviorTreeModel } from "../model/behavior_tree_model";
import { PrimitiveViewModel, SystemPrimitive } from "../model/primitive_view_model";
import { SceneModel } from "../../scene_manager/model/scene_model";
import { SceneAsset } from "../../../core/model/scene_asset";
interface I2DArea {
x: number;
@ -43,10 +44,11 @@ export enum StoreUIType {
ViewBehaviorTree,
}
export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeViewModel, CoreError> {
type: StoreUIType = StoreUIType.ViewBehaviorTree;
sceneAsset?: SceneAsset;
viewModel: BehaviorTreeViewModel = BehaviorTreeViewModel.empty();
scenes?: SceneModel[];
behaviorTreeModel: BehaviorTreeModel = BehaviorTreeModel.empty();
skillTemplates: Skills = Skills.empty();
filledOutTemplates: Skills = Skills.empty();
@ -74,7 +76,6 @@ export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeView
name: "Действия",
children: [],
},
],
};
@ -83,8 +84,8 @@ export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeView
makeAutoObservable(this);
this.type = StoreUIType.SelectBehaviorTree;
this.primitiveViewModel = new PrimitiveViewModel()
this.skillTree.children?.push({ name: "Примитивы BT", children: this.primitiveViewModel.toSkillView() })
this.primitiveViewModel = new PrimitiveViewModel();
this.skillTree.children?.push({ name: "Примитивы BT", children: this.primitiveViewModel.toSkillView() });
}
syncScene = async (editor: NodeEditor<Schemes>, area: AreaPlugin<Schemes, AreaExtra>) => {
@ -92,7 +93,7 @@ export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeView
this.areaPlugin = area;
};
errorHandingStrategy = (_: CoreError) => { };
errorHandingStrategy = (_: CoreError) => {};
dragEnd = (e: EventTarget) => {
if (this.canRun) {
@ -123,8 +124,7 @@ export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeView
if (!name.isEqualMany(Object.keys(SystemPrimitive))) {
this.skillTemplates?.getSkill(name).fold(
(m) => {
const model = clone(m);
const modelSetId = model.setSid(sid);
const modelSetId = clone(m).setSid(sid);
modelSetId.BTAction = m.BTAction.filter((el) => el.name.isEqual(name));
this.filledOutTemplates?.skills.push(modelSetId);
@ -150,6 +150,7 @@ export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeView
}
return el;
});
// this.sceneAsset = this.behaviorTreeBuilderHttpRepository.getScene()
},
(e) => console.log(e)
);
@ -180,16 +181,22 @@ export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeView
this.type = StoreUIType.ViewBehaviorTree;
if (id) {
(await this.behaviorTreeBuilderHttpRepository.getBtById(id)).fold(
(model) => {
async (model) => {
this.nodeBehaviorTree = model.scene;
this.behaviorTreeModel = model;
if (model.skills) this.filledOutTemplates = model.skills;
await this.mapOk("sceneAsset", this.behaviorTreeBuilderHttpRepository.getSceneAsset(model.sceneId));
this.isLoading = false;
this.reteForceUpdateObserver?.emit("");
},
() => this.errors.push(new UiBaseError(`не найдено дерево с id:${id}`))
async () => {
this.errors.push(new UiBaseError(`не найдено дерево с id:${id}`));
}
);
} else {
await this.mapOk("scenes", this.behaviorTreeBuilderHttpRepository.getAllScenes());
this.type = StoreUIType.SelectBehaviorTree;
}
};
@ -202,8 +209,8 @@ export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeView
};
}
dispose(): void {
document.removeEventListener("keyup", () => { });
document.removeEventListener("keydown", () => { });
document.removeEventListener("keyup", () => {});
document.removeEventListener("keydown", () => {});
}
onClickSaveBehaviorTree = async (): Promise<void> => {
this.filledOutTemplates.validation().fold(
@ -233,7 +240,7 @@ export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeView
async () => message.error(`Дерево поведения не заполнено`)
);
};
validateBt() { }
validateBt() {}
createNewBehaviorTree = async () => {
this.viewModel.project = this.activeProject;
this.viewModel.valid().fold(
@ -282,7 +289,6 @@ export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeView
});
this.filledOutTemplates.updateSkill(model);
console.log(this.filledOutTemplates)
},
() => console.log("UNKNOWN SID: " + this.selectedSid)
);
@ -319,9 +325,12 @@ export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeView
</div>
);
}
isFilledInput = (type: string, sid: string): boolean => this.filledOutTemplates?.dependencyIsFilled(type, sid);
isFilledInput = (type: string, sid: string): boolean => {
console.log(this.filledOutTemplates?.dependencyIsFilled)
return this.filledOutTemplates?.dependencyIsFilled(type, sid) ?? false;
};
getInputs(name: string) {
const result = this.primitiveViewModel.getPrimitiveAtLabel(name)
const result = this.primitiveViewModel.getPrimitiveAtLabel(name);
if (result) {
return {
input: result.input ? "a" : null,
@ -329,13 +338,12 @@ export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeView
};
}
return {
input: 'a',
output: null
}
input: "a",
output: null,
};
}
getStylesByLabelNode(label: string): React.CSSProperties | undefined {
const result = this.primitiveViewModel.getPrimitiveAtLabel(label)
const result = this.primitiveViewModel.getPrimitiveAtLabel(label);
if (result) {
return clone(result.css as Object);
}
@ -357,4 +365,5 @@ export class BehaviorTreeBuilderStore extends UiDrawerFormState<BehaviorTreeView
background: "rgba(153, 195, 234, 1)",
};
}
changeSceneViewModel = (text: string) => {};
}

1
ui/src/features/behavior_tree_builder/presentation/ui/editor/editor.tsx
View file

@ -14,6 +14,7 @@ import {
UpdateEvent,
} from "../../../model/editor_view";
import { v4 } from "uuid";
import constructWithOptions from "styled-components/dist/constructors/constructWithOptions";
export type Schemes = GetSchemes<ClassicPreset.Node, ClassicPreset.Connection<ClassicPreset.Node, ClassicPreset.Node>>;
export type AreaExtra = ReactArea2D<Schemes>;

18
ui/src/features/behavior_tree_builder/presentation/ui/forms/forms.tsx
View file

@ -1,10 +1,13 @@
import { BehaviorTreeBuilderStore } from "../../behavior_tree_builder_store";
import { CameraDeviceForm } from "./camera_device_form/camera_device_form_form";
import { MoveToPose } from "./move_to_pose/move_to_pose_form";
import { RobotDeviceForm } from "./robot_device_form/robot_device_form_form";
import { TopicsForm } from "./topics_form/topics_form";
import { WeightsForm } from "./weights_form/weights_form";
export interface IPropsForm<T> {
dependency: T;
store: BehaviorTreeBuilderStore;
onChange: (dependency: Object) => void;
}
@ -17,10 +20,17 @@ export enum Form {
robotName = "robot_name",
cameraDeviceForm = "camera",
topic = "topic",
moveToPose = "move_to_pose",
}
export const forms = (props: any, onChange: (dependency: Object) => void): IForms[] => [
export const forms = (
props: any,
onChange: (dependency: Object) => void,
store: BehaviorTreeBuilderStore
): IForms[] => [
{ name: Form.weights, component: <WeightsForm dependency={props} onChange={onChange} /> },
{ name: Form.robotName, component: <RobotDeviceForm dependency={props} onChange={onChange} /> },
{ name: Form.cameraDeviceForm, component: <CameraDeviceForm dependency={props} onChange={onChange} /> },
{ name: Form.topic, component: <TopicsForm dependency={props} onChange={onChange} /> },
{ name: Form.robotName, component: <RobotDeviceForm store={store} dependency={props} onChange={onChange} /> },
{ name: Form.cameraDeviceForm, component: <CameraDeviceForm store={store} dependency={props} onChange={onChange} /> },
{ name: Form.topic, component: <TopicsForm store={store} dependency={props} onChange={onChange} /> },
{ name: Form.moveToPose, component: <MoveToPose store={store} dependency={props} onChange={onChange} /> },
];

48
ui/src/features/behavior_tree_builder/presentation/ui/forms/move_to_pose/move_to_pose_form.tsx Normal file
View file

@ -0,0 +1,48 @@
import React from "react";
import { observer } from "mobx-react-lite";
import { MoveToPoseStore } from "./move_to_pose_store";
import { IPropsForm } from "../forms";
import { MoveToPoseRobotModel } from "./move_to_pose_robot_model";
import { CoreSelect } from "../../../../../../core/ui/select/select";
import { PointModel } from "../../../../../../core/model/point_model";
import { ObjectIsNotEmpty } from "../../../../../../core/extensions/object";
import { CoreButton } from "../../../../../../core/ui/button/button";
import { message } from "antd";
export const MoveToPose = observer((props: IPropsForm<MoveToPoseRobotModel | undefined>) => {
const [store] = React.useState(() => new MoveToPoseStore(props.store));
React.useEffect(() => {
if (ObjectIsNotEmpty(props.dependency)) store.loadDependency(props.dependency);
store.init();
}, [store]);
return (
<div>
<CoreSelect
items={props.store.sceneAsset?.getAllRobotsTopics() ?? ["ERROR"]}
value={store.viewModel.robot_name ?? ""}
label={"Робот"}
onChange={(text) => store.updateForm({ robot_name: text })}
/>
<CoreSelect
items={props.store.sceneAsset?.getAllPoints() ?? ["ERROR"]}
label={"Точка"}
onChange={(text) =>
store.updateForm({ pose: props.store.sceneAsset?.getElementByName<PointModel>(text).toDependency() })
}
value={store.viewModel?.pose?.name ?? ""}
/>
<CoreButton
style={{ margin: 10, width: 100 }}
text="OK"
onClick={() => {
store.viewModel.valid().fold(
(s) => {
props.onChange(s);
},
(e) => message.error(e)
);
}}
/>
</div>
);
});

44
ui/src/features/behavior_tree_builder/presentation/ui/forms/move_to_pose/move_to_pose_robot_model.ts Normal file
View file

@ -0,0 +1,44 @@
import { Vector3 } from "three";
import { Result } from "../../../../../../core/helper/result";
export interface IMoveToPoseRobotModel {
robot_name: string;
pose: Pose;
}
export interface Pose {
name: string;
position: Vector3;
orientation: Orientation;
}
export interface Orientation {
x: number;
y: number;
z: number;
w: number;
}
export class MoveToPoseRobotModel implements IMoveToPoseRobotModel {
robot_name: string;
pose: Pose;
constructor() {}
valid(): Result<string, MoveToPoseRobotModel> {
return Result.ok(this);
}
static empty() {
const moveToPoseRobotModel = new MoveToPoseRobotModel();
moveToPoseRobotModel.robot_name = "";
moveToPoseRobotModel.pose = {
name: "",
position: new Vector3(0, 0, 0),
orientation: {
x: 0,
y: 0,
z: 0,
w: 0,
},
};
return moveToPoseRobotModel;
}
}

18
ui/src/features/behavior_tree_builder/presentation/ui/forms/move_to_pose/move_to_pose_store.ts Normal file
View file

@ -0,0 +1,18 @@
import makeAutoObservable from "mobx-store-inheritance";
import { NavigateFunction } from "react-router-dom";
import { MoveToPoseRobotModel } from "./move_to_pose_robot_model";
import { FormState, CoreError } from "../../../../../../core/store/base_store";
import { BehaviorTreeBuilderStore } from "../../../behavior_tree_builder_store";
export class MoveToPoseStore extends FormState<MoveToPoseRobotModel, CoreError> {
behaviorTreeBuilderStore: BehaviorTreeBuilderStore;
constructor(behaviorTreeBuilderStore: BehaviorTreeBuilderStore) {
super();
this.behaviorTreeBuilderStore = behaviorTreeBuilderStore;
makeAutoObservable(this);
}
viewModel: MoveToPoseRobotModel = MoveToPoseRobotModel.empty();
errorHandingStrategy = (error: CoreError) => {};
init = async (navigate?: NavigateFunction | undefined) => {};
}

97
ui/src/features/scene_manager/data/scene_http_repository.ts
View file

@ -1,105 +1,16 @@
import { plainToInstance } from "class-transformer";
import { Result } from "../../../core/helper/result";
import { HttpMethod, CoreHttpRepository } from "../../../core/repository/http_repository";
import { HttpMethod, CoreHttpRepository, HttpError } from "../../../core/repository/http_repository";
import { CoreError } from "../../../core/store/base_store";
import { SceneModel } from "../model/scene_model";
import { SceneViewModel } from "../model/scene_view_model";
import { SceneAsset } from "../../../core/model/scene_asset";
export class SceneHttpRepository extends CoreHttpRepository {
getScene = () => {
return plainToInstance(SceneAsset, {
scene: [
// {
// quaternion: [0, 0, 0, 1],
// vector3: { x: 1, y: 1, z: 1 },
// name: "body_down",
// solidType: "active",
// mesh: "http://localhost:4001/d370204b-205b-44bb-9698-3bf083b4b7a7/assets/libs/objects/body_down.dae",
// collisionMesh: "http://localhost:4001/d370204b-205b-44bb-9698-3bf083b4b7a7/assets/libs/objects/body_down.dae",
// type: "SOLID",
// },
// {
// quaternion: [0.3797976276673656, 0.5269410603416079, 0.6168038601812418, 0.44456706919183975],
// vector3: { x: 60, y: 20.000000000000004, z: 9.999999999999993 },
// name: "231",
// cameraType: "RGB",
// width: 0,
// updateRate: 0,
// fov: 50,
// near: 0.1,
// far: 2000,
// height: 0,
// topic: "231",
// type: "CAMERA",
// aspect: 0.48721804511278194,
// },
editScene = (scene: SceneAsset) => this._jsonRequest(HttpMethod.PUT, "/scenes", scene);
// {
// type: "POINT",
// name: "POINT 1",
// quaternion: [0, 0, 0, 1],
// vector3: { x: 0.504300334422403, y: 0.66062343475878, z: 1 },
// },
// {
// type: "ZONE",
// name: "ZONE 1",
// quaternion: [0, 0, 0, 1],
// vector3: { x: 0, y: 0, z: 0 },
// width: 100,
// height: 100,
// length: 10,
// },
{
quaternion: [0, 0, 0, 1],
vector3: { x: 0, y: 10, z: 0 },
name: "ARM0",
nDof: 6,
httpUrl: "http://localhost:4001/d370204b-205b-44bb-9698-3bf083b4b7a7/robots/124/robot.xml",
toolType: "",
jointPosition: [],
type: "ROBOT",
},
// {
// type: "LIGHT",
// name:"light1S",
// typeLight: "SPOT",
// color: "0xffffff",
// intensity: 100,
// distance: 100,
// angle: 100,
// penumbra: 100,
// decay: 100,
// quaternion: [0, 0, 0, 1],
// vector3: { x: 0, y: 0, z: 0 },
// },
// {
// type: "LIGHT",
// name:"light1P",
// typeLight: "POINT",
// color: "0xffffff",
// intensity: 100,
// distance: 100,
// decay: 100,
// quaternion: [0, 0, 0, 1],
// vector3: { x: 0, y: 0, z: 0 },
// },
// {
// name:"light1D",
// type: "LIGHT",
// typeLight: "DIRECTIONAL",
// color: "0xffffff",
// intensity: 100,
// quaternion: [0, 0, 0, 1],
// vector3: { x: 0, y: 0, z: 0 },
// },
],
});
};
getAllScenes = () => this._jsonRequest<SceneModel[]>(HttpMethod.GET, "/scenes");
newScene = (sceneViewModel: SceneViewModel) =>
this._jsonRequest(HttpMethod.POST, "/scenes", sceneViewModel) as unknown as Promise<Result<CoreError, void>>;
}
}

144
ui/src/features/scene_manager/presentation/components/coords_form.tsx
View file

@ -1,59 +1,105 @@
import { FormState } from "../../../../core/store/base_store";
import { CoreInput } from "../../../../core/ui/input/input";
import { CoreText, CoreTextType } from "../../../../core/ui/text/text";
import { Toggle } from "../../../../core/ui/toggle/toggle";
export const CoordsForm = ({ store, update }: { store: FormState<any, any>; update: Function }) => {
return (
<>
<CoreText text="Координаты" type={CoreTextType.header} />
<CoreInput
value={String(store.viewModel.vector3.x)}
label="Вектор X"
onChange={(text) => {
store.updateForm({ vector3: store.viewModel.vector3.setX(Number(text)) });
update();
}}
/>
<CoreInput
value={String(store.viewModel.vector3.x)}
label="Вектор Y"
onChange={(text) => {
store.updateForm({ vector3: store.viewModel.vector3.setY(Number(text)) });
update();
}}
/>
<CoreInput
value={String(store.viewModel.vector3.x)}
label="Вектор Z"
onChange={(text) => {
store.updateForm({ vector3: store.viewModel.vector3.setZ(Number(text)) });
update();
}}
/>
<CoreText text="Координаты" type={CoreTextType.header} />
<CoreInput
value={String(store.viewModel.vector3.x)}
label="Вектор X"
onChange={(text) => {
store.updateForm({ vector3: store.viewModel.vector3.setX(Number(text)) });
update();
}}
/>
<CoreInput
value={String(store.viewModel.vector3.x)}
label="Вектор Y"
onChange={(text) => {
store.updateForm({ vector3: store.viewModel.vector3.setY(Number(text)) });
update();
}}
/>
<CoreInput
value={String(store.viewModel.vector3.x)}
label="Вектор Z"
onChange={(text) => {
store.updateForm({ vector3: store.viewModel.vector3.setZ(Number(text)) });
update();
}}
<Toggle
name={"Координаты"}
child={
<div style={{margin:10}}>
<CoreText text="Позиция" type={CoreTextType.header} />
<CoreInput
value={String(store.viewModel.vector3.x)}
label="X"
onChange={(text) => {
store.updateForm({ vector3: store.viewModel.vector3.setX(Number(text)) });
update();
}}
/>
<CoreInput
value={String(store.viewModel.vector3.x)}
label="Y"
onChange={(text) => {
store.updateForm({ vector3: store.viewModel.vector3.setY(Number(text)) });
update();
}}
/>
<CoreInput
value={String(store.viewModel.vector3.x)}
label="Z"
onChange={(text) => {
store.updateForm({ vector3: store.viewModel.vector3.setZ(Number(text)) });
update();
}}
/>
<CoreText text="Кватернион" type={CoreTextType.header} />
<CoreInput
value={String(store.viewModel.quaternion[0])}
label="X"
onChange={(text) => {
store.updateForm({
quaternion: store.viewModel.quaternion.map((el: any, i: number) => {
if (i === 1) {
return Number(text);
}
return el;
}),
});
update();
}}
/>
<CoreInput
value={String(store.viewModel.quaternion[1])}
label="Y"
onChange={(text) => {
store.updateForm({
quaternion: store.viewModel.quaternion.map((el: any, i: number) => {
if (i === 2) {
return Number(text);
}
return el;
}),
});
update();
}}
/>
<CoreInput
value={String(store.viewModel.quaternion[2])}
label="Z"
onChange={(text) => {
store.updateForm({
quaternion: store.viewModel.quaternion.map((el: any, i: number) => {
if (i === 3) {
return Number(text);
}
return el;
}),
});
update();
}}
/>
<CoreInput
value={String(store.viewModel.quaternion[3])}
label="W"
onChange={(text) => {
store.updateForm({
quaternion: store.viewModel.quaternion.map((el: any, i: number) => {
if (i === 4) {
return Number(text);
}
return el;
}),
});
update();
}}
/>
</div>
}
isOpen={false}
/>
</>
);

22
ui/src/features/scene_manager/presentation/forms/camera/camera_form.tsx
View file

@ -1,17 +1,13 @@
import React from "react";
import { message } from "antd";
import { CoreButton } from "../../../../../core/ui/button/button";
import { IDefaultSceneManagerFormProps, isPreviewMode } from "../scene_manager_forms";
import { CoreInput } from "../../../../../core/ui/input/input";
import { CoreText, CoreTextType } from "../../../../../core/ui/text/text";
import { CoreSelect } from "../../../../../core/ui/select/select";
import { CameraFormStore } from "./camera_store";
import { Loader } from "../../../../../core/ui/loader/loader";
import { observer } from "mobx-react-lite";
import { CameraTypes } from "../../../../../core/model/camera_model";
export const CameraForm = observer((props: IDefaultSceneManagerFormProps) => {
const [store] = React.useState(() => new CameraFormStore(props.store));
@ -67,19 +63,13 @@ export const CameraForm = observer((props: IDefaultSceneManagerFormProps) => {
onChange={(text) => store.updateForm({ cameraType: text as CameraTypes })}
/>
<div style={{ height: 10 }} />
<CoreButton
text="Создать"
style={{ width: 96 }}
onClick={() => {
store.viewModel.validate().fold(
(model) => {
props.store.addNewCamera(model);
},
(error) => message.error(error)
);
}}
/>
{store.type !== "preview" ? (
<CoreButton text="Создать" style={{ width: 96 }} onClick={() => store.clickNewCamera()} />
) : null}
<div style={{ height: 50 }} />
</div>
);
});

11
ui/src/features/scene_manager/presentation/forms/camera/camera_store.tsx
View file

@ -4,6 +4,7 @@ import { FormState, CoreError } from "../../../../../core/store/base_store";
import { SceneMangerStore } from "../../scene_manager_store";
import { isPreviewMode } from "../scene_manager_forms";
import { CameraModel } from "../../../../../core/model/camera_model";
import { message } from "antd";
export class CameraFormStore extends FormState<CameraModel, CoreError> {
viewModel: CameraModel = CameraModel.empty();
@ -18,6 +19,16 @@ export class CameraFormStore extends FormState<CameraModel, CoreError> {
errorHandingStrategy = (error: CoreError) => {};
updateCameraScene = () =>
this.type?.isNotEmptyR().map(() => this.viewModel.toWebGl(this.sceneMangerStore.coreThreeRepository!));
clickNewCamera = () =>
this.viewModel.validate().fold(
(model) => {
this.sceneMangerStore.addNewCamera(model);
this.sceneMangerStore.activeFormType = undefined;
this.sceneMangerStore.visibleSaveButton()
},
(error) => message.error(error)
);
init = async (navigate?: NavigateFunction | undefined) => {
isPreviewMode(this.sceneMangerStore.activeFormDependency).map(() =>

26
ui/src/features/scene_manager/presentation/forms/point/point_form.tsx
View file

@ -7,11 +7,15 @@ import { CoreInput } from "../../../../../core/ui/input/input";
import { CoreButton } from "../../../../../core/ui/button/button";
import { match } from "ts-pattern";
import { SpawnPositionTypesForm } from "../../components/spawn_position_types";
import { CoordsForm } from "../../components/coords_form";
export const PointForm = observer((props: IDefaultSceneManagerFormProps) => {
const [store] = React.useState(() => new PointStore(props.store));
React.useEffect(() => {
store.init();
return () => {
store.dispose();
};
}, [store]);
return (
@ -21,22 +25,7 @@ export const PointForm = observer((props: IDefaultSceneManagerFormProps) => {
<>
<CoreText text="Точка" type={CoreTextType.header} />
<CoreText text={store.viewModel.name} type={CoreTextType.medium} />
<CoreText text="Позиция" type={CoreTextType.header} />
<CoreInput
label="X"
value={String(store.viewModel.vector3.x)}
onChange={(text) => (store.updateForm({ vector3: store.viewModel.vector3.setX(Number(text)) }), store.updateWebGl())}
/>
<CoreInput
label="Y"
value={String(store.viewModel.vector3.y)}
onChange={(text) => (store.updateForm({ vector3: store.viewModel.vector3.setY(Number(text)) }),store.updateWebGl())}
/>
<CoreInput
label="Z"
value={String(store.viewModel.vector3.z)}
onChange={(text) => (store.updateForm({ vector3: store.viewModel.vector3.setZ(Number(text)) }), store.updateWebGl())}
/>
<CoordsForm store={store} update={store.updateWebGl} />
</>
))
.with(PointStoreType.initNewPoint, () => (
@ -54,6 +43,11 @@ export const PointForm = observer((props: IDefaultSceneManagerFormProps) => {
<SpawnPositionTypesForm onClick={store.selectSpawnType} />
</>
))
.with(PointStoreType.awaitClick, () => (
<>
<CoreText type={CoreTextType.medium} text="Ожидание клика мыши" />
</>
))
.otherwise(() => (
<></>
))}

6
ui/src/features/scene_manager/presentation/forms/point/point_http_repository.ts
View file

@ -1,6 +0,0 @@
import { HttpRepository } from "../../../../../core/repository/http_repository";
export class PointHttpRepository extends HttpRepository {
}

23
ui/src/features/scene_manager/presentation/forms/point/point_store.ts
View file

@ -1,7 +1,6 @@
import makeAutoObservable from "mobx-store-inheritance";
import { NavigateFunction } from "react-router-dom";
import { PointModel } from "../../../../../core/model/point_model";
import { PointHttpRepository } from "./point_http_repository";
import { FormState, CoreError } from "../../../../../core/store/base_store";
import { SpawnPositionTypes } from "../../../../../core/model/spawn_position_types";
import { isPreviewMode } from "../scene_manager_forms";
@ -11,22 +10,42 @@ export enum PointStoreType {
makeSceneSolidAndEditPosition = "makeSceneSolidAndEditPosition",
initNewPoint = "initNewPoint",
previewPoint = "previewPoint",
awaitClick = "awaitClick",
}
export class PointStore extends FormState<PointModel, CoreError> {
viewModel: PointModel = PointModel.empty();
cameraDeviceHttpRepository: PointHttpRepository = new PointHttpRepository();
storeType: PointStoreType = PointStoreType.initNewPoint;
spawnPositionTypes: SpawnPositionTypes;
sceneMangerStore: SceneMangerStore;
listener: Function;
constructor(sceneMangerStore: SceneMangerStore) {
super();
makeAutoObservable(this);
this.sceneMangerStore = sceneMangerStore;
}
clickLister = (event: MouseEvent) =>
this.storeType.isEqualR(PointStoreType.awaitClick).map(() =>
this.sceneMangerStore!.clickScene(event, this.sceneMangerStore!.canvasOffsetX).map((vector3) => {
this.viewModel.vector3 = vector3;
this.viewModel.quaternion = [0, 0, 0, 1];
this.viewModel.toWebGl(this.sceneMangerStore.coreThreeRepository!);
this.sceneMangerStore.activeFormType = undefined;
this.sceneMangerStore.sceneItems.push(this.viewModel.toSceneItems(this.sceneMangerStore));
this.sceneMangerStore.scene.push(this.viewModel);
window.removeEventListener("click", this.clickLister);
this.sceneMangerStore.visibleSaveButton();
})
);
selectSpawnType = (type: SpawnPositionTypes) => {
this.spawnPositionTypes = type;
this.storeType = PointStoreType.awaitClick;
setTimeout(() => window.addEventListener("click", this.clickLister), 1000);
};
dispose = () => window.removeEventListener("click", this.clickLister);
updateWebGl = () =>
this.storeType
.isEqualR(PointStoreType.previewPoint)

13
ui/src/features/scene_manager/presentation/forms/robot_form/robot_form.tsx
View file

@ -16,6 +16,9 @@ export const RobotForm = observer((props: IDefaultSceneManagerFormProps) => {
const [store] = React.useState(() => new RobotFormStore(props.store));
React.useEffect(() => {
store.init();
return () => {
store.dispose();
};
}, []);
return (
<div style={{ overflowY: "scroll", height: "100%" }}>
@ -56,10 +59,7 @@ export const RobotForm = observer((props: IDefaultSceneManagerFormProps) => {
))
.with(RobotStoreType.previewRobot, () => (
<>
<CoordsForm store={store} update={() => store.updateScene()} />
<div style={{ height: 40 }} />
<CoreText text="Управление соединениями" type={CoreTextType.header} />
<CoreText text="Управление соединениями" type={CoreTextType.small} />
{store.viewModel.jointPosition.map((el, i) => (
<div>
<CoreInputNumber
@ -73,7 +73,7 @@ export const RobotForm = observer((props: IDefaultSceneManagerFormProps) => {
jointPosition: store.viewModel.jointPosition.map((element, index) =>
index.isEqualR(i).fold(
() => {
element.angel = value;
element.angle = value;
return element;
},
() => element
@ -87,6 +87,9 @@ export const RobotForm = observer((props: IDefaultSceneManagerFormProps) => {
</div>
))}
<div style={{ height: 40 }} />
<CoordsForm store={store} update={() => store.updateScene()} />
<div style={{ height: 40 }} />
</>
))
.otherwise(() => (

14
ui/src/features/scene_manager/presentation/forms/robot_form/robot_form_store.ts
View file

@ -6,8 +6,6 @@ import { RobotModel } from "../../../../../core/model/robot_model";
import { SceneMangerStore } from "../../scene_manager_store";
import { isPreviewMode } from "../scene_manager_forms";
import { message } from "antd";
import { SceneModelsTypes } from "../../../../../core/model/scene_models_type";
import { Vector3 } from "three";
export enum RobotStoreType {
previewRobot = "previewRobot",
@ -28,9 +26,10 @@ export class RobotFormStore extends FormState<RobotModel, CoreError> {
this.viewModel.vector3 = vector3;
this.viewModel.toWebGl(this.sceneMangerStore.coreThreeRepository!);
this.sceneMangerStore.activeFormType = undefined;
this.sceneMangerStore.sceneItems.push(this.viewModel.toSceneItems(this.sceneMangerStore))
this.sceneMangerStore.scene.push(this.viewModel)
this.sceneMangerStore.sceneItems.push(this.viewModel.toSceneItems(this.sceneMangerStore));
this.sceneMangerStore.scene.push(this.viewModel);
window.removeEventListener("click", this.clickLister);
this.sceneMangerStore.visibleSaveButton();
})
);
@ -50,7 +49,12 @@ export class RobotFormStore extends FormState<RobotModel, CoreError> {
updateScene = () =>
this.storeType
.isEqualR(RobotStoreType.previewRobot)
.map(() => this.viewModel.update(this.sceneMangerStore.coreThreeRepository!));
.map(
() => (
this.viewModel.update(this.sceneMangerStore.coreThreeRepository!),
this.sceneMangerStore.visibleSaveButton()
)
);
createNewRobot = () =>
this.viewModel.isValid().fold(
async (s) =>

34
ui/src/features/scene_manager/presentation/forms/solid_body/solid_body_form.tsx
View file

@ -7,6 +7,7 @@ import { CoreButton } from "../../../../../core/ui/button/button";
import { match } from "ts-pattern";
import { SpawnPositionTypesForm } from "../../components/spawn_position_types";
import { CoreInput } from "../../../../../core/ui/input/input";
import { CoordsForm } from "../../components/coords_form";
export const SolidBodyForm = observer((props: IDefaultSceneManagerFormProps) => {
const [store] = React.useState(() => new SolidBodyStore(props.store));
@ -20,31 +21,8 @@ export const SolidBodyForm = observer((props: IDefaultSceneManagerFormProps) =>
{match(store.solidBodyStoreType)
.with(SolidBodyStoreType.previewSolid, () => (
<>
<CoreText text={"Твердое тело"} type={CoreTextType.header} />
<CoreInput
value={String(store.viewModel.vector3.x)}
label="Вектор X"
onChange={(text) => (
store.updateForm({ vector3: store.viewModel.vector3.setX(Number(text)) }),
store.updateBodySimulation()
)}
/>
<CoreInput
value={String(store.viewModel.vector3.x)}
label="Вектор Y"
onChange={(text) => (
store.updateForm({ vector3: store.viewModel.vector3.setY(Number(text)) }),
store.updateBodySimulation()
)}
/>
<CoreInput
value={String(store.viewModel.vector3.x)}
label="Вектор Z"
onChange={(text) => (
store.updateForm({ vector3: store.viewModel.vector3.setZ(Number(text)) }),
store.updateBodySimulation()
)}
/>
<CoreText text={"Твердое тело"} type={CoreTextType.header} />
<CoordsForm store={store} update={store.updateBodySimulation} />
<CoreText text={"Тип твердого тела: " + store.viewModel.solidType} type={CoreTextType.header} />
</>
))
@ -68,11 +46,7 @@ export const SolidBodyForm = observer((props: IDefaultSceneManagerFormProps) =>
))
.with(SolidBodyStoreType.spawn2DVector, () => (
<>
{props.store.mousePosition ? (
""
) : (
<CoreText text={"Выберите точку размещения"} type={CoreTextType.header} />
)}
<CoreText text={"Выберите точку размещения"} type={CoreTextType.header} />
</>
))
.otherwise(() => (

36
ui/src/features/scene_manager/presentation/forms/solid_body/solid_body_store.tsx
View file

@ -7,7 +7,7 @@ import { SceneMangerStore } from "../../scene_manager_store";
import { SpawnPositionTypes } from "../../../../../core/model/spawn_position_types";
import { isPreviewMode } from "../scene_manager_forms";
import { SolidModel } from "../../../../../core/model/solid_model";
import { SceneModelsTypes } from "../../../../../core/model/scene_models_type";
export enum SolidBodyStoreType {
selectBody = "selectBody",
selectSpawnPositionType = "selectSpawnPositionType",
@ -52,20 +52,27 @@ export class SolidBodyStore extends FormState<SolidModel, CoreError> {
};
errorHandingStrategy = (error: CoreError) => {};
dispose = () => {};
selectSpawnType = (type: string) => {
this.spawnType = type;
this.solidBodyStoreType = SolidBodyStoreType.spawn2DVector;
this.sceneMangerStore.mousePositionAwait = true;
this.sceneMangerStore.spawnHelper = {
url: this.selectBody.daeUrl,
name: this.selectBody.name,
spawn: SceneModelsTypes.SOLID,
isFinished: false,
type: this.spawnType,
};
this.sceneMangerStore.activeFormType = undefined;
dispose = () => {
window.removeEventListener("click", this.clickLister);
};
selectSpawnType = () => {
this.solidBodyStoreType = SolidBodyStoreType.spawn2DVector;
setTimeout(() => window.addEventListener("click", this.clickLister), 1000);
};
clickLister = (event: MouseEvent) =>
this.solidBodyStoreType.isEqualR(SolidBodyStoreType.spawn2DVector).map(() =>
this.sceneMangerStore!.clickScene(event, this.sceneMangerStore!.canvasOffsetX).map((vector3) => {
this.viewModel.vector3 = vector3;
this.viewModel.spawnType = "BoundBox";
this.viewModel.toWebGl(this.sceneMangerStore.coreThreeRepository!);
this.sceneMangerStore.sceneItems.push(this.viewModel.toSceneItems());
this.sceneMangerStore.scene.push(this.viewModel);
window.removeEventListener("click", this.clickLister);
this.sceneMangerStore.activeFormType = undefined;
this.sceneMangerStore.visibleSaveButton()
})
);
updateBodySimulation = () =>
this.solidBodyStoreType
.isEqualR(SolidBodyStoreType.previewSolid)
@ -73,5 +80,6 @@ export class SolidBodyStore extends FormState<SolidModel, CoreError> {
clickSelectBody = (el: Parts) => {
this.selectBody = el;
this.solidBodyStoreType = SolidBodyStoreType.selectSpawnPositionType;
this.viewModel = this.viewModel.fromParts(el);
};
}

3
ui/src/features/scene_manager/presentation/forms/zone/zone_http_repository.ts
View file

@ -1,3 +0,0 @@
import { HttpRepository } from "../../../../../core/repository/http_repository";
export class ZoneHttpRepository extends HttpRepository {}

13
ui/src/features/scene_manager/presentation/forms/zone/zone_store.ts
View file

@ -1,7 +1,7 @@
import makeAutoObservable from "mobx-store-inheritance";
import { NavigateFunction } from "react-router-dom";
import { ZoneModel } from "../../../../../core/model/zone_model";
import { ZoneHttpRepository } from "./zone_http_repository";
import { FormState, CoreError } from "../../../../../core/store/base_store";
import { isPreviewMode } from "../scene_manager_forms";
import { SceneMangerStore } from "../../scene_manager_store";
@ -9,7 +9,6 @@ export enum ZoneStoreType {
preview = "preview",
}
export class ZoneStore extends FormState<ZoneModel, CoreError> {
constructor(sceneMangerStore: SceneMangerStore) {
super();
this.sceneMangerStore = sceneMangerStore;
@ -18,9 +17,8 @@ export class ZoneStore extends FormState<ZoneModel, CoreError> {
storeType: ZoneStoreType;
sceneMangerStore: SceneMangerStore;
viewModel: ZoneModel = ZoneModel.empty();
cameraDeviceHttpRepository: ZoneHttpRepository = new ZoneHttpRepository();
errorHandingStrategy = (error: CoreError) => {};
init = async (navigate?: NavigateFunction | undefined) => {
errorHandingStrategy = (_error: CoreError) => {};
init = async (_navigate?: NavigateFunction | undefined) => {
isPreviewMode(this.sceneMangerStore.activeFormDependency).map(() =>
this.sceneMangerStore.scene
.rFind<ZoneModel>((el) => el.name.isEqual(this.sceneMangerStore.selectedItemName ?? ""))
@ -38,5 +36,8 @@ export class ZoneStore extends FormState<ZoneModel, CoreError> {
)
);
};
updateWebGl = () => this.storeType.isEqualR(ZoneStoreType.preview).map(() => this.sceneMangerStore.coreThreeRepository!.updateInstance(this.viewModel))
updateWebGl = () =>
this.storeType
.isEqualR(ZoneStoreType.preview)
.map(() => this.sceneMangerStore.coreThreeRepository!.updateInstance(this.viewModel));
}

80
ui/src/features/scene_manager/presentation/scene_manager_store.ts
View file

@ -1,5 +1,5 @@
import makeAutoObservable from "mobx-store-inheritance";
import { Object3D, Object3DEventMap, Vector2, Vector3 } from "three";
import { Object3D, Vector2, Vector3 } from "three";
import { message } from "antd";
import { CoreThreeRepository } from "../../../core/repository/core_three_repository";
import { HttpError } from "../../../core/repository/http_repository";
@ -43,8 +43,11 @@ export interface SceneItems {
isSelected: boolean;
icon: string;
}
export class SceneMangerStore extends UiDrawerFormState<SceneViewModel, HttpError> {
activeFormType?: string;
activeSceneId?: string;
selectedItemName?: string;
activeFormDependency: Object = {};
viewModel: SceneViewModel = SceneViewModel.empty();
@ -60,7 +63,6 @@ export class SceneMangerStore extends UiDrawerFormState<SceneViewModel, HttpErro
scenes: SceneModel[] = [];
storeMode: StoreMode;
canvasRef?: HTMLCanvasElement;
mousePositionAwait: boolean = false;
mousePosition?: Vector2;
spawnHelper?: ISpawnHelper;
selectSceneObject?: Object;
@ -87,6 +89,7 @@ export class SceneMangerStore extends UiDrawerFormState<SceneViewModel, HttpErro
{ name: "Точки захвата", fn: () => this.createNewForm(SceneManagerForms.capturePoints, true) },
];
canvasOffsetX?: number;
sceneName?: string;
constructor() {
super(DrawersSceneManager);
makeAutoObservable(this);
@ -94,9 +97,8 @@ export class SceneMangerStore extends UiDrawerFormState<SceneViewModel, HttpErro
this.sceneHttpRepository = new SceneHttpRepository();
this.sceneMode = SceneMode.Select;
}
sceneSave = () => {
console.log(JSON.stringify(this.scene));
};
sceneSave = () => this.sceneHttpRepository.editScene(SceneAsset.newScene(this.scene, this.sceneName ?? ""));
iconToSceneManagerForm = (icon: string): SceneManagerForms => {
if (icon.isEqual("Camera")) {
this.activeFormDependency = {
@ -153,7 +155,6 @@ export class SceneMangerStore extends UiDrawerFormState<SceneViewModel, HttpErro
});
this.sceneMode = mode;
this.coreThreeRepository?.setTransformMode(this.sceneMode);
this.sceneModeWatcher();
};
createNewForm = (formType: SceneManagerForms | undefined, isNeedClearDependency?: boolean) => {
this.activeFormDependency = Object.assign(this.activeFormDependency, { store: this });
@ -183,31 +184,20 @@ export class SceneMangerStore extends UiDrawerFormState<SceneViewModel, HttpErro
addNewCamera = (model: CameraModel) => {
model.vector3 = this.coreThreeRepository!.camera.position;
// model.quaternion = this.coreThreeRepository!.camera.quaternion;
model.quaternion = this.coreThreeRepository!.camera.quaternion.toArray();
model.aspect = this.coreThreeRepository!.camera.aspect;
this.sceneItems.push({ name: model.name, icon: "Camera", fn: () => {}, isSelected: false });
this.scene.push(model);
this.coreThreeRepository?.addSceneCamera(model);
model.toWebGl(this.coreThreeRepository!);
this.visibleSaveButton();
};
loaderWatcher = () => {};
loadSceneRobossemblerAsset = (name: string) => {
try {
// this.coreThreeRepository?.loader(assetPath, this.loaderWatcher, name);
// this.visibleSaveButton();
} catch (error) {
message.error(String(error));
}
};
hiddenMenu = () => (this.isSceneMenuShow = false);
sceneModeWatcher() {}
init = async () => {};
initParam = (id: string | undefined) => {
if (id) {
this.activeSceneId = id;
this.storeMode = StoreMode.sceneInstance;
} else {
this.storeMode = StoreMode.allScenes;
@ -220,13 +210,9 @@ export class SceneMangerStore extends UiDrawerFormState<SceneViewModel, HttpErro
loadScene = (canvasRef: HTMLCanvasElement) => {
this.canvasRef = canvasRef;
this.storeMode.isEqualR(StoreMode.sceneInstance).map(() => this.loadWebGl(canvasRef));
// await this.mapOk<RobossemblerAssets>("robossemblerAssets", this.sceneHttpRepository.getRobossemblerAssets());
// if (this.robossemblerAssets) {
// this.coreThreeRepository?.loadInstances(this.robossemblerAssets);
// }
};
loadWebGl(canvasRef: HTMLCanvasElement): void {
loadWebGl = async (canvasRef: HTMLCanvasElement): Promise<void> => {
this.coreThreeRepository = new CoreThreeRepository(canvasRef as HTMLCanvasElement, this.watcherSceneEditorObject);
this.coreThreeRepository.render();
@ -234,18 +220,16 @@ export class SceneMangerStore extends UiDrawerFormState<SceneViewModel, HttpErro
this.canvasOffsetX = canvasRef.getBoundingClientRect().x;
canvasRef.addEventListener("click", (event) => this.clickLister(event, canvasRef.getBoundingClientRect().x));
const sceneAssets = this.sceneHttpRepository.getScene();
this.coreThreeRepository?.loadScene(sceneAssets);
this.sceneItems = sceneAssets.scene.map((el) => {
return {
fn: () => {},
name: el.name,
icon: el.icon,
isSelected: false,
};
});
this.scene = sceneAssets.scene;
}
(await this.sceneHttpRepository.getSceneAsset(this.activeSceneId ?? "")).fold(
(sceneAssets) => {
this.sceneName = sceneAssets.name;
this.coreThreeRepository?.loadScene(sceneAssets);
this.sceneItems = sceneAssets.toSceneItems();
this.scene = sceneAssets.scene;
},
() => {}
);
};
clickScene = (event: MouseEvent, offset: number = 0): Result<void, Vector3> => {
const vector = new Vector2();
const boundingRect = this.canvasRef!.getBoundingClientRect();
@ -260,25 +244,7 @@ export class SceneMangerStore extends UiDrawerFormState<SceneViewModel, HttpErro
vector.x = ((event.clientX - offset) / boundingRect.width) * 2 - 1;
vector.y = -(event.clientY / boundingRect.height) * 2 + 1;
if (this.mousePositionAwait && this.spawnHelper) {
this.mousePositionAwait = false;
this.mousePosition = vector;
this.coreThreeRepository?.setRayCastAndGetFirstObjectAndPointToObject(vector).map((v3) => {
this.coreThreeRepository?.solidSpawn(
this.spawnHelper as ISpawnHelper,
(obj: Object3D<Object3DEventMap> | undefined) => {
this.sceneItems.push({
name: String(this.spawnHelper?.name),
icon: "Solid",
isSelected: false,
fn: () => this.createNewForm(SceneManagerForms.solidBody),
});
this.visibleSaveButton();
},
v3
);
});
}
if (this.sceneMode.isEqual(SceneMode.Select)) {
return;
}

2
ui/src/index.tsx
View file

@ -10,7 +10,9 @@ import { configure } from "mobx";
configure({
enforceActions: "never",
});
extensions();
const root = ReactDOM.createRoot(document.getElementById("root") as HTMLElement);
root.render(