bg2e-js 2.3.11 → 2.3.13

package/src/manipulation/SelectionBuffer.ts

@@ -1,81 +1,81 @@
-import { RenderLayer } from "../base/PolyList";
-import Texture, { TextureComponentFormat, TextureRenderTargetAttachment, TextureWrap } from "../base/Texture";
-import PickSelectionShader from "../shaders/PickSelectionShader";
-import { FrameVisitor } from "../render/SceneRenderer";
-import RenderQueue from "../render/RenderQueue";
-import Vec from "../math/Vec";
-import Mat4 from "../math/Mat4";
-import Transform from "../scene/Transform";
-import Renderer from "../render/Renderer";
-import RenderBuffer from "../render/RenderBuffer";
-import Camera from "../scene/Camera";
-import Node from "../scene/Node";
-
-export default class SelectionBuffer {
-    protected _renderer: Renderer;
-    protected _targetTexture: Texture | null = null;
-    protected _renderBuffer: RenderBuffer | null = null;
-    protected _shader: PickSelectionShader | null = null
-    protected _renderQueue: RenderQueue | null = null;
-    protected _frameVisitor: FrameVisitor | null = null;
-
-    constructor(renderer: Renderer) {
-        this._renderer = renderer;
-    }
-    
-    async init() {
-        const renderer = this._renderer;
-        this._targetTexture = new Texture();
-        this._targetTexture.renderTargetAttachment = TextureRenderTargetAttachment.COLOR_ATTACHMENT_0;
-        this._targetTexture.componentFormat = TextureComponentFormat.UNSIGNED_BYTE;
-        this._targetTexture.wrapModeXY = TextureWrap.CLAMP;
-
-        this._renderBuffer = renderer.factory.renderBuffer();
-
-        await this._renderBuffer.attachTexture(this._targetTexture);
-
-        this._shader = new PickSelectionShader(renderer);
-        await this._shader.load();
-
-        this._renderQueue = new RenderQueue(renderer);
-        this._renderQueue.enableQueue(RenderLayer.SELECTION_DEFAULT, this._shader);
-
-        this._frameVisitor = new FrameVisitor(this._renderQueue);
-    }
-
-    reshape(width: number, height: number) {
-        if (!this._renderBuffer) {
-            return;
-        }
-        this._renderBuffer.size = new Vec(width,height);
-    }
-
-    draw(scene: Node, camera: Camera, x: number, y: number, width = 1, height = 1) {
-        if (!this._renderQueue || !this._frameVisitor || !this._renderBuffer) {
-            return;
-        }
-        const cameraView = Mat4.GetInverted(Transform.GetWorldMatrix(camera.node));
-        this._renderQueue.viewMatrix = cameraView;
-        this._renderQueue.projectionMatrix = camera.projectionMatrix;
-        this._renderQueue.newFrame();
-        this._frameVisitor.modelMatrix.identity();
-        scene.accept(this._frameVisitor);
-
-        let result = null;
-        this._renderBuffer.update(() => {
-            this._renderBuffer?.frameBuffer.clear();
-            this._renderQueue?.draw(RenderLayer.SELECTION_DEFAULT);
-            result = this._renderBuffer?.readPixels(x, y, width, height);
-        });
-
-        return result;
-    }
-
-    destroy() {
-        this._renderBuffer?.destroy();
-        this._targetTexture?.destroy();
-        this._renderBuffer = null;
-        this._targetTexture = null;
-    }
-}
-
+import { RenderLayer } from "../base/PolyList";
+import Texture, { TextureComponentFormat, TextureRenderTargetAttachment, TextureWrap } from "../base/Texture";
+import PickSelectionShader from "../shaders/PickSelectionShader";
+import { FrameVisitor } from "../render/SceneRenderer";
+import RenderQueue from "../render/RenderQueue";
+import Vec from "../math/Vec";
+import Mat4 from "../math/Mat4";
+import Transform from "../scene/Transform";
+import Renderer from "../render/Renderer";
+import RenderBuffer from "../render/RenderBuffer";
+import Camera from "../scene/Camera";
+import Node from "../scene/Node";
+
+export default class SelectionBuffer {
+    protected _renderer: Renderer;
+    protected _targetTexture: Texture | null = null;
+    protected _renderBuffer: RenderBuffer | null = null;
+    protected _shader: PickSelectionShader | null = null
+    protected _renderQueue: RenderQueue | null = null;
+    protected _frameVisitor: FrameVisitor | null = null;
+
+    constructor(renderer: Renderer) {
+        this._renderer = renderer;
+    }
+    
+    async init() {
+        const renderer = this._renderer;
+        this._targetTexture = new Texture();
+        this._targetTexture.renderTargetAttachment = TextureRenderTargetAttachment.COLOR_ATTACHMENT_0;
+        this._targetTexture.componentFormat = TextureComponentFormat.UNSIGNED_BYTE;
+        this._targetTexture.wrapModeXY = TextureWrap.CLAMP;
+
+        this._renderBuffer = renderer.factory.renderBuffer();
+
+        await this._renderBuffer.attachTexture(this._targetTexture);
+
+        this._shader = new PickSelectionShader(renderer);
+        await this._shader.load();
+
+        this._renderQueue = new RenderQueue(renderer);
+        this._renderQueue.enableQueue(RenderLayer.SELECTION_DEFAULT, this._shader);
+
+        this._frameVisitor = new FrameVisitor(this._renderQueue);
+    }
+
+    reshape(width: number, height: number) {
+        if (!this._renderBuffer) {
+            return;
+        }
+        this._renderBuffer.size = new Vec(width,height);
+    }
+
+    draw(scene: Node, camera: Camera, x: number, y: number, width = 1, height = 1) {
+        if (!this._renderQueue || !this._frameVisitor || !this._renderBuffer) {
+            return;
+        }
+        const cameraView = Mat4.GetInverted(Transform.GetWorldMatrix(camera.node));
+        this._renderQueue.viewMatrix = cameraView;
+        this._renderQueue.projectionMatrix = camera.projectionMatrix;
+        this._renderQueue.newFrame();
+        this._frameVisitor.modelMatrix.identity();
+        scene.accept(this._frameVisitor);
+
+        let result = null;
+        this._renderBuffer.update(() => {
+            this._renderBuffer?.frameBuffer.clear();
+            this._renderQueue?.draw(RenderLayer.SELECTION_DEFAULT);
+            result = this._renderBuffer?.readPixels(x, y, width, height);
+        });
+
+        return result;
+    }
+
+    destroy() {
+        this._renderBuffer?.destroy();
+        this._targetTexture?.destroy();
+        this._renderBuffer = null;
+        this._targetTexture = null;
+    }
+}
+

package/src/manipulation/SelectionHighlight.ts

@@ -1,84 +1,105 @@
-
-import { RenderLayer } from "../base/PolyList";
-import Texture, { TextureRenderTargetAttachment, TextureComponentFormat, TextureWrap } from "../base/Texture";
-import Mat4 from "../math/Mat4";
-import Vec from "../math/Vec";
-import RenderQueue from "../render/RenderQueue";
-import { FrameVisitor } from "../render/SceneRenderer";
-import Transform from "../scene/Transform";
-import PickSelectionShader from "../shaders/PickSelectionShader";
-import SelectionHighlightShader from "../shaders/SelectionHighlightShader";
-import Renderer from "../render/Renderer";
-import RenderBuffer from "../render/RenderBuffer";
-import Node from "../scene/Node";
-import Camera from "../scene/Camera";
-
-export default class SelectionHighlight {
-    protected _renderer: Renderer;
-    protected _targetTexture: Texture | null = null
-    protected _renderBuffer: RenderBuffer | null = null;
-    protected _shader: PickSelectionShader | null = null;
-    protected _renderQueue: RenderQueue | null = null
-    protected _frameVisitor: FrameVisitor | null = null;
-    protected _selectionDrawShader: SelectionHighlightShader | null = null;
-
-    constructor(renderer: Renderer) {
-        this._renderer = renderer;
-    }
-
-    async init() {
-        const renderer = this._renderer;
-        this._targetTexture = new Texture();
-        this._targetTexture.renderTargetAttachment = TextureRenderTargetAttachment.COLOR_ATTACHMENT_0;
-        this._targetTexture.componentFormat = TextureComponentFormat.UNSIGNED_BYTE;
-        this._targetTexture.wrapModeXY = TextureWrap.CLAMP;
-
-        this._renderBuffer = renderer.factory.renderBuffer();
-        await this._renderBuffer.attachTexture(this._targetTexture);
-
-        this._shader = new PickSelectionShader(renderer);
-        await this._shader.load();
-        this._shader.forceDraw = false;
-
-        this._renderQueue = new RenderQueue(renderer);
-        this._renderQueue.enableQueue(RenderLayer.SELECTION_DEFAULT, this._shader);
-
-        this._frameVisitor = new FrameVisitor(this._renderQueue);
-
-        this._selectionDrawShader = new SelectionHighlightShader(renderer);
-        await this._selectionDrawShader.load();
-    }
-
-    setViewportSize(width: number, height: number) {
-        this._renderBuffer!.size = new Vec(width,height);
-    }
-
-    draw(scene: Node, camera: Camera) {
-        if (!this._renderQueue || !this._frameVisitor || !this._renderBuffer || !this._targetTexture) {
-            return;
-        }
-
-        const cameraView = Mat4.GetInverted(Transform.GetWorldMatrix(camera.node));
-        this._renderQueue.viewMatrix = cameraView;
-        this._renderQueue.projectionMatrix = camera.projectionMatrix;
-        this._renderQueue.newFrame();
-        this._frameVisitor.modelMatrix.identity();
-        scene.accept(this._frameVisitor);
-
-        this._renderBuffer.update(() => {
-            this._renderBuffer?.frameBuffer.clear();
-            this._renderQueue?.draw(RenderLayer.SELECTION_DEFAULT);
-        });
-
-        // TODO: Draw target texture using a border detection shader
-        const shader = this._selectionDrawShader;
-        this._renderer.presentTexture(this._targetTexture, { clearBuffers: false, shader });
-    }
-
-    destroy() {
-        this._renderBuffer?.destroy();
-        this._targetTexture?.destroy();
-        this._renderBuffer = null;
-        this._targetTexture = null;
-    }
-}
+
+import { RenderLayer } from "../base/PolyList";
+import Texture, { TextureRenderTargetAttachment, TextureComponentFormat, TextureWrap } from "../base/Texture";
+import Mat4 from "../math/Mat4";
+import Vec from "../math/Vec";
+import RenderQueue from "../render/RenderQueue";
+import { FrameVisitor } from "../render/SceneRenderer";
+import Transform from "../scene/Transform";
+import PickSelectionShader from "../shaders/PickSelectionShader";
+import SelectionHighlightShader from "../shaders/SelectionHighlightShader";
+import Renderer from "../render/Renderer";
+import RenderBuffer from "../render/RenderBuffer";
+import Node from "../scene/Node";
+import Camera from "../scene/Camera";
+import Color from "../base/Color";
+
+export default class SelectionHighlight {
+    protected _renderer: Renderer;
+    protected _targetTexture: Texture | null = null
+    protected _renderBuffer: RenderBuffer | null = null;
+    protected _shader: PickSelectionShader | null = null;
+    protected _renderQueue: RenderQueue | null = null
+    protected _frameVisitor: FrameVisitor | null = null;
+    protected _selectionDrawShader: SelectionHighlightShader | null = null;
+
+    constructor(renderer: Renderer) {
+        this._renderer = renderer;
+    }
+
+    get borderColor() : Color {
+        return this._selectionDrawShader?.borderColor || new Vec(1,0,0,1);
+    }
+
+    set borderColor(color: Color) {
+        if (this._selectionDrawShader) {
+            this._selectionDrawShader.borderColor = color;
+        }
+    }
+
+    get borderWidth() : number {
+        return this._selectionDrawShader?.borderWidth || 3;
+    }
+
+    set borderWidth(width: number) {
+        if (this._selectionDrawShader) {
+            this._selectionDrawShader.borderWidth = width;
+        }
+    }
+
+    async init() {
+        const renderer = this._renderer;
+        this._targetTexture = new Texture();
+        this._targetTexture.renderTargetAttachment = TextureRenderTargetAttachment.COLOR_ATTACHMENT_0;
+        this._targetTexture.componentFormat = TextureComponentFormat.UNSIGNED_BYTE;
+        this._targetTexture.wrapModeXY = TextureWrap.CLAMP;
+
+        this._renderBuffer = renderer.factory.renderBuffer();
+        await this._renderBuffer.attachTexture(this._targetTexture);
+
+        this._shader = new PickSelectionShader(renderer);
+        await this._shader.load();
+        this._shader.forceDraw = false;
+
+        this._renderQueue = new RenderQueue(renderer);
+        this._renderQueue.enableQueue(RenderLayer.SELECTION_DEFAULT, this._shader);
+
+        this._frameVisitor = new FrameVisitor(this._renderQueue);
+
+        this._selectionDrawShader = new SelectionHighlightShader(renderer);
+        await this._selectionDrawShader.load();
+    }
+
+    setViewportSize(width: number, height: number) {
+        this._renderBuffer!.size = new Vec(width,height);
+    }
+
+    draw(scene: Node, camera: Camera) {
+        if (!this._renderQueue || !this._frameVisitor || !this._renderBuffer || !this._targetTexture) {
+            return;
+        }
+
+        const cameraView = Mat4.GetInverted(Transform.GetWorldMatrix(camera.node));
+        this._renderQueue.viewMatrix = cameraView;
+        this._renderQueue.projectionMatrix = camera.projectionMatrix;
+        this._renderQueue.newFrame();
+        this._frameVisitor.modelMatrix.identity();
+        scene.accept(this._frameVisitor);
+
+        this._renderBuffer.update(() => {
+            this._renderBuffer?.frameBuffer.clear();
+            this._renderQueue?.draw(RenderLayer.SELECTION_DEFAULT);
+        });
+
+        // TODO: Draw target texture using a border detection shader
+        const shader = this._selectionDrawShader;
+        this._renderer.presentTexture(this._targetTexture, { clearBuffers: false, shader });
+    }
+
+    destroy() {
+        this._renderBuffer?.destroy();
+        this._targetTexture?.destroy();
+        this._renderBuffer = null;
+        this._targetTexture = null;
+    }
+}

package/src/manipulation/SelectionIdAssignVisitor.ts

@@ -1,97 +1,97 @@
-import NodeVisitor from "../scene/NodeVisitor";
-import SelectionMode from "./SelectionMode";
-import Color from "../base/Color";
-import Node from "../scene/Node";
-
-const getColor = (comps: number[]) => "" + comps[0] + comps[1] + comps[2];
-
-export default class SelectionAssignVisitor extends NodeVisitor {
-    protected _selectionMode: SelectionMode;
-    protected _elements: Record<string, any>;
-    protected _r: number = 0;
-    protected _g: number = 0;
-    protected _b: number = 0;
-
-    constructor() {
-        super();
-
-        this._selectionMode = SelectionMode.POLY_LIST;
-        this._elements = {};
-    }
-
-    set selectionMode(mode) {
-        this._selectionMode = mode;
-        this.clear();
-    }
-
-    get selectionMode() {
-        return this._selectionMode;
-    }
-
-    clear() {
-        this._r = 0;
-        this._g = 0;
-        this._b = 0;
-        this._elements = {};
-    }
-
-    getNextColor() {
-        const getId = () => {
-            return [ Math.round(Math.random()*255),
-                     Math.round(Math.random()*255),
-                     Math.round(Math.random()*255)];
-        }
-        
-        let components = getId();
-        let color = getColor(components);
-        while (this._elements[color]) {
-            components = getId();
-            color = getColor(components);
-        }
-
-        this._r = components[0];
-        this._g = components[1];
-        this._b = components[2];
-
-        return new Color([components[0]/255, components[1]/255, components[2]/255, 1]);
-    }
-
-    findElement(pickedColor: Uint8Array | undefined | null) {
-        if (!pickedColor) {
-            return null;
-        }
-
-        const color = [
-            pickedColor[0],
-            pickedColor[1],
-            pickedColor[2]
-        ];
-        return this._elements[getColor(color)];
-    }
-
-    visit(node: Node) {
-        const { drawable } = node;
-        if (drawable) {
-            let color = this.getNextColor();
-            drawable.items.forEach(({polyList}, i, array) => {
-                if (polyList.isSelectable) {
-                    polyList.colorCode = color;
-                    polyList.selected = false;
-                    const colorCode = getColor([
-                        Math.round(color[0] * 255),
-                        Math.round(color[1] * 255),
-                        Math.round(color[2] * 255)
-                    ]);
-                    this._elements[colorCode] = { polyList, drawable };
-                }
-
-                // Get new color code for the next polyList, only if this is not the
-                // last item, and the selection mode is POLY_LIST, otherwise we'll
-                // use the same color code for all polyList in the drawable
-                if (i<array.length-1 && this._selectionMode == SelectionMode.POLY_LIST) {
-                    color = this.getNextColor();
-                }
-            });
-        }
-    }
+import NodeVisitor from "../scene/NodeVisitor";
+import SelectionMode from "./SelectionMode";
+import Color from "../base/Color";
+import Node from "../scene/Node";
+
+const getColor = (comps: number[]) => "" + comps[0] + comps[1] + comps[2];
+
+export default class SelectionAssignVisitor extends NodeVisitor {
+    protected _selectionMode: SelectionMode;
+    protected _elements: Record<string, any>;
+    protected _r: number = 0;
+    protected _g: number = 0;
+    protected _b: number = 0;
+
+    constructor() {
+        super();
+
+        this._selectionMode = SelectionMode.POLY_LIST;
+        this._elements = {};
+    }
+
+    set selectionMode(mode) {
+        this._selectionMode = mode;
+        this.clear();
+    }
+
+    get selectionMode() {
+        return this._selectionMode;
+    }
+
+    clear() {
+        this._r = 0;
+        this._g = 0;
+        this._b = 0;
+        this._elements = {};
+    }
+
+    getNextColor() {
+        const getId = () => {
+            return [ Math.round(Math.random()*255),
+                     Math.round(Math.random()*255),
+                     Math.round(Math.random()*255)];
+        }
+        
+        let components = getId();
+        let color = getColor(components);
+        while (this._elements[color]) {
+            components = getId();
+            color = getColor(components);
+        }
+
+        this._r = components[0];
+        this._g = components[1];
+        this._b = components[2];
+
+        return new Color([components[0]/255, components[1]/255, components[2]/255, 1]);
+    }
+
+    findElement(pickedColor: Uint8Array | undefined | null) {
+        if (!pickedColor) {
+            return null;
+        }
+
+        const color = [
+            pickedColor[0],
+            pickedColor[1],
+            pickedColor[2]
+        ];
+        return this._elements[getColor(color)];
+    }
+
+    visit(node: Node) {
+        const { drawable } = node;
+        if (drawable) {
+            let color = this.getNextColor();
+            drawable.items.forEach(({polyList}, i, array) => {
+                if (polyList.isSelectable) {
+                    polyList.colorCode = color;
+                    polyList.selected = false;
+                    const colorCode = getColor([
+                        Math.round(color[0] * 255),
+                        Math.round(color[1] * 255),
+                        Math.round(color[2] * 255)
+                    ]);
+                    this._elements[colorCode] = { polyList, drawable };
+                }
+
+                // Get new color code for the next polyList, only if this is not the
+                // last item, and the selection mode is POLY_LIST, otherwise we'll
+                // use the same color code for all polyList in the drawable
+                if (i<array.length-1 && this._selectionMode == SelectionMode.POLY_LIST) {
+                    color = this.getNextColor();
+                }
+            });
+        }
+    }
 }