@openglobus/og 0.17.1 → 0.18.0

package/src/{og/entity/LabelWorker.js → entity/LabelWorker.ts}

@@ -1,24 +1,27 @@
-"use strict";
-
-// import { QueueArray } from '../QueueArray.js';
-
-import { BaseWorker } from "../utils/BaseWorker.js";
+import {BaseWorker} from "../utils/BaseWorker";
+import {Label} from "../entity/Label";
+import {LabelHandler} from "../entity/LabelHandler";
 
 export const LOCK_UPDATE = -2;
 export const LOCK_FREE = -1;
 
-class LabelWorker extends BaseWorker {
-    constructor(numWorkers = 4) {
-        super(numWorkers, _programm);
-        this._source = new Map();
+interface LabelInfo {
+    label: Label;
+    handler: LabelHandler;
+}
+
+class LabelWorker extends BaseWorker<LabelInfo> {
+
+    constructor(numWorkers: number = 4) {
+        super(numWorkers, LABEL_PROGRAM);
     }
 
-    _onMessage(e) {
-        let s = this._source.get(e.data.id);
+    protected override _onMessage(e: MessageEvent) {
+        let s = this._source.get(e.data.id)!;
 
         if (s.label._lockId === LOCK_UPDATE) {
             requestAnimationFrame(() => {
-                this.make({ handler: s.handler, label: s.label });
+                this.make({handler: s.handler, label: s.label});
             });
         } else {
             s.handler.workerCallback(e.data, s.label);
@@ -28,35 +31,22 @@ class LabelWorker extends BaseWorker {
     }
 
 
-    make(data) {
+    public override make(data: LabelInfo) {
         let label = data.label,
             handler = data.handler;
 
         if (handler._entityCollection) {
 
             if (this._workerQueue.length) {
-                var w = this._workerQueue.pop();
-
-                this._source.set(this._id, data);
-
-                let labelData = new Float32Array([
-                    /*0*/this._id++,
-                    /*1*/handler._maxLetters,
-                    /*2*/label.getVisibility() ? 1 : 0,
-                    /*3, 4, 5*/label._positionHigh.x, label._positionHigh.y, label._positionHigh.z,
-                    /*6, 7, 8*/label._positionLow.x, label._positionLow.y, label._positionLow.z,
-                    /*9*/label._size,
-                    /*10, 11, 12*/label._offset.x, label._offset.y, label._offset.z,
-                    /*13, 14, 15, 16*/label._color.x, label._color.y, label._color.z, label._color.w,
-                    /*17*/label._rotation,
-                    /*18, 19, 20*/label._alignedAxis.x, label._alignedAxis.y, label._alignedAxis.z,
-                    /*21*/label._fontIndex,
-                    /*22*/label._outline,
-                    /*23, 24, 25, 26*/label._outlineColor.x, label._outlineColor.y, label._outlineColor.z, label._outlineColor.w,
-                    /*27, 28, 29*/label._entity._pickingColor.x, label._entity._pickingColor.y, label._entity._pickingColor.z
-                ]);
+                let w = this._workerQueue.pop()!;
+
+                this._source.set(this._sourceId, data);
+
+                let labelData = label.serializeWorkerData(this._sourceId);
+
+                label._lockId = this._sourceId;
 
-                label._lockId = this._id;
+                this._sourceId++;
 
                 w.postMessage({
                     labelData: labelData
@@ -70,7 +60,7 @@ class LabelWorker extends BaseWorker {
     }
 }
 
-const _programm = `'use strict';
+const LABEL_PROGRAM = `'use strict';
 
     function concatTypedArrays(dest, index, source) {
         let len = source.length,
@@ -191,4 +181,4 @@ const _programm = `'use strict';
             ]);
     }`;
 
-export { LabelWorker };
+export {LabelWorker};

package/src/{og/entity/PointCloud.js → entity/PointCloud.ts}

@@ -1,7 +1,30 @@
-"use strict";
+import {Entity} from "./Entity";
+import {PointCloudHandler} from "./PointCloudHandler";
+import {RenderNode} from "../scene/RenderNode";
+import {Vec3} from "../math/Vec3";
+import {Vec4} from "../math/Vec4";
+import {WebGLBufferExt} from "../webgl/Handler";
+import {EntityCollection} from "./EntityCollection";
+
+export interface IPointCloudParams {
+    visibility?: boolean;
+    pointSize?: number;
+    pickingScale?: number;
+    points?: Poi[];
+}
 
-import { Vec3 } from "../math/Vec3.js";
-import { Vec4 } from "../math/Vec4.js";
+type Poi = [number, number, number, number, number, number, number, any | undefined];
+
+interface IPoint {
+    _entity: Entity | null;
+    _pickingColor: Vec3;
+    _entityCollection: EntityCollection | null;
+    index: number;
+    position: Vec3;
+    color: Vec4;
+    pointCloud: PointCloud;
+    properties: any
+}
 
 const COORDINATES_BUFFER = 0;
 const COLOR_BUFFER = 1;
@@ -12,9 +35,9 @@ const PICKING_COLOR_BUFFER = 2;
  * @class
  * @param {*} [options] - Point cloud options:
  * @param {Array.<Array.<number>>} [options.points] - Points cartesian coordinates array,
- * where first three is cartesian coordinates, next fourth is a RGBA color, and last is an point properties.
+ * where first three is cartesian coordinates, next fourth is an RGBA color, and last is a point properties.
  * @param {number} [options.pointSize] - Point screen size in pixels.
- * @param {number} [options.pickingDistance] - Point border picking size in screen pixels.
+ * @param {number} [options.pickingScale] - Point border picking size in screen pixels.
  * @param {boolean} [options.visibility] - Point cloud visibility.
  * @example <caption>Creates point cloud with two ten pixel size points</caption>
  * new og.Entity({
@@ -28,16 +51,90 @@ const PICKING_COLOR_BUFFER = 2;
  * });
  */
 class PointCloud {
-    constructor(options) {
-        options = options || {};
+    static __counter__: number = 0;
+    protected __id: number;
 
-        /**
-         * Object unic identifier.
-         * @public
-         * @readonly
-         * @type {number}
-         */
-        this.id = PointCloud._staticCounter++;
+    /**
+     * Cloud visibility.
+     * @public
+     * @type {boolean}
+     */
+    public visibility: boolean;
+
+    /**
+     * Point screen size in pixels.
+     * @public
+     * @type {number}
+     */
+    public pointSize: number;
+
+    /**
+     * Point picking border size in pixels.
+     * @public
+     * @type {number}
+     */
+    public pickingScale: number;
+
+    /**
+     * Parent collection render node.
+     * @protected
+     * @type {RenderNode | null}
+     */
+    protected _renderNode: RenderNode | null;
+
+    /**
+     * Entity instance that holds this point cloud.
+     * @public
+     * @type {Entity | null}
+     */
+    public _entity: Entity | null;
+
+    /**
+     * Points properties.
+     * @protected
+     * @type {IPoint[]}
+     */
+    protected _points: IPoint[];
+
+    /**
+     * Coordinates array.
+     * @protected
+     * @type {number[]}
+     */
+    protected _coordinatesData: number[];
+
+    /**
+     * Color array.
+     * @protected
+     * @type {number[]}
+     */
+    protected _colorData: number[];
+
+    /**
+     * Picking color array.
+     * @protected
+     * @type {number[]}
+     */
+    protected _pickingColorData: number[];
+
+    protected _coordinatesBuffer: WebGLBufferExt | null;
+    protected _colorBuffer: WebGLBufferExt | null;
+    protected _pickingColorBuffer: WebGLBufferExt | null;
+
+    /**
+     * Handler that stores and renders this object.
+     * @public
+     * @type {PointCloudHandler}
+     */
+    public _handler: PointCloudHandler | null;
+    public _handlerIndex: number;
+
+    protected _buffersUpdateCallbacks: Function[];
+    protected _changedBuffers: boolean[];
+
+    constructor(options: IPointCloudParams = {}) {
+
+        this.__id = PointCloud.__counter__++;
 
         /**
          * Cloud visibility.
@@ -58,7 +155,7 @@ class PointCloud {
          * @public
          * @type {number}
          */
-        this.pickingDistance = options.pickingDistance || 0;
+        this.pickingScale = options.pickingScale || 0;
 
         /**
          * Parent collection render node.
@@ -77,7 +174,7 @@ class PointCloud {
         /**
          * Points properties.
          * @private
-         * @type {Array.<*>}
+         * @type {IPoint[]}
          */
         this._points = [];
 
@@ -121,25 +218,16 @@ class PointCloud {
 
         this._changedBuffers = new Array(this._buffersUpdateCallbacks.length);
 
-        this.setPoints(options.points);
-    }
-
-    static get _staticCounter() {
-        if (!this._counter && this._counter !== 0) {
-            this._counter = 0;
+        if (options.points) {
+            this.setPoints(options.points);
         }
-        return this._counter;
-    }
-
-    static set _staticCounter(n) {
-        this._counter = n;
     }
 
     /**
      * Clears point cloud data
      * @public
      */
-    clear() {
+    public clear() {
         this._points.length = 0;
         this._points = [];
 
@@ -155,28 +243,19 @@ class PointCloud {
         this._deleteBuffers();
     }
 
-    /**
-     * Set point cloud opacity.
-     * @public
-     * @param {number} opacity - Cloud opacity.
-     */
-    setOpacity(opacity) {
-        this.opacity = opacity;
-    }
-
     /**
      * Sets cloud visibility.
      * @public
-     * @param {number} visibility - Visibility flag.
+     * @param {boolean} visibility - Visibility flag.
      */
-    setVisibility(visibility) {
+    public setVisibility(visibility: boolean) {
         this.visibility = visibility;
     }
 
     /**
-     * @return {boolean} Point cloud visibily.
+     * @return {boolean} Point cloud visibility.
      */
-    getVisibility() {
+    public getVisibility(): boolean {
         return this.visibility;
     }
 
@@ -185,7 +264,7 @@ class PointCloud {
      * @public
      * @param {RenderNode}  renderNode - Assigned render node.
      */
-    setRenderNode(renderNode) {
+    public setRenderNode(renderNode: RenderNode) {
         this._renderNode = renderNode;
         this._setPickingColors();
     }
@@ -194,7 +273,7 @@ class PointCloud {
      * Removes from entity.
      * @public
      */
-    remove() {
+    public remove() {
         this._entity = null;
         this._handler && this._handler.remove(this);
     }
@@ -202,31 +281,37 @@ class PointCloud {
     /**
      * Adds points to render.
      * @public
-     * @param {Array.<Array<number>>} points - Point cloud array.
+     * @param { Poi[]} points - Point cloud array.
      * @example
      * var points = [[0, 0, 0, 255, 255, 255, 255, { 'name': 'White point' }], [100, 100, 0, 255, 0, 0, 255, { 'name': 'Red point' }]];
      */
-    setPoints(points) {
+    public setPoints(points: Poi[]) {
         this.clear();
         for (let i = 0; i < points.length; i++) {
-            var pi = points[i];
-            var pos = new Vec3(pi[0], pi[1], pi[2]),
+            let pi = points[i];
+
+            let pos = new Vec3(pi[0], pi[1], pi[2]),
                 col = new Vec4(pi[3], pi[4], pi[5], pi[6] == undefined ? 255.0 : pi[6]);
+
             this._coordinatesData.push(pos.x, pos.y, pos.z);
+
             this._colorData.push(col.x / 255.0, col.y / 255.0, col.z / 255.0, col.w / 255.0);
-            var p = {
+
+            let p = {
+                _entity: this._entity,
                 _pickingColor: new Vec3(),
-                _entityCollection: this._entity && this._entity._entityCollection,
+                _entityCollection: this._entity ? this._entity._entityCollection : null,
                 index: i,
                 position: pos,
                 color: col,
                 pointCloud: this,
                 properties: pi[7] || {}
             };
+
             this._points.push(p);
 
-            if (this._renderNode) {
-                this._renderNode.renderer.assignPickingColor(p);
+            if (this._renderNode && this._renderNode.renderer) {
+                this._renderNode.renderer.assignPickingColor<IPoint>(p);
                 this._pickingColorData.push(
                     p._pickingColor.x / 255.0,
                     p._pickingColor.y / 255.0,
@@ -241,29 +326,25 @@ class PointCloud {
         this._changedBuffers[PICKING_COLOR_BUFFER] = true;
     }
 
-    setPointPosition(index, x, y, z) {
+    public setPointPosition(index: number, x: number, y: number, z: number) {
         // TODO: ...
-
         this._changedBuffers[COORDINATES_BUFFER] = true;
     }
 
-    setPointColor(index, r, g, b, a) {
+    public setPointColor(index: number, r: number, g: number, b: number, a: number) {
         // TODO: ...
-
         this._changedBuffers[COLOR_BUFFER] = true;
     }
 
-    addPoints(points) {
+    public addPoints(points: Poi[]) {
         // TODO: ...
-
         this._changedBuffers[COORDINATES_BUFFER] = true;
         this._changedBuffers[COLOR_BUFFER] = true;
         this._changedBuffers[PICKING_COLOR_BUFFER] = true;
     }
 
-    addPoint(index, point) {
+    public addPoint(index: number, point: Poi) {
         // TODO: ...
-
         this._changedBuffers[COORDINATES_BUFFER] = true;
         this._changedBuffers[COLOR_BUFFER] = true;
         this._changedBuffers[PICKING_COLOR_BUFFER] = true;
@@ -273,49 +354,35 @@ class PointCloud {
      * Returns specific point by index.
      * @public
      * @param {number} index - Point index.
-     * @return {*} Specific point
+     * @return {Poi} Specific point
      */
-    getPoint(index) {
+    public getPoint(index: number): IPoint {
         return this._points[index];
     }
 
-    removePoint(index) {
+    public removePoint(index: number) {
         // TODO: ...
-
         this._changedBuffers[COORDINATES_BUFFER] = true;
         this._changedBuffers[COLOR_BUFFER] = true;
         this._changedBuffers[PICKING_COLOR_BUFFER] = true;
     }
 
-    insertPoint(index, point) {
+    public insertPoint(index: number, point: Poi) {
         // TODO: ...
-
         this._changedBuffers[COORDINATES_BUFFER] = true;
         this._changedBuffers[COLOR_BUFFER] = true;
         this._changedBuffers[PICKING_COLOR_BUFFER] = true;
     }
 
-    /**
-     * Each point iterator.
-     * @public
-     * @param {callback} callback -
-     */
-    each(callback) {
-        var i = this._points.length;
-        while (i--) {
-            callback && callback(this._points[i]);
-        }
-    }
-
-    draw() {
+    public draw() {
         if (this.visibility && this._coordinatesData.length) {
             this._update();
 
-            var rn = this._renderNode;
-            var r = rn.renderer;
-            var sh = r.handler.programs.pointCloud;
-            var p = sh._program;
-            var gl = r.handler.gl,
+            let rn = this._renderNode!;
+            let r = rn.renderer!;
+            let sh = r.handler.programs.pointCloud;
+            let p = sh._program;
+            let gl = r.handler.gl!,
                 sha = p.attributes,
                 shu = p.uniforms;
 
@@ -326,40 +393,28 @@ class PointCloud {
 
             sh.activate();
 
-            gl.uniformMatrix4fv(
-                shu.projectionViewMatrix,
-                false,
-                r.activeCamera._projectionViewMatrix._m
-            );
-
-            gl.uniform1f(shu.opacity, this._handler._entityCollection._fadingOpacity);
+            gl.uniformMatrix4fv(shu.projectionViewMatrix, false, r.activeCamera!.getProjectionViewMatrix());
 
+            gl.uniform1f(shu.opacity, this._handler!._entityCollection._fadingOpacity);
             gl.uniform1f(shu.pointSize, this.pointSize);
 
-            gl.bindBuffer(gl.ARRAY_BUFFER, this._coordinatesBuffer);
-            gl.vertexAttribPointer(
-                sha.coordinates,
-                this._coordinatesBuffer.itemSize,
-                gl.FLOAT,
-                false,
-                0,
-                0
-            );
+            gl.bindBuffer(gl.ARRAY_BUFFER, this._coordinatesBuffer as WebGLBuffer);
+            gl.vertexAttribPointer(sha.coordinates, this._coordinatesBuffer!.itemSize, gl.FLOAT, false, 0, 0);
 
-            gl.bindBuffer(gl.ARRAY_BUFFER, this._colorBuffer);
-            gl.vertexAttribPointer(sha.colors, this._colorBuffer.itemSize, gl.FLOAT, false, 0, 0);
+            gl.bindBuffer(gl.ARRAY_BUFFER, this._colorBuffer as WebGLBuffer);
+            gl.vertexAttribPointer(sha.colors, this._colorBuffer!.itemSize, gl.FLOAT, false, 0, 0);
 
-            gl.drawArrays(gl.POINTS, 0, this._coordinatesBuffer.numItems);
+            gl.drawArrays(gl.POINTS, 0, this._coordinatesBuffer!.numItems);
         }
     }
 
-    drawPicking() {
+    public drawPicking() {
         if (this.visibility && this._coordinatesData.length) {
-            var rn = this._renderNode;
-            var r = rn.renderer;
-            var sh = r.handler.programs.pointCloud;
-            var p = sh._program;
-            var gl = r.handler.gl,
+            let rn = this._renderNode!;
+            let r = rn.renderer!;
+            let sh = r.handler.programs.pointCloud;
+            let p = sh._program;
+            let gl = r.handler.gl!,
                 sha = p.attributes,
                 shu = p.uniforms;
 
@@ -370,47 +425,28 @@ class PointCloud {
             //     this._handler._entityCollection.polygonOffsetUnits
             // );
 
-            gl.uniformMatrix4fv(
-                shu.projectionViewMatrix,
-                false,
-                r.activeCamera._projectionViewMatrix._m
-            );
-
-            gl.uniform1f(shu.opacity, this._handler._entityCollection._fadingOpacity);
-
-            gl.uniform1f(shu.pointSize, this.pointSize + this.pickingDistance);
-
-            gl.bindBuffer(gl.ARRAY_BUFFER, this._coordinatesBuffer);
-            gl.vertexAttribPointer(
-                sha.coordinates,
-                this._coordinatesBuffer.itemSize,
-                gl.FLOAT,
-                false,
-                0,
-                0
-            );
-
-            gl.bindBuffer(gl.ARRAY_BUFFER, this._pickingColorBuffer);
-            gl.vertexAttribPointer(
-                sha.colors,
-                this._pickingColorBuffer.itemSize,
-                gl.FLOAT,
-                false,
-                0,
-                0
-            );
-
-            gl.drawArrays(gl.POINTS, 0, this._coordinatesBuffer.numItems);
+            gl.uniformMatrix4fv(shu.projectionViewMatrix, false, r.activeCamera!.getProjectionViewMatrix());
+
+            gl.uniform1f(shu.opacity, this._handler!._entityCollection._fadingOpacity);
+            gl.uniform1f(shu.pointSize, this.pointSize + this.pickingScale);
+
+            gl.bindBuffer(gl.ARRAY_BUFFER, this._coordinatesBuffer as WebGLBuffer);
+            gl.vertexAttribPointer(sha.coordinates, this._coordinatesBuffer!.itemSize, gl.FLOAT, false, 0, 0);
+
+            gl.bindBuffer(gl.ARRAY_BUFFER, this._pickingColorBuffer as WebGLBuffer);
+            gl.vertexAttribPointer(sha.colors, this._pickingColorBuffer!.itemSize, gl.FLOAT, false, 0, 0);
+
+            gl.drawArrays(gl.POINTS, 0, this._coordinatesBuffer!.numItems);
         }
     }
 
     /**
      * Update gl buffers.
-     * @private
+     * @protected
      */
-    _update() {
+    protected _update() {
         if (this._renderNode) {
-            var i = this._changedBuffers.length;
+            let i = this._changedBuffers.length;
             while (i--) {
                 if (this._changedBuffers[i]) {
                     this._buffersUpdateCallbacks[i].call(this);
@@ -422,16 +458,16 @@ class PointCloud {
 
     /**
      * Delete buffers
-     * @private
+     * @public
      */
-    _deleteBuffers() {
+    public _deleteBuffers() {
         if (this._renderNode) {
-            var r = this._renderNode.renderer,
-                gl = r.handler.gl;
+            let r = this._renderNode.renderer!,
+                gl = r.handler.gl!;
 
-            gl.deleteBuffer(this._coordinatesBuffer);
-            gl.deleteBuffer(this._colorBuffer);
-            gl.deleteBuffer(this._pickingColorBuffer);
+            gl.deleteBuffer(this._coordinatesBuffer as WebGLBuffer);
+            gl.deleteBuffer(this._colorBuffer as WebGLBuffer);
+            gl.deleteBuffer(this._pickingColorBuffer as WebGLBuffer);
         }
 
         this._coordinatesBuffer = null;
@@ -439,9 +475,9 @@ class PointCloud {
         this._pickingColorBuffer = null;
     }
 
-    _createCoordinatesBuffer() {
-        var h = this._renderNode.renderer.handler;
-        h.gl.deleteBuffer(this._coordinatesBuffer);
+    protected _createCoordinatesBuffer() {
+        let h = this._renderNode!.renderer!.handler;
+        h.gl!.deleteBuffer(this._coordinatesBuffer as WebGLBuffer);
         this._coordinatesBuffer = h.createArrayBuffer(
             new Float32Array(this._coordinatesData),
             3,
@@ -449,9 +485,9 @@ class PointCloud {
         );
     }
 
-    _createColorBuffer() {
-        var h = this._renderNode.renderer.handler;
-        h.gl.deleteBuffer(this._colorBuffer);
+    protected _createColorBuffer() {
+        let h = this._renderNode!.renderer!.handler;
+        h.gl!.deleteBuffer(this._colorBuffer as WebGLBuffer);
         this._colorBuffer = h.createArrayBuffer(
             new Float32Array(this._colorData),
             4,
@@ -459,9 +495,9 @@ class PointCloud {
         );
     }
 
-    _createPickingColorBuffer() {
-        var h = this._renderNode.renderer.handler;
-        h.gl.deleteBuffer(this._pickingColorBuffer);
+    protected _createPickingColorBuffer() {
+        let h = this._renderNode!.renderer!.handler;
+        h.gl!.deleteBuffer(this._pickingColorBuffer as WebGLBuffer);
         this._pickingColorBuffer = h.createArrayBuffer(
             new Float32Array(this._pickingColorData),
             4,
@@ -469,13 +505,13 @@ class PointCloud {
         );
     }
 
-    _setPickingColors() {
-        if (this._renderNode) {
+    protected _setPickingColors() {
+        if (this._renderNode && this._renderNode.renderer) {
             for (let i = 0; i < this._points.length; i++) {
-                var p = this._points[i];
+                let p = this._points[i];
                 p._entity = this._entity;
-                p._entityCollection = this._entity._entityCollection;
-                this._renderNode.renderer.assignPickingColor(p);
+                p._entityCollection = this._entity!._entityCollection;
+                this._renderNode.renderer.assignPickingColor<IPoint>(p);
                 this._pickingColorData.push(
                     p._pickingColor.x / 255.0,
                     p._pickingColor.y / 255.0,
@@ -488,4 +524,4 @@ class PointCloud {
     }
 }
 
-export { PointCloud };
+export {PointCloud};