Add group ctrl method in model class

source/Model/CtrlObject.ts

@@ -1,11 +1,17 @@
 import { LabelObject } from "./Label"
 import type { Model } from "./Model";
+import type { ObjectID } from "./Renderer";
 
 /**
  * 可控对象
  */
 class CtrlObject extends LabelObject {
 
+    /**
+     * 唯一标识符
+     */
+    public id: ObjectID;
+    
     /**
      * 控制模型
      */
@@ -14,9 +20,10 @@ class CtrlObject extends LabelObject {
     /**
      * 构造器
      */
-    public constructor(model: Model) {
+    public constructor(model: Model, id: ObjectID) {
         super();
         this.model = model;
+        this.id = id;
     }
 }
 

source/Model/Model.ts

@@ -2,12 +2,73 @@
 import { Individual } from "./Individual";
 import { Group } from "./Group";
 import { Emitter, EventType, EventMixin } from "./Emitter";
+import { CtrlObject } from "./CtrlObject";
+import { ObjectID } from "./Renderer";
+
+type ModelEvent = {
+    addGroup: Group;
+    deleteGroup: Group[];
+};
 
 /**
  * 模型 全局控制器
  */
-class Model extends Emitter<{}> {
+class Model extends Emitter<ModelEvent> {
 
+    /**
+     * 下一个需要分配的 ID
+     */
+    private idIndex: number = 1;
+    public get nextId(): number {
+        return this.idIndex ++;
+    }
+
+    /**
+     * 对象列表
+     */
+    public objectPool: CtrlObject[] = [];
+
+    /**
+     * 添加组
+     */
+    public addGroup(): void {
+        console.log(`Model: Creat group with id ${this.idIndex}`);
+        let group = new Group(this, this.nextId);
+        this.objectPool.push(group);
+        this.emit("addGroup", group);
+    }
+
+    /**
+     * 删除组
+     */
+    public deleteGroup(groups: Group[] | ObjectID[]): void {
+        let deletedGroups: Group[] = [];
+        this.objectPool = this.objectPool.filter((object) => {
+            if (!(object instanceof Group)) return true;
+            let deletedGroup: Group | undefined;
+
+            for (let i = 0; i < groups.length; i++) {
+                if (groups[i] instanceof Group) {
+                    if (groups[i] === object) {
+                        deletedGroup = object;
+                    }
+                } else {
+                    if (groups[i] === object.id) {
+                        deletedGroup = object;
+                    }
+                }
+            }
+
+            if (deletedGroup) {
+                deletedGroups.push(deletedGroup);
+                return false;
+            } else {
+                return true;
+            }
+        });
+
+        this.emit("deleteGroup", deletedGroups);
+    }
 }
 
 export {
@@ -16,5 +77,7 @@ export {
     Emitter,
     EventType,
     EventMixin,
-    Model
+    Model,
+    CtrlObject,
+    ObjectID
 }

source/Page/Laboratory/Laboratory.tsx

@@ -1,6 +1,7 @@
 import { Component, ReactNode, createRef } from "react";
 import { ClassicRenderer } from "@GLRender/ClassicRenderer";
 import { Entry } from "../Entry/Entry";
+import { Model } from "@Model/Model";
 import "./Laboratory.scss";
 
 class Laboratory extends Component {
@@ -21,13 +22,15 @@ class Laboratory extends Component {
         }
 
         const canvas = document.createElement("canvas");
-
+        const renderer = new ClassicRenderer(canvas, { className: "canvas" });
-        const renderer = new ClassicRenderer(canvas, {
+        this.canvasContRef.current.appendChild(renderer.canvas.dom);
-            className: "canvas"
-        });
 
         renderer.onLoad();
 
+        let model = new Model();
+        model.addGroup();
+        model.addGroup();
+
         // 测试渲染器
         if (true) {
             renderer.points("0");
@@ -49,8 +52,7 @@ class Laboratory extends Component {
         }
 
         (window as any).renderer = renderer;
-
+        (window as any).model = model;
-        this.canvasContRef.current.appendChild(renderer.canvas.dom);
     }
 }