@openglobus/og 0.11.5 → 0.11.6

package/src/og/entity/Label.js

@@ -2,11 +2,11 @@
  * @module og/entity/Label
  */
 
-'use strict';
+"use strict";
 
-import * as utils from '../utils/shared.js';
-import { BaseBillboard } from './BaseBillboard.js';
-import { Vec4 } from '../math/Vec4.js';
+import * as utils from "../utils/shared.js";
+import { BaseBillboard } from "./BaseBillboard.js";
+import { Vec4 } from "../math/Vec4.js";
 
 const ALIGN = {
     RIGHT: 0,
@@ -84,14 +84,19 @@ class Label extends BaseBillboard {
          * @private
          * @type {Vec4}
          */
-        this._outlineColor = utils.createColorRGBA(options.outlineColor, new Vec4(0.0, 0.0, 0.0, 1.0));
+        this._outlineColor = utils.createColorRGBA(
+            options.outlineColor,
+            new Vec4(0.0, 0.0, 0.0, 1.0)
+        );
 
         /**
          * Text horizontal align: "left", "right" and "center".
          * @private
          * @type {Label.ALIGN}
          */
-        this._align = options.align ? STR2ALIGN[options.align.trim().toLowerCase()] || ALIGN.RIGHT : ALIGN.RIGHT;
+        this._align = options.align
+            ? STR2ALIGN[options.align.trim().toLowerCase()] || ALIGN.RIGHT
+            : ALIGN.RIGHT;
 
         /**
          * Label font atlas index.
@@ -111,12 +116,14 @@ class Label extends BaseBillboard {
     /**
      * Sets lablel text.
      * @public
-     * @param {string} text - Text string. 
+     * @param {string} text - Text string.
      * It can't be bigger than maximum labelHandler _maxLetters value.
      */
     setText(text) {
         this._text = text.toString();
-        this._handler && this._handler.setText(this._handlerIndex, text, this._fontIndex, this._align);
+        if (this._isReady) {
+            this._handler.setText(this._handlerIndex, text, this._fontIndex, this._align);
+        }
     }
 
     /**
@@ -135,7 +142,11 @@ class Label extends BaseBillboard {
      */
     setAlign(align) {
         this._align = STR2ALIGN[align.trim().toLowerCase()];
-        this._handler && this._handler.setText(this._handlerIndex, this._text, this._fontIndex, this._align);
+        if (this._isReady) {
+            this._handler.setText(this._handlerIndex, this._text, this._fontIndex, this._align);
+        } else if (this._lockId !== -1) {
+            this._lockId = -2;
+        }
     }
 
     /**
@@ -173,7 +184,11 @@ class Label extends BaseBillboard {
      */
     setSize(size) {
         this._size = size;
-        this._handler && this._handler.setSizeArr(this._handlerIndex, size);
+        if (this._isReady) {
+            this._handler.setSizeArr(this._handlerIndex, size);
+        } else if (this._lockId !== -1) {
+            this._lockId = -2;
+        }
     }
 
     /**
@@ -192,7 +207,11 @@ class Label extends BaseBillboard {
      */
     setOutline(outline) {
         this._outline = outline;
-        this._handler && this._handler.setOutlineArr(this._handlerIndex, outline);
+        if (this._isReady) {
+            this._handler.setOutlineArr(this._handlerIndex, outline);
+        } else if (this._lockId !== -1) {
+            this._lockId = -2;
+        }
     }
 
     /**
@@ -229,7 +248,11 @@ class Label extends BaseBillboard {
         this._outlineColor.y = g;
         this._outlineColor.z = b;
         this._outlineColor.w = a;
-        this._handler && this._handler.setOutlineColorArr(this._handlerIndex, this._outlineColor);
+        if (this._isReady) {
+            this._handler.setOutlineColorArr(this._handlerIndex, this._outlineColor);
+        } else if (this._lockId !== -1) {
+            this._lockId = -2;
+        }
     }
 
     /**
@@ -242,7 +265,11 @@ class Label extends BaseBillboard {
         this._outlineColor.y = rgba.y;
         this._outlineColor.z = rgba.z;
         this._outlineColor.w = rgba.w;
-        this._handler && this._handler.setOutlineColorArr(this._handlerIndex, rgba);
+        if (this._isReady) {
+            this._handler.setOutlineColorArr(this._handlerIndex, rgba);
+        } else if (this._lockId !== -1) {
+            this._lockId = -2;
+        }
     }
 
     /**
@@ -270,7 +297,11 @@ class Label extends BaseBillboard {
      */
     setOutlineOpacity(opacity) {
         this._outlineColor.w = opacity;
-        this._handler && this._handler.setOutlineColorArr(this._handlerIndex, this._outlineColor);
+        if (this._isReady) {
+            this._handler.setOutlineColorArr(this._handlerIndex, this._outlineColor);
+        } else if (this._lockId !== -1) {
+            this._lockId = -2;
+        }
     }
 
     /**
@@ -295,9 +326,11 @@ class Label extends BaseBillboard {
 
     _applyFontIndex(fontIndex) {
         this._fontIndex = fontIndex;
-        if (this._handler) {
+        if (this._isReady) {
             this._handler.setFontIndexArr(this._handlerIndex, this._fontIndex);
             this._handler.setText(this._handlerIndex, this._text, this._fontIndex, this._align);
+        } else if (this._lockId !== -1) {
+            this._lockId = -2;
         }
     }
 
@@ -307,9 +340,11 @@ class Label extends BaseBillboard {
      * @param {utils.FontAtlas} fontAtlas - Font atlas.
      */
     assignFontAtlas(fontAtlas) {
-        !this._fontAtlas && (this._fontAtlas = fontAtlas);
+        if (!this._fontAtlas) {
+            this._fontAtlas = fontAtlas;
+        }
         this.update();
-    }
+    }
 }
 
-export { Label, ALIGN };
+export { Label, ALIGN };

package/src/og/entity/LabelHandler.js

@@ -76,19 +76,52 @@ class LabelHandler extends BillboardHandler {
     }
 
     add(label) {
-        if (label._handlerIndex === -1) {
+        if (!label._handler) {
             label._handler = this;
-            label._handlerIndex = this._billboards.length;
-            this._billboards.push(label);
-            this._addBillboardToArrays(label);
-            this.refresh();
             this.assignFontAtlas(label);
+            this.refresh();
         }
-    }
-
+    }
+
+    _addLabelToArrays(label) {
+        this._renderer.labelWorker.make(this, label);
+    }
+
     assignFontAtlas(label) {
         if (this._entityCollection && this._renderer) {
             label.assignFontAtlas(this._renderer.fontAtlas);
+            this._addLabelToArrays(label);
+        } else {
+            this._billboards.push(label);
+        }
+    }
+
+    workerCallback(data, label) {
+        if (label._lockId !== -1) {
+            label._isReady = true;
+            label._lockId = -1;
+            label._handlerIndex = this._billboards.length;
+            this._billboards.push(label);
+
+            this._vertexArr = concatTypedArrays(this._vertexArr, data.vertexArr);
+            this._texCoordArr = concatTypedArrays(this._texCoordArr, data.texCoordArr);
+            this._gliphParamArr = concatTypedArrays(this._gliphParamArr, data.gliphParamArr);
+            this._positionHighArr = concatTypedArrays(this._positionHighArr, data.positionHighArr);
+            this._positionLowArr = concatTypedArrays(this._positionLowArr, data.positionLowArr);
+            this._sizeArr = concatTypedArrays(this._sizeArr, data.sizeArr);
+            this._offsetArr = concatTypedArrays(this._offsetArr, data.offsetArr);
+            this._rgbaArr = concatTypedArrays(this._rgbaArr, data.rgbaArr);
+            this._rotationArr = concatTypedArrays(this._rotationArr, data.rotationArr);
+            this._alignedAxisArr = concatTypedArrays(this._alignedAxisArr, data.alignedAxisArr);
+            this._fontIndexArr = concatTypedArrays(this._fontIndexArr, data.fontIndexArr);
+            this._outlineArr = concatTypedArrays(this._outlineArr, data.outlineArr);
+            this._noOutlineArr = concatTypedArrays(this._noOutlineArr, data.noOutlineArr);
+            this._outlineColorArr = concatTypedArrays(this._outlineColorArr, data.outlineColorArr);
+            this._pickingColorArr = concatTypedArrays(this._pickingColorArr, data.pickingColorArr);
+
+            label.update();
+
+            this.refresh();
         }
     }
 
@@ -168,236 +201,6 @@ class LabelHandler extends BillboardHandler {
         }
     }
 
-    _addBillboardToArrays(label) {
-        for (var i = 0; i < this._maxLetters; i++) {
-            if (label._visibility) {
-                this._vertexArr = concatTypedArrays(
-                    this._vertexArr,
-                    [0, 0, 0, -1, 1, -1, 1, -1, 1, 0, 0, 0]
-                );
-            } else {
-                this._vertexArr = concatTypedArrays(
-                    this._vertexArr,
-                    [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
-                );
-            }
-
-            this._texCoordArr = concatTypedArrays(
-                this._texCoordArr,
-                [0, 0, -1, 0, 0, 0, -1, 0, 0, 0, -1, 0, 0, 0, -1, 0, 0, 0, -1, 0, 0, 0, -1, 0]
-            );
-            this._gliphParamArr = concatTypedArrays(
-                this._gliphParamArr,
-                [1, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 0]
-            );
-
-            var x = label._positionHigh.x,
-                y = label._positionHigh.y,
-                z = label._positionHigh.z,
-                w;
-            this._positionHighArr = concatTypedArrays(this._positionHighArr, [
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z
-            ]);
-
-            x = label._positionLow.x;
-            y = label._positionLow.y;
-            z = label._positionLow.z;
-            this._positionLowArr = concatTypedArrays(this._positionLowArr, [
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z
-            ]);
-
-            x = label._size;
-            this._sizeArr = concatTypedArrays(this._sizeArr, [x, x, x, x, x, x]);
-
-            x = label._offset.x;
-            y = label._offset.y;
-            z = label._offset.z;
-            this._offsetArr = concatTypedArrays(this._offsetArr, [
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z
-            ]);
-
-            x = label._color.x;
-            y = label._color.y;
-            z = label._color.z;
-            w = label._color.w;
-            this._rgbaArr = concatTypedArrays(this._rgbaArr, [
-                x,
-                y,
-                z,
-                w,
-                x,
-                y,
-                z,
-                w,
-                x,
-                y,
-                z,
-                w,
-                x,
-                y,
-                z,
-                w,
-                x,
-                y,
-                z,
-                w,
-                x,
-                y,
-                z,
-                w
-            ]);
-
-            x = label._rotation;
-            this._rotationArr = concatTypedArrays(this._rotationArr, [x, x, x, x, x, x]);
-
-            x = label._alignedAxis.x;
-            y = label._alignedAxis.y;
-            z = label._alignedAxis.z;
-            this._alignedAxisArr = concatTypedArrays(this._alignedAxisArr, [
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z
-            ]);
-
-            x = label._fontIndex;
-            this._fontIndexArr = concatTypedArrays(this._fontIndexArr, [x, x, x, x, x, x]);
-
-            x = label._outline;
-            this._outlineArr = concatTypedArrays(this._outlineArr, [x, x, x, x, x, x]);
-
-            const weight = 0.001;
-            this._noOutlineArr = concatTypedArrays(this._noOutlineArr, [
-                weight,
-                weight,
-                weight,
-                weight,
-                weight,
-                weight
-            ]);
-
-            x = label._outlineColor.x;
-            y = label._outlineColor.y;
-            z = label._outlineColor.z;
-            w = label._outlineColor.w;
-            this._outlineColorArr = concatTypedArrays(this._outlineColorArr, [
-                x,
-                y,
-                z,
-                w,
-                x,
-                y,
-                z,
-                w,
-                x,
-                y,
-                z,
-                w,
-                x,
-                y,
-                z,
-                w,
-                x,
-                y,
-                z,
-                w,
-                x,
-                y,
-                z,
-                w
-            ]);
-
-            x = label._entity._pickingColor.x / 255;
-            y = label._entity._pickingColor.y / 255;
-            z = label._entity._pickingColor.z / 255;
-            this._pickingColorArr = concatTypedArrays(this._pickingColorArr, [
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z,
-                x,
-                y,
-                z
-            ]);
-        }
-    }
-
     _displayPASS() {
         var r = this._renderer;
         var h = r.handler;
@@ -665,7 +468,8 @@ class LabelHandler extends BillboardHandler {
         this.refresh();
 
         label._handlerIndex = -1;
-        label._handler = null;
+        label._handler = null;
+        label._isReady = false;
     }
 
     setText(index, text, fontIndex, align) {
@@ -692,12 +496,6 @@ class LabelHandler extends BillboardHandler {
 
             let m = n.metrics;
 
-            //m.nWidth;
-            //m.nHeight;
-            //m.nAdvance;
-            //m.nXOffset;
-            //m.nYOffset;
-
             a[j] = tc[0];
             a[j + 1] = tc[1];
             a[j + 2] = offset;

package/src/og/entity/LabelWorker.js

@@ -0,0 +1,213 @@
+"use strict";
+
+// import { QueueArray } from '../QueueArray.js';
+
+class LabelWorker {
+    constructor(numWorkers = 4) {
+        this._id = 0;
+        this._source = {};
+
+        this._freeWorkerQueue = []; //new QueueArray(numWorkers);
+        var labelProgramm = new Blob([_programm], { type: "application/javascript" });
+
+        var that = this;
+
+        for (let i = 0; i < numWorkers; i++) {
+            var w = new Worker(URL.createObjectURL(labelProgramm));
+            w.onmessage = function (e) {
+
+                let s = that._source[e.data.id];
+
+                if (s.label._lockId === -2) {
+                    that.make(s.handler, s.label);
+                } else {
+                    s.handler.workerCallback(e.data, s.label);
+                }
+
+                that._source[e.data.id] = null;
+                delete that._source[e.data.id];
+                that._freeWorkerQueue.unshift(this);
+
+                that.check();
+            };
+
+            this._freeWorkerQueue.push(w);
+        }
+
+        this._pendingQueue = []; //new QueueArray(512);
+    }
+
+    check() {
+        if (this._pendingQueue.length) {
+            var p = this._pendingQueue.pop();
+            this.make(p.handler, p.label);
+        }
+    }
+
+    make(handler, label) {
+
+        let source = { handler: handler, label: label };
+
+        if (this._freeWorkerQueue.length) {
+            var w = this._freeWorkerQueue.pop();
+
+            this._source[this._id] = source;
+
+            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
+            ]);
+
+            label._lockId = this._id;
+
+            w.postMessage({
+                labelData: labelData
+            }, [
+                labelData.buffer,
+            ]);
+        } else {
+            this._pendingQueue.push(source);
+        }
+    }
+}
+
+const _programm = `'use strict';
+
+    function concatTypedArrays(dest, index, source) {
+        let len = source.length,
+            offset = index * len;
+        for(let i = 0; i < len; i++) {
+            dest[offset + i] = source[i];
+        }
+    }
+
+    self.onmessage = function (e) {
+        var labelData = e.data.labelData,
+            id = labelData[0],
+            maxLetters = labelData[1],
+            isVisible = labelData[2],
+            /*3, 4, 5*/_positionHigh_x = labelData[3], _positionHigh_y = labelData[4], _positionHigh_z = labelData[5],
+            /*6, 7, 8*/_positionLow_x = labelData[6], _positionLow_y = labelData[7], _positionLow_z = labelData[8],
+            /*9*/_size = labelData[9],
+            /*10, 11, 12*/_offset_x = labelData[10], _offset_y = labelData[11], _offset_z = labelData[12],
+            /*13, 14, 15, 16*/_color_x = labelData[13], _color_y = labelData[14], _color_z = labelData[15], _color_w = labelData[16],
+            /*17*/_rotation = labelData[17],
+            /*18, 19, 20*/_alignedAxis_x = labelData[18], _alignedAxis_y = labelData[19], _alignedAxis_z = labelData[20],
+            /*21*/_fontIndex = labelData[21],
+            /*22*/_outline = labelData[22],
+            /*23, 24, 25, 26*/_outlineColor_x = labelData[23], _outlineColor_y = labelData[24], _outlineColor_z = labelData[25], _outlineColor_w = labelData[26],
+            /*27, 28, 29*/_pickingColor_x = labelData[27], _pickingColor_y = labelData[28], _pickingColor_z = labelData[29]
+         
+
+        let _vertexArr = new Float32Array(maxLetters * 12),
+            _texCoordArr = new Float32Array(maxLetters * 24),
+            _gliphParamArr = new Float32Array(maxLetters * 24),
+            _positionHighArr = new Float32Array(maxLetters * 18),
+            _positionLowArr = new Float32Array(maxLetters * 18),
+            _sizeArr = new Float32Array(maxLetters * 6),
+            _offsetArr = new Float32Array(maxLetters * 18),
+            _rgbaArr = new Float32Array(maxLetters * 24),
+            _rotationArr = new Float32Array(maxLetters * 6),
+            _alignedAxisArr = new Float32Array(maxLetters * 18),
+            _fontIndexArr = new Float32Array(maxLetters * 6),
+            _outlineArr = new Float32Array(maxLetters * 6),
+            _noOutlineArr = new Float32Array(maxLetters * 6),
+            _outlineColorArr = new Float32Array(maxLetters * 24),
+            _pickingColorArr = new Float32Array(maxLetters * 18);
+        
+        for (var i = 0; i < maxLetters; i++) {
+            if (isVisible !== 0) {
+                concatTypedArrays(_vertexArr, i, [0, 0, 0, -1, 1, -1, 1, -1, 1, 0, 0, 0]);
+            } else {
+                concatTypedArrays(_vertexArr, i, [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]);
+            }
+
+            concatTypedArrays(_texCoordArr, i, [0, 0, -1, 0, 0, 0, -1, 0, 0, 0, -1, 0, 0, 0, -1, 0, 0, 0, -1, 0, 0, 0, -1, 0]);
+            concatTypedArrays(_gliphParamArr, i, [1, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 0]);
+
+            var x = _positionHigh_x, y = _positionHigh_y, z = _positionHigh_z, w;
+            concatTypedArrays(_positionHighArr, i, [x, y, z, x, y, z, x, y, z, x, y, z, x, y, z, x, y, z]);
+
+            x = _positionLow_x; y = _positionLow_y; z = _positionLow_z;
+            concatTypedArrays(_positionLowArr, i, [x, y, z, x, y, z, x, y, z, x, y, z, x, y, z, x, y, z]);
+
+            x = _size;
+            concatTypedArrays(_sizeArr, i, [x, x, x, x, x, x]);
+
+            x = _offset_x; y = _offset_y; z = _offset_z;
+            concatTypedArrays(_offsetArr, i, [x, y, z, x, y, z, x, y, z, x, y, z, x, y, z, x, y, z]);
+
+            x = _color_x; y = _color_y; z = _color_z; w = _color_w;
+            concatTypedArrays(_rgbaArr, i, [x, y, z, w, x, y, z, w, x, y, z, w, x, y, z, w, x, y, z, w, x, y, z, w]);
+
+            x = _rotation;
+            concatTypedArrays(_rotationArr, i, [x, x, x, x, x, x]);
+
+            x = _alignedAxis_x; y = _alignedAxis_y; z = _alignedAxis_z;
+            concatTypedArrays(_alignedAxisArr, i, [x, y, z, x, y, z, x, y, z, x, y, z, x, y, z, x, y, z]);
+
+            x = _fontIndex;
+            concatTypedArrays(_fontIndexArr, i, [x, x, x, x, x, x]);
+
+            x = _outline;
+            concatTypedArrays(_outlineArr, i, [x, x, x, x, x, x]);
+
+            w = 0.001;
+            concatTypedArrays(_noOutlineArr, i, [w, w, w, w, w, w]);
+
+            x = _outlineColor_x; y = _outlineColor_y; z = _outlineColor_z; w = _outlineColor_w;
+            concatTypedArrays(_outlineColorArr, i, [x, y, z, w, x, y, z, w, x, y, z, w, x, y, z, w, x, y, z, w, x, y, z, w]);
+
+            x = _pickingColor_x / 255; y = _pickingColor_y / 255; z = _pickingColor_z / 255;
+            concatTypedArrays(_pickingColorArr, i, [x, y, z, x, y, z, x, y, z, x, y, z, x, y, z, x, y, z]);
+        }
+
+        self.postMessage({
+                id: id,
+                vertexArr: _vertexArr,
+                texCoordArr: _texCoordArr,
+                gliphParamArr: _gliphParamArr,
+                positionHighArr: _positionHighArr,
+                positionLowArr: _positionLowArr,
+                sizeArr: _sizeArr,
+                offsetArr: _offsetArr,
+                rgbaArr: _rgbaArr,
+                rotationArr: _rotationArr,
+                alignedAxisArr: _alignedAxisArr,
+                fontIndexArr: _fontIndexArr,
+                outlineArr: _outlineArr,
+                noOutlineArr: _noOutlineArr,
+                outlineColorArr: _outlineColorArr,
+                pickingColorArr: _pickingColorArr
+             }, [
+                    _vertexArr.buffer,
+                    _texCoordArr.buffer,
+                    _gliphParamArr.buffer,
+                    _positionHighArr.buffer,
+                    _positionLowArr.buffer,
+                    _sizeArr.buffer,
+                    _offsetArr.buffer,
+                    _rgbaArr.buffer,
+                    _rotationArr.buffer,
+                    _alignedAxisArr.buffer,
+                    _fontIndexArr.buffer,
+                    _outlineArr.buffer,
+                    _noOutlineArr.buffer,
+                    _outlineColorArr.buffer,
+                    _pickingColorArr.buffer
+            ]);
+    }`;
+
+export { LabelWorker };