chili3d 0.6.1

package/packages/chili/src/document.ts

@@ -0,0 +1,145 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+import {
+    type Act,
+    Constants,
+    History,
+    I18n,
+    type IApplication,
+    type IDocument,
+    Id,
+    type ISelection,
+    type IVisual,
+    Logger,
+    ModelManager,
+    Observable,
+    ObservableCollection,
+    PubSub,
+    type Serialized,
+    Serializer,
+} from "chili-core";
+import { Selection } from "./selection";
+
+export class Document extends Observable implements IDocument {
+    readonly visual: IVisual;
+    readonly history: History;
+    readonly selection: ISelection;
+    readonly acts = new ObservableCollection<Act>();
+    readonly modelManager: ModelManager;
+
+    static readonly version = __DOCUMENT_VERSION__;
+
+    get name(): string {
+        return this.getPrivateValue("name");
+    }
+    set name(name: string) {
+        if (this.name === name) return;
+        this.setProperty("name", name);
+        if (this.modelManager.rootNode) this.modelManager.rootNode.name = name;
+    }
+
+    constructor(
+        readonly application: IApplication,
+        name: string,
+        readonly id: string = Id.generate(),
+    ) {
+        super();
+        this.setPrivateValue("name", name);
+        this.modelManager = new ModelManager(this);
+        this.history = new History();
+        this.visual = application.visualFactory.create(this);
+        this.selection = new Selection(this);
+        application.documents.add(this);
+
+        Logger.info(`new document: ${name}`);
+    }
+
+    serialize(): Serialized {
+        const serialized = {
+            classKey: "Document",
+            version: __DOCUMENT_VERSION__,
+            properties: {
+                id: this.id,
+                name: this.name,
+                models: this.modelManager.serialize(),
+                acts: this.acts.map((x) => Serializer.serializeObject(x)),
+            },
+        };
+        return serialized;
+    }
+
+    override disposeInternal(): void {
+        super.disposeInternal();
+
+        this.modelManager.dispose();
+        this.visual.dispose();
+        this.history.dispose();
+        this.selection.dispose();
+        this.acts.forEach((x) => x.dispose());
+        this.acts.clear();
+    }
+
+    async save() {
+        const data = this.serialize();
+        await this.application.storage.put(Constants.DBName, Constants.DocumentTable, this.id, data);
+        const image = this.application.activeView?.toImage();
+        await this.application.storage.put(Constants.DBName, Constants.RecentTable, this.id, {
+            id: this.id,
+            name: this.name,
+            date: Date.now(),
+            image,
+        });
+    }
+
+    async close() {
+        if (window.confirm(I18n.translate("prompt.saveDocument{0}", this.name))) {
+            await this.save();
+        }
+
+        const views = this.application.views.filter((x) => x.document === this);
+        this.application.views.remove(...views);
+        this.application.activeView = this.application.views.at(0);
+        this.application.documents.delete(this);
+
+        PubSub.default.pub("documentClosed", this);
+
+        Logger.info(`document: ${this.name} closed`);
+        this.dispose();
+    }
+
+    static async open(application: IApplication, id: string) {
+        const data = (await application.storage.get(
+            Constants.DBName,
+            Constants.DocumentTable,
+            id,
+        )) as Serialized;
+        if (data === undefined) {
+            Logger.warn(`document: ${id} not find`);
+            return;
+        }
+        const document = await Document.load(application, data);
+        if (document !== undefined) {
+            Logger.info(`document: ${document.name} opened`);
+        }
+        return document;
+    }
+
+    static async load(app: IApplication, data: Serialized): Promise<IDocument | undefined> {
+        if ((data as any).version !== __DOCUMENT_VERSION__) {
+            alert(
+                "The file version has been upgraded, no compatibility treatment was done in the development phase",
+            );
+            return undefined;
+        }
+        const document = new Document(app, data.properties["name"], data.properties["id"]);
+        document.history.disabled = true;
+        document.acts.push(
+            ...data.properties["acts"].map((x: Serialized) => Serializer.deserializeObject(document, x)),
+        );
+
+        await document.modelManager.deserialize(data.properties["models"]);
+        document.history.disabled = false;
+        return document;
+    }
+}

package/packages/chili/src/editEventHandler.ts

@@ -0,0 +1,20 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+import { type IDocument, type INode, PubSub } from "chili-core";
+import { NodeSelectionHandler } from "chili-vis";
+
+export class EditEventHandler extends NodeSelectionHandler {
+    constructor(
+        document: IDocument,
+        readonly selectedNodes: INode[],
+    ) {
+        super(document, true);
+        PubSub.default.pub("showProperties", document, selectedNodes);
+    }
+
+    override disposeInternal() {
+        PubSub.default.pub("showProperties", this.document, []);
+        super.disposeInternal();
+    }
+}

package/packages/chili/src/index.ts

@@ -0,0 +1,12 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+export * from "./application";
+export * from "./bodys";
+export * from "./commands";
+export * from "./comparers";
+export * from "./document";
+export * from "./editEventHandler";
+export * from "./services";
+export * from "./snap";
+export * from "./step";

package/packages/chili/src/selection.ts

@@ -0,0 +1,178 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+import {
+    type AsyncController,
+    type CursorType,
+    type I18nKeys,
+    type IDisposable,
+    type IDocument,
+    type IEventHandler,
+    type INode,
+    type INodeFilter,
+    type ISelection,
+    type IShapeFilter,
+    Logger,
+    PubSub,
+    ShapeNode,
+    ShapeType,
+    VisualNode,
+    VisualState,
+} from "chili-core";
+import { NodeSelectionHandler, SubshapeSelectionHandler } from "chili-vis";
+
+export class Selection implements ISelection, IDisposable {
+    private _selectedNodes: INode[] = [];
+    private _unselectedNodes: INode[] = [];
+
+    shapeType: ShapeType = ShapeType.Shape;
+    shapeFilter?: IShapeFilter;
+    nodeFilter?: INodeFilter;
+
+    constructor(readonly document: IDocument) {}
+
+    async pickShape(
+        prompt: I18nKeys,
+        controller: AsyncController,
+        multiMode: boolean,
+        selectedState: VisualState = VisualState.edgeSelected,
+        highlightState: VisualState = VisualState.edgeHighlight,
+    ) {
+        const handler = new SubshapeSelectionHandler(
+            this.document,
+            this.shapeType,
+            multiMode,
+            controller,
+            this.shapeFilter,
+            this.nodeFilter,
+        );
+        handler.selectedState = selectedState;
+        handler.highlightState = highlightState;
+        await this.pickAsync(handler, prompt, controller, multiMode);
+        return handler.shapes();
+    }
+
+    async pickNode(prompt: I18nKeys, controller: AsyncController, multiMode: boolean) {
+        const handler = new NodeSelectionHandler(this.document, multiMode, controller, this.nodeFilter);
+        await this.pickAsync(handler, prompt, controller, multiMode);
+        return handler.nodes();
+    }
+
+    async pickAsync(
+        handler: IEventHandler,
+        prompt: I18nKeys,
+        controller: AsyncController,
+        showControl: boolean,
+        cursor: CursorType = "select.default",
+    ) {
+        const oldHandler = this.document.visual.eventHandler;
+        this.document.visual.eventHandler = handler;
+        PubSub.default.pub("viewCursor", cursor);
+        PubSub.default.pub("statusBarTip", prompt);
+        if (showControl) PubSub.default.pub("showSelectionControl", controller);
+
+        await Promise.try(
+            () =>
+                new Promise((resolve, reject) => {
+                    controller.onCompleted(resolve);
+                    controller.onCancelled(reject);
+                }),
+        )
+            .catch((e) => {
+                Logger.debug("pick status: ", e);
+            })
+            .finally(() => {
+                if (showControl) PubSub.default.pub("clearSelectionControl");
+                PubSub.default.pub("clearStatusBarTip");
+                this.document.visual.eventHandler = oldHandler;
+                PubSub.default.pub("viewCursor", "default");
+            });
+    }
+
+    dispose(): void {
+        this._selectedNodes.length = 0;
+        this._unselectedNodes.length = 0;
+    }
+
+    getSelectedNodes(): INode[] {
+        return this._selectedNodes;
+    }
+
+    setSelection(nodes: INode[], toggle: boolean) {
+        nodes = nodes.filter(this.shapeNodeFilter);
+        if (toggle) {
+            this.toggleSelectPublish(nodes, true);
+        } else {
+            this.removeSelectedPublish(this._selectedNodes, false);
+            this.addSelectPublish(nodes, true);
+        }
+        return this._selectedNodes.length;
+    }
+
+    private readonly shapeNodeFilter = (x: INode) => {
+        if (x instanceof ShapeNode) {
+            const shape = x.shape.value;
+            if (!shape || !this.shapeFilter) return true;
+            return this.shapeFilter.allow(shape);
+        }
+
+        if (this.nodeFilter) {
+            return this.nodeFilter.allow(x);
+        }
+
+        return true;
+    };
+
+    deselect(nodes: INode[]) {
+        this.removeSelectedPublish(nodes, true);
+    }
+
+    clearSelection() {
+        this.removeSelectedPublish(this._selectedNodes, true);
+    }
+
+    private updateSelection() {
+        this.document.visual.update();
+        PubSub.default.pub("selectionChanged", this.document, this._selectedNodes, this._unselectedNodes);
+    }
+
+    private toggleSelectPublish(nodes: INode[], publish: boolean) {
+        const selected = nodes.filter((m) => this._selectedNodes.includes(m));
+        const unSelected = nodes.filter((m) => !this._selectedNodes.includes(m));
+        this.removeSelectedPublish(selected, false);
+        this.addSelectPublish(unSelected, publish);
+    }
+
+    private addSelectPublish(nodes: INode[], publish: boolean) {
+        nodes.forEach((m) => {
+            if (m instanceof VisualNode) {
+                const visual = this.document.visual.context.getVisual(m);
+                if (visual)
+                    this.document.visual.highlighter.addState(
+                        visual,
+                        VisualState.edgeSelected,
+                        ShapeType.Shape,
+                    );
+            }
+        });
+        this._selectedNodes.push(...nodes);
+        if (publish) this.updateSelection();
+    }
+
+    private removeSelectedPublish(nodes: INode[], publish: boolean) {
+        for (const node of nodes) {
+            if (node instanceof VisualNode) {
+                const visual = this.document.visual.context.getVisual(node);
+                if (visual)
+                    this.document.visual.highlighter.removeState(
+                        visual,
+                        VisualState.edgeSelected,
+                        ShapeType.Shape,
+                    );
+            }
+        }
+        this._selectedNodes = this._selectedNodes.filter((m) => !nodes.includes(m));
+        this._unselectedNodes = nodes;
+        if (publish) this.updateSelection();
+    }
+}

package/packages/chili/src/services/commandService.ts

@@ -0,0 +1,105 @@
+// 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 CommandKeys,
+    type IApplication,
+    ICommand,
+    type IService,
+    type IView,
+    Logger,
+    PubSub,
+} from "chili-core";
+
+export class CommandService implements IService {
+    private _lastCommand: CommandKeys | undefined;
+    private _checking: boolean = false;
+    private _app: IApplication | undefined;
+
+    private get app(): IApplication {
+        if (this._app === undefined) {
+            throw new Error("Executor is not initialized");
+        }
+        return this._app;
+    }
+
+    start(): void {
+        PubSub.default.sub("executeCommand", this.executeCommand);
+        PubSub.default.sub("activeViewChanged", this.onActiveViewChanged);
+        Logger.info(`${CommandService.name} started`);
+    }
+
+    stop(): void {
+        PubSub.default.remove("executeCommand", this.executeCommand);
+        PubSub.default.remove("activeViewChanged", this.onActiveViewChanged);
+        Logger.info(`${CommandService.name} stoped`);
+    }
+
+    register(app: IApplication) {
+        this._app = app;
+        Logger.info(`${CommandService.name} registed`);
+    }
+
+    private readonly onActiveViewChanged = async (view: IView | undefined) => {
+        if (this.app.executingCommand && ICommand.isCancelableCommand(this.app.executingCommand))
+            await this.app.executingCommand.cancel();
+    };
+
+    private readonly executeCommand = async (commandName: CommandKeys) => {
+        const command = commandName === "special.last" ? this._lastCommand : commandName;
+        if (!command || !(await this.canExecute(command))) return;
+        Logger.info(`executing command ${command}`);
+        await this.executeAsync(command);
+    };
+
+    private async executeAsync(commandName: CommandKeys) {
+        const commandCtor = Command.get(commandName)!;
+        if (!commandCtor) {
+            Logger.error(`Can not find ${commandName} command`);
+            return;
+        }
+
+        const command = new commandCtor();
+        this.app.executingCommand = command;
+        PubSub.default.pub("showProperties", this.app.activeView?.document!, []);
+
+        await Promise.try(command.execute.bind(command), this.app)
+            .catch((err) => {
+                PubSub.default.pub("displayError", err as string);
+                Logger.error(err);
+            })
+            .finally(() => {
+                this._lastCommand = commandName;
+                this.app.executingCommand = undefined;
+            });
+    }
+
+    private async canExecute(commandName: CommandKeys) {
+        if (this._checking) return false;
+        this._checking = true;
+        const result = await this.checking(commandName);
+        this._checking = false;
+        return result;
+    }
+
+    private async checking(commandName: CommandKeys) {
+        const commandData = Command.getData(commandName);
+        if (!commandData?.isApplicationCommand && this.app.activeView === undefined) {
+            Logger.error("No active document");
+            return false;
+        }
+        if (!this.app.executingCommand) {
+            return true;
+        }
+        if (Command.getData(this.app.executingCommand)?.key === commandName) {
+            PubSub.default.pub("showToast", "toast.command.{0}excuting", commandName);
+            return false;
+        }
+        if (ICommand.isCancelableCommand(this.app.executingCommand)) {
+            await this.app.executingCommand.cancel();
+            return true;
+        }
+        return false;
+    }
+}

package/packages/chili/src/services/editorService.ts

@@ -0,0 +1,46 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+import {
+    type IApplication,
+    type IDocument,
+    type IEventHandler,
+    type INode,
+    type IService,
+    Logger,
+    PubSub,
+} from "chili-core";
+
+export class EditorService implements IService {
+    private editHandler?: IEventHandler;
+
+    constructor(readonly factory: (document: IDocument, selected: INode[]) => IEventHandler) {}
+
+    register(_app: IApplication): void {
+        Logger.info(`${EditorService.name} registed`);
+    }
+
+    start(): void {
+        PubSub.default.sub("selectionChanged", this.handleSelectionChanged);
+        Logger.info(`${EditorService.name} started`);
+    }
+
+    stop(): void {
+        PubSub.default.remove("selectionChanged", this.handleSelectionChanged);
+        Logger.info(`${EditorService.name} stopped`);
+    }
+
+    private readonly handleSelectionChanged = (document: IDocument, selected: INode[]) => {
+        this.editHandler?.dispose();
+        this.editHandler = undefined;
+
+        if (document.application.executingCommand) return;
+
+        if (selected.length > 0) {
+            this.editHandler = this.factory(document, selected);
+            document.visual.eventHandler = this.editHandler;
+        } else {
+            document.visual.resetEventHandler();
+        }
+    };
+}

package/packages/chili/src/services/hotkeyService.ts

@@ -0,0 +1,102 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+import { type CommandKeys, type IApplication, type IService, Logger, PubSub } from "chili-core";
+
+export interface Keys {
+    key: string;
+    ctrlKey?: boolean;
+    shiftKey?: boolean;
+    altKey?: boolean;
+}
+
+export interface HotkeyMap {
+    [key: string]: CommandKeys;
+}
+
+const DefaultKeyMap: HotkeyMap = {
+    Delete: "modify.deleteNode",
+    Backspace: "modify.deleteNode",
+    " ": "special.last",
+    Enter: "special.last",
+    "ctrl+z": "edit.undo",
+    "ctrl+y": "edit.redo",
+};
+
+export class HotkeyService implements IService {
+    private app?: IApplication;
+    private readonly _keyMap = new Map<string, CommandKeys>();
+
+    constructor() {
+        this.addMap(DefaultKeyMap);
+    }
+
+    register(app: IApplication): void {
+        this.app = app;
+        Logger.info(`${HotkeyService.name} registed`);
+    }
+
+    start(): void {
+        window.addEventListener("keydown", this.eventHandlerKeyDown);
+        window.addEventListener("keydown", this.commandKeyDown);
+        Logger.info(`${HotkeyService.name} started`);
+    }
+
+    stop(): void {
+        window.removeEventListener("keydown", this.eventHandlerKeyDown);
+        window.removeEventListener("keydown", this.commandKeyDown);
+        Logger.info(`${HotkeyService.name} stoped`);
+    }
+
+    protected canHandleKey(e: KeyboardEvent): boolean {
+        return true;
+    }
+
+    private readonly eventHandlerKeyDown = (e: KeyboardEvent) => {
+        if (!this.canHandleKey(e)) return;
+
+        e.preventDefault();
+        const visual = this.app?.activeView?.document?.visual;
+        const view = this.app?.activeView;
+        if (view && visual) {
+            if (visual.eventHandler.isEnabled) visual.eventHandler.keyDown(view, e);
+            if (visual.viewHandler.isEnabled) visual.viewHandler.keyDown(view, e);
+            if (this.app!.executingCommand) e.stopImmediatePropagation();
+        }
+    };
+
+    private readonly commandKeyDown = (e: KeyboardEvent) => {
+        if (!this.canHandleKey(e)) return;
+
+        e.preventDefault();
+        const command = this.getCommand(e);
+        if (command !== undefined) {
+            PubSub.default.pub("executeCommand", command);
+        }
+    };
+
+    getKey(keys: Keys): string {
+        let key = keys.key;
+        if (keys.ctrlKey) key = "ctrl+" + key;
+        if (keys.shiftKey) key = "shift+" + key;
+        if (keys.altKey) key = "alt+" + key;
+        return key;
+    }
+
+    map(command: CommandKeys, keys: Keys) {
+        const key = this.getKey(keys);
+        this._keyMap.set(key, command);
+    }
+
+    getCommand(keys: Keys): CommandKeys | undefined {
+        const key = this.getKey(keys);
+        return this._keyMap.get(key);
+    }
+
+    addMap(map: HotkeyMap) {
+        const keys = Object.keys(map);
+        keys.forEach((key) => {
+            this._keyMap.set(key, map[key]);
+        });
+    }
+}

package/packages/chili/src/services/index.ts

@@ -0,0 +1,6 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+export * from "./commandService";
+export * from "./editorService";
+export * from "./hotkeyService";

package/packages/chili/src/snap/dimension.ts

@@ -0,0 +1,33 @@
+// Part of the Chili3d Project, under the AGPL-3.0 License.
+// See LICENSE file in the project root for full license information.
+
+export enum Dimension {
+    None = 0,
+    D1 = 1,
+    D2 = 2,
+    D3 = 4,
+
+    D1D2 = 1 | 2,
+    D1D2D3 = 1 | 2 | 4,
+}
+
+export namespace Dimension {
+    export function contains(d1: Dimension, d2: Dimension): boolean {
+        if (d2 === Dimension.None) return false;
+        return (d1 & d2) === d2;
+    }
+
+    /**
+     *
+     * @param value 1: D1, 2: D2, 3: D3, other: None
+     * @returns
+     */
+    export function from(value: number): Dimension {
+        const mapping: { [key: number]: Dimension } = {
+            1: Dimension.D1,
+            2: Dimension.D2,
+            3: Dimension.D3,
+        };
+        return mapping[value] || Dimension.None;
+    }
+}