chili3d 0.6.1

package/packages/chili/src/commands/create/group.ts

@@ -0,0 +1,205 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+import { button, div, input, label, XYZConverter } from "chili-controls";
+import {
+    AsyncController,
+    Binding,
+    Component,
+    ComponentNode,
+    command,
+    DialogResult,
+    type IApplication,
+    type ICommand,
+    type IDocument,
+    Localize,
+    Observable,
+    PubSub,
+    Transaction,
+    VisualNode,
+    XYZ,
+} from "chili-core";
+import { GetOrSelectNodeStep, type IStep, PointStep } from "../../step";
+import { MultistepCommand } from "../multistepCommand";
+
+class GroupDefinition extends Observable {
+    get name() {
+        return this.getPrivateValue("name", "unnamed");
+    }
+    set name(value: string) {
+        this.setProperty("name", value);
+    }
+
+    get insert() {
+        return this.getPrivateValue("insert", XYZ.zero);
+    }
+    set insert(value: XYZ) {
+        this.setProperty("insert", value);
+    }
+
+    get convertInstance() {
+        return this.getPrivateValue("convertInstance", true);
+    }
+    set convertInstance(value: boolean) {
+        this.setProperty("convertInstance", value);
+    }
+}
+
+@command({
+    key: "create.group",
+    icon: "icon-group",
+})
+export class GroupCommand extends MultistepCommand {
+    protected override getSteps(): IStep[] {
+        return [new GetOrSelectNodeStep("prompt.select.shape", { multiple: true })];
+    }
+
+    protected override executeMainTask(): void {
+        const nodes = this.stepDatas[0].nodes?.filter((node) => node instanceof VisualNode);
+        if (!nodes || nodes.length === 0) {
+            PubSub.default.pub("showToast", "toast.select.noSelected");
+            return;
+        }
+
+        const definition = new GroupDefinition();
+
+        PubSub.default.pub("showDialog", "command.create.group", this.dialog(definition), (r) => {
+            if (r === DialogResult.ok) this.createGroup(definition, nodes);
+        });
+    }
+
+    private createGroup(definition: GroupDefinition, nodes: VisualNode[]) {
+        Transaction.execute(this.document, "create group", () => {
+            for (const node of nodes) {
+                const worldTransform = node.worldTransform();
+                node.parent?.transfer(node);
+                node.transform = worldTransform;
+            }
+
+            const component = new Component(definition.name, this.stepDatas[0].nodes!, definition.insert);
+            this.document.modelManager.components.push(component);
+
+            if (definition.convertInstance) {
+                const group = new ComponentNode(
+                    this.document,
+                    definition.name,
+                    component.id,
+                    component.origin,
+                );
+                this.document.modelManager.rootNode.add(group);
+            }
+        });
+    }
+
+    private readonly pickInsertPoint = async (definition: GroupDefinition, e: MouseEvent) => {
+        const dialog = this.findDialog(e.target as HTMLElement);
+        if (!dialog) return;
+        dialog.close();
+
+        const command = new PickInsertPointCommand(this.document, definition);
+        try {
+            if (this.document.application.executingCommand) {
+                throw new Error("Command is executing");
+            }
+            this.document.application.executingCommand = command;
+            await command.execute(this.document.application);
+        } finally {
+            dialog.showModal();
+            this.document.application.executingCommand = undefined;
+        }
+    };
+
+    private readonly findDialog = (e: HTMLElement): HTMLDialogElement | undefined => {
+        if (e instanceof HTMLDialogElement) return e;
+        if (!e.parentElement) return undefined;
+
+        return this.findDialog(e.parentElement);
+    };
+
+    private dialog(definition: GroupDefinition) {
+        return div(
+            {
+                style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: "10px",
+                },
+            },
+            label(
+                {
+                    textContent: new Localize("common.name"),
+                },
+                ": ",
+            ),
+            input({
+                value: new Binding(definition, "name"),
+                onkeydown: (e) => {
+                    e.stopPropagation();
+                },
+                onblur: (e) => {
+                    definition.name = (e.target as HTMLInputElement).value;
+                },
+            }),
+            label(
+                {
+                    textContent: new Localize("option.command.insertPoint"),
+                },
+                ": ",
+            ),
+            div(
+                {
+                    style: {
+                        display: "inline-flex",
+                        flexDirection: "row",
+                        padding: "10px",
+                        borderRadius: "5px",
+                        border: "1px solid var(--border-color)",
+                        gap: "6px",
+                    },
+                },
+                input({
+                    value: new Binding(definition, "insert", new XYZConverter()),
+                    onkeydown: (e) => {
+                        e.stopPropagation();
+                    },
+                }),
+                button({
+                    textContent: new Localize("option.command.insertPoint"),
+                    onclick: (e) => this.pickInsertPoint(definition, e),
+                }),
+            ),
+            div(
+                input({
+                    type: "checkbox",
+                    id: "instanceID",
+                    checked: new Binding(definition, "convertInstance"),
+                    onchange: (e) => {
+                        definition.convertInstance = (e.target as HTMLInputElement).checked;
+                    },
+                }),
+                " ",
+                label({
+                    textContent: new Localize("option.command.isConvertInstance"),
+                    htmlFor: "instanceID",
+                }),
+            ),
+        );
+    }
+}
+
+class PickInsertPointCommand implements ICommand {
+    constructor(
+        readonly document: IDocument,
+        readonly defination: GroupDefinition,
+    ) {}
+
+    async execute(application: IApplication): Promise<void> {
+        const pickPointStep = new PointStep("option.command.insertPoint");
+        const controller = new AsyncController();
+        const result = await pickPointStep.execute(this.document, controller);
+
+        if (result?.point) {
+            this.defination.insert = result.point;
+        }
+    }
+}

package/packages/chili/src/commands/create/index.ts

@@ -0,0 +1,26 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+export * from "./arc";
+export * from "./bezier";
+export * from "./box";
+export * from "./circle";
+export * from "./cone";
+export * from "./converter";
+export * from "./copySubShape";
+export * from "./curveProjection";
+export * from "./cylinder";
+export * from "./ellipse";
+export * from "./group";
+export * from "./line";
+export * from "./loft";
+export * from "./offset";
+export * from "./polygon";
+export * from "./prism";
+export * from "./pyramid";
+export * from "./rect";
+export * from "./revolve";
+export * from "./section";
+export * from "./sphere";
+export * from "./sweep";
+export * from "./thickSolid";

package/packages/chili/src/commands/create/line.ts

@@ -0,0 +1,61 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+import { command, type GeometryNode, Precision, Property, type XYZ } from "chili-core";
+import { LineNode } from "../../bodys";
+import { Dimension, type PointSnapData } from "../../snap";
+import { type IStep, PointStep } from "../../step";
+import { CreateCommand } from "../createCommand";
+
+@command({
+    key: "create.line",
+    icon: "icon-line",
+})
+export class Line extends CreateCommand {
+    @Property.define("option.command.isConnected", {
+        dependencies: [{ property: "repeatOperation", value: true }],
+    })
+    get isContinue() {
+        return this.getPrivateValue("isContinue", false);
+    }
+    set isContinue(value: boolean) {
+        this.setProperty("isContinue", value);
+    }
+
+    protected override geometryNode(): GeometryNode {
+        return new LineNode(this.document, this.stepDatas[0].point!, this.stepDatas[1].point!);
+    }
+
+    getSteps(): IStep[] {
+        const firstStep = new PointStep("prompt.pickFistPoint");
+        const secondStep = new PointStep("prompt.pickNextPoint", this.getSecondPointData);
+        return [firstStep, secondStep];
+    }
+
+    protected override resetStepDatas() {
+        if (this.isContinue) {
+            this.stepDatas[0] = this.stepDatas[1];
+            this.stepDatas.length = 1;
+        } else {
+            this.stepDatas.length = 0;
+        }
+    }
+
+    private readonly getSecondPointData = (): PointSnapData => {
+        return {
+            refPoint: () => this.stepDatas[0].point!,
+            dimension: Dimension.D1D2D3,
+            validator: (point: XYZ) => {
+                return this.stepDatas[0].point!.distanceTo(point) > Precision.Distance;
+            },
+            preview: this.linePreview,
+        };
+    };
+
+    private readonly linePreview = (point: XYZ | undefined) => {
+        if (!point) {
+            return [this.meshPoint(this.stepDatas[0].point!)];
+        }
+        return [this.meshPoint(this.stepDatas[0].point!), this.meshLine(this.stepDatas[0].point!, point)];
+    };
+}

package/packages/chili/src/commands/create/loft.ts

@@ -0,0 +1,149 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+import {
+    AsyncController,
+    CancelableCommand,
+    Combobox,
+    Continuity,
+    command,
+    EditableShapeNode,
+    type IShape,
+    Property,
+    PubSub,
+    Result,
+    ShapeType,
+} from "chili-core";
+import { SelectShapeStep } from "../../step";
+
+@command({
+    key: "create.loft",
+    icon: "icon-loft",
+})
+export class LoftCommand extends CancelableCommand {
+    private visual: number | undefined = undefined;
+    private readonly shapes: IShape[] = [];
+    private shape: Result<IShape> = Result.err("None shape");
+    private readonly _continuity = this.initContinuties();
+
+    @Property.define("option.command.isSolid")
+    get isSolid() {
+        return this.getPrivateValue("isSolid", false);
+    }
+    set isSolid(value: boolean) {
+        this.setProperty("isSolid", value, () => {
+            this.displayVisual();
+        });
+    }
+
+    @Property.define("option.command.isRuled")
+    get isRuled() {
+        return this.getPrivateValue("isRuled", false);
+    }
+    set isRuled(value: boolean) {
+        this.setProperty("isRuled", value, () => {
+            this.displayVisual();
+        });
+    }
+
+    @Property.define("option.command.continuity", {
+        dependencies: [
+            {
+                property: "isRuled",
+                value: false,
+            },
+        ],
+    })
+    get continuity(): Combobox<string> {
+        return this._continuity;
+    }
+
+    @Property.define("common.confirm")
+    readonly confirm = () => {
+        this.controller?.success();
+    };
+
+    private initContinuties() {
+        const box = new Combobox<string>();
+        for (const item of Object.values(Continuity)) {
+            if (typeof item === "number") continue;
+
+            box.items.push(item.toString());
+        }
+        return box;
+    }
+
+    protected override async executeAsync(): Promise<void> {
+        this._continuity.onPropertyChanged(this.handleContinuityChange);
+
+        try {
+            while (true) {
+                const data = await this.selectSection();
+                if (data === undefined) {
+                    if (this.controller?.result?.status === "success") {
+                        break;
+                    } else {
+                        return;
+                    }
+                }
+
+                this.shapes.push(data.shapes[0].shape.transformedMul(data.nodes![0].worldTransform()));
+                this.displayVisual();
+            }
+
+            this.document.modelManager.addNode(new EditableShapeNode(this.document, "loft", this.shape));
+        } finally {
+            this._continuity.removePropertyChanged(this.handleContinuityChange);
+            this.clearVisual();
+        }
+    }
+
+    private async selectSection() {
+        this.controller = new AsyncController();
+        const step = new SelectShapeStep(
+            ShapeType.Vertex | ShapeType.Wire | ShapeType.Edge,
+            "prompt.select.section",
+            {
+                keepSelection: true,
+            },
+        );
+        return await step.execute(this.document, this.controller);
+    }
+
+    private readonly handleContinuityChange = (p: keyof Combobox<string>) => {
+        if (p === "selectedIndex") this.displayVisual();
+    };
+
+    private clearVisual() {
+        this.removeVisual();
+        this.document.visual.highlighter.clear();
+        this.document.visual.update();
+    }
+
+    private displayVisual() {
+        this.removeVisual();
+        if (this.shapes.length < 2) {
+            return false;
+        }
+        this.shape = this.document.application.shapeFactory.loft(
+            this.shapes,
+            this.isSolid,
+            this.isRuled,
+            this.continuity.selectedIndex,
+        );
+        if (!this.shape.isOk) {
+            PubSub.default.pub("showToast", "error.default:{0}", this.shape.error);
+            return false;
+        }
+        this.visual = this.document.visual.context.displayMesh([this.shape.value.mesh.faces!], 0.5);
+        this.document.visual.update();
+        return true;
+    }
+
+    readonly removeVisual = () => {
+        if (this.visual !== undefined) {
+            this.document.visual.context.removeMesh(this.visual);
+            this.visual = undefined;
+        }
+    };
+}

package/packages/chili/src/commands/create/offset.ts

@@ -0,0 +1,131 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+import {
+    command,
+    EditableShapeNode,
+    I18n,
+    type IEdge,
+    type IFace,
+    type IShape,
+    type IWire,
+    JoinType,
+    type ShapeMeshData,
+    ShapeType,
+    type XYZ,
+} from "chili-core";
+import { GeoUtils } from "chili-geo";
+import { type IStep, LengthAtAxisStep, SelectShapeStep } from "../../step";
+import { MultistepCommand } from "../multistepCommand";
+
+@command({
+    key: "create.offset",
+    icon: "icon-offset",
+})
+export class OffsetCommand extends MultistepCommand {
+    protected override executeMainTask() {
+        const normal = this.getAxis().normal;
+        const shape = this.createOffsetShape(normal, this.stepDatas[1].distance!);
+        const node = new EditableShapeNode(
+            this.document,
+            I18n.translate("command.create.offset"),
+            shape.value,
+        );
+        this.document.modelManager.rootNode.add(node);
+        this.document.visual.update();
+    }
+
+    protected override getSteps(): IStep[] {
+        return [
+            new SelectShapeStep(ShapeType.Edge | ShapeType.Wire | ShapeType.Face, "prompt.select.shape"),
+            new LengthAtAxisStep("common.length", () => {
+                const ax = this.getAxis();
+                return {
+                    point: ax.point,
+                    direction: ax.direction,
+                    preview: (point: XYZ | undefined) => this.preview(ax, point),
+                };
+            }),
+        ];
+    }
+
+    private preview(
+        ax: { point: XYZ; direction: XYZ; normal: XYZ },
+        point: XYZ | undefined,
+    ): ShapeMeshData[] {
+        const res: ShapeMeshData[] = [this.meshPoint(ax.point)];
+        if (point !== undefined) {
+            res.push(this.meshLine(ax.point, point));
+            const distance = point.sub(ax.point).dot(ax.direction);
+            const shape = this.createOffsetShape(ax.normal, distance);
+            if (shape.isOk) {
+                res.push(shape.value.edgesMeshPosition());
+            }
+        }
+        return res;
+    }
+
+    private getAxis(): { direction: XYZ; point: XYZ; normal: XYZ } {
+        const start = this.stepDatas[0].shapes[0].point!;
+        const shape = this.transformdFirstShape(this.stepDatas[0]);
+        if (shape.shapeType === ShapeType.Edge) {
+            return this.getEdgeAxis(shape as IEdge, start);
+        }
+
+        return this.getFaceOrWireAxis(shape, start);
+    }
+
+    private getFaceOrWireAxis(shape: IShape, start: XYZ) {
+        let face = shape as IFace;
+        if (shape.shapeType === ShapeType.Wire) {
+            face = (shape as IWire).toFace().value;
+        }
+        const normal = face.normal(0, 0)[1];
+        const { nearest, direction } = this.getNearstPointAndDirection(shape, start, normal);
+        return {
+            point: nearest.point,
+            normal,
+            direction: direction.cross(normal).normalize()!,
+        };
+    }
+
+    private getEdgeAxis(edge: IEdge, start: XYZ) {
+        const curve = edge.curve;
+        const direction = curve.dn(curve.parameter(start, 1e-3)!, 1);
+        const normal = GeoUtils.normal(edge);
+        return {
+            point: start,
+            normal,
+            direction: direction.cross(normal).normalize()!,
+        };
+    }
+
+    private getNearstPointAndDirection(shape: IShape, start: XYZ, normal: XYZ) {
+        let wire = shape as IWire;
+        if (shape.shapeType === ShapeType.Face) {
+            wire = (shape as IFace).outerWire();
+        }
+        const nearest = GeoUtils.nearestPoint(wire, start);
+        const nextEdge = GeoUtils.findNextEdge(wire, nearest.edge).value;
+        let direction = nearest.edge.curve.dn(0, 1);
+        const scale = nearest.edge.orientation() === nextEdge.orientation() ? 1 : -1;
+        const nextDirection = nextEdge.curve.dn(0, 1).multiply(scale);
+        if (direction.cross(nextDirection).normalize()?.isOppositeTo(normal)) {
+            direction = direction.multiply(-1);
+        }
+        return { nearest, direction };
+    }
+
+    private createOffsetShape(normal: XYZ, distance: number) {
+        const shape = this.transformdFirstShape(this.stepDatas[0]);
+        if (shape.shapeType === ShapeType.Edge) {
+            return (shape as IEdge).offset(distance, normal);
+        }
+
+        let wire = shape as IWire;
+        if (shape.shapeType === ShapeType.Face) {
+            wire = (shape as IFace).outerWire();
+        }
+        return wire.offset(distance, JoinType.intersection);
+    }
+}

package/packages/chili/src/commands/create/polygon.ts

@@ -0,0 +1,104 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+import {
+    AsyncController,
+    command,
+    EdgeMeshDataBuilder,
+    type GeometryNode,
+    I18n,
+    Precision,
+    Property,
+    type ShapeMeshData,
+    type XYZ,
+} from "chili-core";
+import { PolygonNode } from "../../bodys";
+import { Dimension, type PointSnapData, type SnapResult } from "../../snap";
+import { type IStep, PointStep } from "../../step";
+import { CreateFaceableCommand } from "../createCommand";
+
+@command({
+    key: "create.polygon",
+    icon: "icon-toPoly",
+})
+export class Polygon extends CreateFaceableCommand {
+    @Property.define("common.confirm")
+    readonly confirm = () => {
+        this.controller?.success();
+    };
+
+    protected override geometryNode(): GeometryNode {
+        const node = new PolygonNode(
+            this.document,
+            this.stepDatas.map((step) => step.point!),
+        );
+        node.isFace = this.isFace;
+        return node;
+    }
+
+    protected override async executeSteps(): Promise<boolean> {
+        const steps = this.getSteps();
+        let firstStep = true;
+        while (true) {
+            const step = firstStep ? steps[0] : steps[1];
+            if (firstStep) firstStep = false;
+            this.controller = new AsyncController();
+            const data = await step.execute(this.document, this.controller);
+            if (data === undefined) {
+                return this.controller.result?.status === "success";
+            }
+            this.stepDatas.push(data);
+            if (this.isClose(data)) {
+                return true;
+            }
+        }
+    }
+
+    private isClose(data: SnapResult) {
+        return (
+            this.stepDatas.length > 1 &&
+            this.stepDatas[0].point!.distanceTo(data.point!) <= Precision.Distance
+        );
+    }
+
+    protected override getSteps(): IStep[] {
+        const firstStep = new PointStep("prompt.pickFistPoint");
+        const secondStep = new PointStep("prompt.pickNextPoint", this.getNextData);
+        return [firstStep, secondStep];
+    }
+
+    private readonly getNextData = (): PointSnapData => {
+        return {
+            refPoint: () => this.stepDatas.at(-1)!.point!,
+            dimension: Dimension.D1D2D3,
+            validator: this.validator,
+            preview: this.preview,
+            featurePoints: [
+                {
+                    point: this.stepDatas.at(0)!.point!,
+                    prompt: I18n.translate("prompt.polygon.close"),
+                    when: () => this.stepDatas.length > 2,
+                },
+            ],
+        };
+    };
+
+    private readonly preview = (point: XYZ | undefined): ShapeMeshData[] => {
+        const ps = this.stepDatas.map((data) => this.meshPoint(data.point!));
+        const edges = new EdgeMeshDataBuilder();
+        this.stepDatas.forEach((data) => edges.addPosition(data.point!.x, data.point!.y, data.point!.z));
+        if (point) {
+            edges.addPosition(point.x, point.y, point.z);
+        }
+        return [...ps, edges.build()];
+    };
+
+    private readonly validator = (point: XYZ): boolean => {
+        for (const data of this.stepDatas) {
+            if (point.distanceTo(data.point!) < 0.001) {
+                return false;
+            }
+        }
+        return true;
+    };
+}