@pirireis/webglobeplugins 0.9.11 → 0.9.12

package/programs/rings/distancering/circleflatprogram.js

@@ -34,11 +34,11 @@ var __importStar = (this && this.__importStar) || (function () {
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.programCache = void 0;
-var util_1 = require("../../../util");
-var camerauniformblock_1 = __importStar(require("../../totems/camerauniformblock"));
-var programcache_1 = require("../../programcache");
-var CIRCLE_EDGE_COUNT = 360;
-var vertexShader = "#version 300 es " +
+const util_1 = require("../../../util");
+const camerauniformblock_1 = __importStar(require("../../totems/camerauniformblock"));
+const programcache_1 = require("../../programcache");
+const CIRCLE_EDGE_COUNT = 360;
+const vertexShader = `#version 300 es ` +
     util_1.shaderfunctions.PI +
     util_1.shaderfunctions.R +
     util_1.shaderfunctions.POLE +
@@ -48,11 +48,54 @@ var vertexShader = "#version 300 es " +
     util_1.shaderfunctions.longLatRadToCartesian3D +
     util_1.shaderfunctions.circleLimpFromLongLatRadCenterCartesian3D +
     util_1.shaderfunctions.circleLimpFromLongLatRadCenterMercatorCompass +
-    util_1.shaderfunctions.circleLimpFromLongLatRadCenterMercatorRealDistance + "\n\nuniform int compass;\nuniform float circle_edge_count;\n\nuniform float opacity;\n\nin vec2 center;\nin float radius;\nin vec4 color;\nin float flag;\nout vec4 v_color;\nout vec2 v_limp;\n\nvoid main() {\n    if( flag == 1.0 || radius == 0.0) return; // flag 1.0 is hide\n    v_color = vec4(color.rgb, color.a * opacity);\n    if ( gl_VertexID == 270 ) v_color.rgb += 0.2;\n    float angle = 3.1415926535897932384626433832795 * 2.0 * (float(gl_VertexID) /  circle_edge_count);\n    if ( is3D ){\n            gl_Position = projection * view * vec4(\n            circleLimpFromLongLatRadCenterCartesian3D( center, radius, angle) - translate, 1.0);\n        v_limp = vec2(0.0, 0.0);\n        return;\n    }\n    vec2 limp;\n    if ( compass == 1 ){\n        limp = circleLimpFromLongLatRadCenterMercatorCompass(center, radius, angle);\n    } else {\n        limp = circleLimpFromLongLatRadCenterMercatorRealDistance(center, radius, angle);\n    }   \n    v_limp = limp;\n    gl_Position = mercatorXYToGLPosition(limp);\n    \n}";
-var fragmentShader = "#version 300 es\nprecision highp float;" +
-    util_1.shaderfunctions.POLE + "\n\nin vec4 v_color;\nin vec2 v_limp;\nout vec4 outColor;\nvoid main() {\n    if ( v_limp.x < -POLE || v_limp.x > POLE || v_limp.y < -POLE || v_limp.y > POLE ){ discard; }\n    outColor = v_color;\n}";
-var Logic = /** @class */ (function () {
-    function Logic(globe) {
+    util_1.shaderfunctions.circleLimpFromLongLatRadCenterMercatorRealDistance + `
+
+uniform int compass;
+uniform float circle_edge_count;
+
+uniform float opacity;
+
+in vec2 center;
+in float radius;
+in vec4 color;
+in float flag;
+out vec4 v_color;
+out vec2 v_limp;
+
+void main() {
+    if( flag == 1.0 || radius == 0.0) return; // flag 1.0 is hide
+    v_color = vec4(color.rgb, color.a * opacity);
+    if ( gl_VertexID == 270 ) v_color.rgb += 0.2;
+    float angle = 3.1415926535897932384626433832795 * 2.0 * (float(gl_VertexID) /  circle_edge_count);
+    if ( is3D ){
+            gl_Position = projection * view * vec4(
+            circleLimpFromLongLatRadCenterCartesian3D( center, radius, angle) - translate, 1.0);
+        v_limp = vec2(0.0, 0.0);
+        return;
+    }
+    vec2 limp;
+    if ( compass == 1 ){
+        limp = circleLimpFromLongLatRadCenterMercatorCompass(center, radius, angle);
+    } else {
+        limp = circleLimpFromLongLatRadCenterMercatorRealDistance(center, radius, angle);
+    }   
+    v_limp = limp;
+    gl_Position = mercatorXYToGLPosition(limp);
+    
+}`;
+const fragmentShader = `#version 300 es
+precision highp float;` +
+    util_1.shaderfunctions.POLE + `
+
+in vec4 v_color;
+in vec2 v_limp;
+out vec4 outColor;
+void main() {
+    if ( v_limp.x < -POLE || v_limp.x > POLE || v_limp.y < -POLE || v_limp.y > POLE ){ discard; }
+    outColor = v_color;
+}`;
+class Logic {
+    constructor(globe) {
         this.globe = globe;
         this.gl = globe.gl;
         this.program = (0, util_1.createProgram)(this.gl, vertexShader, fragmentShader);
@@ -64,7 +107,7 @@ var Logic = /** @class */ (function () {
         }
         this.cameraBlockBindingPoint = 0;
         this.cameraBlockTotem = programcache_1.globeProgramCache.getProgram(globe, camerauniformblock_1.default);
-        var cameraBlockIndex = this.gl.getUniformBlockIndex(this.program, "CameraUniformBlock");
+        const cameraBlockIndex = this.gl.getUniformBlockIndex(this.program, "CameraUniformBlock");
         this.gl.uniformBlockBinding(this.program, cameraBlockIndex, this.cameraBlockBindingPoint);
         this._opacityLocation = this.gl.getUniformLocation(this.program, "opacity");
         this._compassLocation = this.gl.getUniformLocation(this.program, "compass");
@@ -73,7 +116,7 @@ var Logic = /** @class */ (function () {
         this._compassmode = 1;
         this._opacity = 1.0;
         {
-            var currentProgram = this.gl.getParameter(this.gl.CURRENT_PROGRAM);
+            const currentProgram = this.gl.getParameter(this.gl.CURRENT_PROGRAM);
             this.gl.useProgram(this.program);
             this.gl.uniform1i(this._compassLocation, 1);
             this.gl.uniform1f(this._circleEdgeCountLocation, CIRCLE_EDGE_COUNT);
@@ -81,8 +124,8 @@ var Logic = /** @class */ (function () {
             this.gl.useProgram(currentProgram);
         }
     }
-    Logic.prototype.draw = function (attrBufferManager, compass, circleEdgeCount, opacity) {
-        var _a = this, gl = _a.gl, program = _a.program, cameraBlockTotem = _a.cameraBlockTotem, cameraBlockBindingPoint = _a.cameraBlockBindingPoint;
+    draw(attrBufferManager, compass, circleEdgeCount, opacity) {
+        const { gl, program, cameraBlockTotem, cameraBlockBindingPoint } = this;
         gl.useProgram(program);
         cameraBlockTotem.bind(cameraBlockBindingPoint);
         attrBufferManager.bindCircleVAO();
@@ -101,14 +144,13 @@ var Logic = /** @class */ (function () {
         gl.drawArraysInstanced(gl.LINE_LOOP, 0, circleEdgeCount, attrBufferManager.length);
         gl.bindVertexArray(null);
         cameraBlockTotem.unbind(cameraBlockBindingPoint);
-    };
-    Logic.prototype.free = function () {
+    }
+    free() {
         this.gl.deleteProgram(this.program);
         programcache_1.globeProgramCache.releaseProgram(this.globe, camerauniformblock_1.default);
-    };
-    return Logic;
-}());
+    }
+}
 exports.programCache = Object.freeze({
-    getProgram: function (globe) { return programcache_1.noRegisterGlobeProgramCache.getProgram(globe, Logic); },
-    releaseProgram: function (globe) { programcache_1.noRegisterGlobeProgramCache.releaseProgram(globe, Logic); }
+    getProgram: (globe) => { return programcache_1.noRegisterGlobeProgramCache.getProgram(globe, Logic); },
+    releaseProgram: (globe) => { programcache_1.noRegisterGlobeProgramCache.releaseProgram(globe, Logic); }
 });

package/programs/rings/distancering/circlepaddingfreeangleprogram.js

@@ -1,19 +1,4 @@
 "use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     var desc = Object.getOwnPropertyDescriptor(m, k);
@@ -49,11 +34,11 @@ var __importStar = (this && this.__importStar) || (function () {
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BufferManager = exports.PaddingFreeAngleCache = void 0;
-var util_1 = require("../../../util");
-var account_1 = require("../../../util/account");
-var camerauniformblock_1 = __importStar(require("../../totems/camerauniformblock"));
-var programcache_1 = require("../../programcache");
-var vertexShader = "#version 300 es " +
+const util_1 = require("../../../util");
+const account_1 = require("../../../util/account");
+const camerauniformblock_1 = __importStar(require("../../totems/camerauniformblock"));
+const programcache_1 = require("../../programcache");
+const vertexShader = `#version 300 es ` +
     util_1.shaderfunctions.PI +
     util_1.shaderfunctions.R +
     util_1.shaderfunctions.POLE +
@@ -63,16 +48,67 @@ var vertexShader = "#version 300 es " +
     util_1.shaderfunctions.longLatRadToCartesian3D +
     util_1.shaderfunctions.circleLimpFromLongLatRadCenterCartesian3D +
     util_1.shaderfunctions.circleLimpFromLongLatRadCenterMercatorCompass +
-    util_1.shaderfunctions.circleLimpFromLongLatRadCenterMercatorRealDistance + "\n\nin vec2 center;\nin float radius;\nin float pad_range;\nin vec4 color;\nin float flag;\nin float pad_angle;\n\nuniform int compass;\n\nuniform float opacity;\n\nout vec2 v_limp;\nout vec4 v_color;\n\n\nvoid main() {   \n    if( flag == 1.0 || radius == 0.0 ) return; // 1.0 is hide \n    v_color = vec4(color.rgb, color.a * opacity);\n\n    if ( pad_angle == 0.0 ) v_color.rgb -= 0.2;\n    gl_PointSize = 2.0;\n\n    float odd = mod(float(gl_VertexID), 2.0);\n    float index = (float(gl_VertexID)- odd ) / 2.0;\n    float angle = pad_angle - 1.5707963267948966192313216916398;\n    float radius_ = radius - (pad_range * odd);\n\n    if (is3D){  \n        gl_Position = projection * view * vec4(\n            circleLimpFromLongLatRadCenterCartesian3D( center, radius_, angle) - translate, 1.0);\n        v_limp = vec2(0.0, 0.0);\n        return;\n    }\n    vec2 limp;\n    if ( compass == 1 ){\n        limp = circleLimpFromLongLatRadCenterMercatorCompass(center , radius_, angle);\n    } else {\n        limp = circleLimpFromLongLatRadCenterMercatorRealDistance(center, radius_, angle);\n    }\n    v_limp = limp;\n    gl_Position = mercatorXYToGLPosition(limp);\n}";
-var fragmentShader = "#version 300 es\nprecision highp float; " +
-    util_1.shaderfunctions.POLE + "\nin vec4 v_color;\nin vec2 v_limp;\nout vec4 outColor;\nvoid main() {\n    if ( v_limp.x < -POLE || v_limp.x > POLE || v_limp.y < -POLE || v_limp.y > POLE ){ discard; }\n    outColor = v_color;\n}";
-var Logic = /** @class */ (function () {
-    function Logic(globe) {
+    util_1.shaderfunctions.circleLimpFromLongLatRadCenterMercatorRealDistance + `
+
+in vec2 center;
+in float radius;
+in float pad_range;
+in vec4 color;
+in float flag;
+in float pad_angle;
+
+uniform int compass;
+
+uniform float opacity;
+
+out vec2 v_limp;
+out vec4 v_color;
+
+
+void main() {   
+    if( flag == 1.0 || radius == 0.0 ) return; // 1.0 is hide 
+    v_color = vec4(color.rgb, color.a * opacity);
+
+    if ( pad_angle == 0.0 ) v_color.rgb -= 0.2;
+    gl_PointSize = 2.0;
+
+    float odd = mod(float(gl_VertexID), 2.0);
+    float index = (float(gl_VertexID)- odd ) / 2.0;
+    float angle = pad_angle - 1.5707963267948966192313216916398;
+    float radius_ = radius - (pad_range * odd);
+
+    if (is3D){  
+        gl_Position = projection * view * vec4(
+            circleLimpFromLongLatRadCenterCartesian3D( center, radius_, angle) - translate, 1.0);
+        v_limp = vec2(0.0, 0.0);
+        return;
+    }
+    vec2 limp;
+    if ( compass == 1 ){
+        limp = circleLimpFromLongLatRadCenterMercatorCompass(center , radius_, angle);
+    } else {
+        limp = circleLimpFromLongLatRadCenterMercatorRealDistance(center, radius_, angle);
+    }
+    v_limp = limp;
+    gl_Position = mercatorXYToGLPosition(limp);
+}`;
+const fragmentShader = `#version 300 es
+precision highp float; ` +
+    util_1.shaderfunctions.POLE + `
+in vec4 v_color;
+in vec2 v_limp;
+out vec4 outColor;
+void main() {
+    if ( v_limp.x < -POLE || v_limp.x > POLE || v_limp.y < -POLE || v_limp.y > POLE ){ discard; }
+    outColor = v_color;
+}`;
+class Logic {
+    constructor(globe) {
         this.globe = globe;
         this.gl = globe.gl;
         this.program = (0, util_1.createProgram)(this.gl, vertexShader, fragmentShader);
         {
-            var gl = this.gl;
+            const gl = this.gl;
             // assign attribute locations
             gl.bindAttribLocation(this.program, 0, "center");
             gl.bindAttribLocation(this.program, 1, "radius");
@@ -82,14 +118,14 @@ var Logic = /** @class */ (function () {
             gl.bindAttribLocation(this.program, 5, "pad_angle");
         }
         this.cameraBlockBindingPoint = 0;
-        var cameraBlockIndex = this.gl.getUniformBlockIndex(this.program, "CameraUniformBlock");
+        const cameraBlockIndex = this.gl.getUniformBlockIndex(this.program, "CameraUniformBlock");
         this.gl.uniformBlockBinding(this.program, cameraBlockIndex, this.cameraBlockBindingPoint);
         this.cameraBlockTotem = programcache_1.globeProgramCache.getProgram(globe, camerauniformblock_1.default);
         this._compassLocation = this.gl.getUniformLocation(this.program, "compass");
         this._opacityLocation = this.gl.getUniformLocation(this.program, "opacity");
         this._opacity = 1.0;
         {
-            var currentProgram = this.gl.getParameter(this.gl.CURRENT_PROGRAM);
+            const currentProgram = this.gl.getParameter(this.gl.CURRENT_PROGRAM);
             this.gl.useProgram(this.program);
             this.gl.uniform1i(this._compassLocation, 1);
             this.gl.uniform1f(this._opacityLocation, 1.0);
@@ -97,8 +133,8 @@ var Logic = /** @class */ (function () {
             this.gl.useProgram(currentProgram);
         }
     }
-    Logic.prototype.draw = function (attrBufferManager, compass, opacity) {
-        var _a = this, gl = _a.gl, program = _a.program, cameraBlockBindingPoint = _a.cameraBlockBindingPoint, cameraBlockTotem = _a.cameraBlockTotem, _compassLocation = _a._compassLocation;
+    draw(attrBufferManager, compass, opacity) {
+        const { gl, program, cameraBlockBindingPoint, cameraBlockTotem, _compassLocation } = this;
         gl.useProgram(program);
         attrBufferManager.bindPaddingVAO();
         cameraBlockTotem.bind(cameraBlockBindingPoint);
@@ -115,33 +151,29 @@ var Logic = /** @class */ (function () {
         cameraBlockTotem.unbind(cameraBlockBindingPoint);
         gl.enable(gl.DEPTH_TEST);
         gl.bindVertexArray(null);
-    };
-    Logic.prototype.createBuffer = function (_a) {
-        var _b = _a === void 0 ? {} : _a, _c = _b.bufferType, bufferType = _c === void 0 ? "DYNAMIC_DRAW" : _c, _d = _b.initialRingCapacity, initialRingCapacity = _d === void 0 ? 10 : _d;
+    }
+    createBuffer({ bufferType = "DYNAMIC_DRAW", initialRingCapacity = 10 } = {}) {
         return new BufferManager(this.gl, bufferType, initialRingCapacity);
-    };
-    return Logic;
-}());
+    }
+}
 exports.PaddingFreeAngleCache = Object.freeze({
-    getProgram: function (globe) { return programcache_1.noRegisterGlobeProgramCache.getProgram(globe, Logic); },
-    releaseProgram: function (globe) { return programcache_1.globeProgramCache.releaseProgram(globe, Logic); }
+    getProgram: (globe) => programcache_1.noRegisterGlobeProgramCache.getProgram(globe, Logic),
+    releaseProgram: (globe) => programcache_1.globeProgramCache.releaseProgram(globe, Logic)
 });
-var BufferManager = /** @class */ (function (_super) {
-    __extends(BufferManager, _super);
-    function BufferManager(gl, bufferType, initialRingCapacity) {
-        if (initialRingCapacity === void 0) { initialRingCapacity = 10; }
-        var _this = _super.call(this, 10, { capacity: initialRingCapacity, bufferType: bufferType }) || this;
-        _this.gl = gl;
-        _this.bufferType = bufferType;
-        _this.buffer = gl.createBuffer();
-        gl.bindBuffer(gl.ARRAY_BUFFER, _this.buffer);
-        gl.bufferData(gl.ARRAY_BUFFER, _this.capacity * _this.itemSize * 4, gl[bufferType]);
+class BufferManager extends account_1.BufferOffsetManager {
+    constructor(gl, bufferType, initialRingCapacity = 10) {
+        super(10, { capacity: initialRingCapacity, bufferType });
+        this.gl = gl;
+        this.bufferType = bufferType;
+        this.buffer = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, this.buffer);
+        gl.bufferData(gl.ARRAY_BUFFER, this.capacity * this.itemSize * 4, gl[bufferType]);
         gl.bindBuffer(gl.ARRAY_BUFFER, null);
-        _this._centerMaps = new Map();
-        _this.vao = gl.createVertexArray();
+        this._centerMaps = new Map();
+        this.vao = gl.createVertexArray();
         {
-            gl.bindVertexArray(_this.vao);
-            gl.bindBuffer(gl.ARRAY_BUFFER, _this.buffer);
+            gl.bindVertexArray(this.vao);
+            gl.bindBuffer(gl.ARRAY_BUFFER, this.buffer);
             gl.enableVertexAttribArray(0);
             gl.enableVertexAttribArray(1);
             gl.enableVertexAttribArray(2);
@@ -164,26 +196,24 @@ var BufferManager = /** @class */ (function (_super) {
             gl.bindBuffer(gl.ARRAY_BUFFER, null);
             gl.bindVertexArray(null);
         }
-        return _this;
     }
-    BufferManager.prototype.__centerMapMethod = function (rings, paddingAngles) {
+    __centerMapMethod(rings, paddingAngles) {
         return new Map([
             ["rings", rings],
             ["paddingAngles", paddingAngles]
         ]);
-    };
-    BufferManager.prototype.bindPaddingVAO = function () {
+    }
+    bindPaddingVAO() {
         this.gl.bindVertexArray(this.vao);
-    };
+    }
     //TODO: implement this
     // insertBulk is gone. no update feature
     // addBulk is added.
     // deletes old centers given 
-    BufferManager.prototype.insertBulk = function (data) {
-        var _a = this, gl = _a.gl, buffer = _a.buffer;
-        var deleteCentersList = [];
-        for (var _i = 0, data_1 = data; _i < data_1.length; _i++) {
-            var centerID = data_1[_i].centerID;
+    insertBulk(data) {
+        const { gl, buffer } = this;
+        const deleteCentersList = [];
+        for (const { centerID } of data) {
             if (this._centerMaps.has(centerID)) {
                 deleteCentersList.push(centerID);
             }
@@ -191,23 +221,20 @@ var BufferManager = /** @class */ (function (_super) {
         if (deleteCentersList.length > 0) {
             this.removeCenters(deleteCentersList);
         }
-        var requiredSpace = this.__requiredSpaceForBulk(data);
-        var spaceLeft = this.spaceLeft;
+        const requiredSpace = this.__requiredSpaceForBulk(data);
+        const spaceLeft = this.spaceLeft;
         // console.log("space left:", spaceLeft, "required space:", requiredSpace);
         if (requiredSpace > spaceLeft) {
             // console.log("new capacity:", this.capacity + requiredSpace - spaceLeft)
             this.extendBuffer(this.capacity + requiredSpace - spaceLeft);
         }
-        var items = [];
-        for (var _b = 0, data_2 = data; _b < data_2.length; _b++) {
-            var _c = data_2[_b], centerID = _c.centerID, x = _c.x, y = _c.y, rgba = _c.rgba, paddingAngles = _c.paddingAngles, _d = _c.hide, hide = _d === void 0 ? 0 : _d, rings = _c.rings;
+        const items = [];
+        for (const { centerID, x, y, rgba, paddingAngles, hide = 0, rings } of data) {
             this._centerMaps.set(centerID, this.__centerMapMethod(rings, paddingAngles)); // x,y, rgba, hide prograbably not needed
-            for (var _e = 0, rings_1 = rings; _e < rings_1.length; _e++) {
-                var _f = rings_1[_e], ringID = _f.ringID, radius = _f.radius, padding = _f.padding;
-                for (var _g = 0, paddingAngles_1 = paddingAngles; _g < paddingAngles_1.length; _g++) {
-                    var paddingAngle = paddingAngles_1[_g];
-                    var _offsetMapKey = "".concat(centerID, "_").concat(ringID, "_").concat(paddingAngle);
-                    var offset = this.getOffset(_offsetMapKey) | this.nextOffset();
+            for (const { ringID, radius, padding } of rings) {
+                for (const paddingAngle of paddingAngles) {
+                    const _offsetMapKey = `${centerID}_${ringID}_${paddingAngle}`;
+                    const offset = this.getOffset(_offsetMapKey) | this.nextOffset();
                     items.push({
                         offset: offset,
                         payload: new Float32Array([x, y, radius, padding, rgba[0], rgba[1], rgba[2], rgba[3], hide, paddingAngle])
@@ -217,117 +244,101 @@ var BufferManager = /** @class */ (function (_super) {
             }
         }
         gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
-        for (var _h = 0, items_1 = items; _h < items_1.length; _h++) {
-            var _j = items_1[_h], offset = _j.offset, payload = _j.payload;
+        for (let { offset, payload } of items) {
             gl.bufferSubData(gl.ARRAY_BUFFER, offset, payload);
         }
-    };
-    BufferManager.prototype.updateCentersXY = function (data) {
-        var _a = this, gl = _a.gl, buffer = _a.buffer;
-        var items = [];
-        for (var _i = 0, data_3 = data; _i < data_3.length; _i++) {
-            var _b = data_3[_i], centerID = _b.centerID, x = _b.x, y = _b.y;
-            var center = this._centerMaps.get(centerID);
-            var payload = new Float32Array([x, y]);
-            var paddingAngles = center.get("paddingAngles");
-            var rings = center.get("rings");
-            for (var _c = 0, rings_2 = rings; _c < rings_2.length; _c++) {
-                var ringID = rings_2[_c].ringID;
-                for (var _d = 0, paddingAngles_2 = paddingAngles; _d < paddingAngles_2.length; _d++) {
-                    var paddingAngle = paddingAngles_2[_d];
-                    var offsetKey = offsetMapKey(centerID, ringID, paddingAngle);
-                    items.push({ offset: this.getOffset(offsetKey), payload: payload });
+    }
+    updateCentersXY(data) {
+        const { gl, buffer } = this;
+        const items = [];
+        for (const { centerID, x, y } of data) {
+            const center = this._centerMaps.get(centerID);
+            const payload = new Float32Array([x, y]);
+            const paddingAngles = center.get("paddingAngles");
+            const rings = center.get("rings");
+            for (const { ringID } of rings) {
+                for (const paddingAngle of paddingAngles) {
+                    const offsetKey = offsetMapKey(centerID, ringID, paddingAngle);
+                    items.push({ offset: this.getOffset(offsetKey), payload });
                 }
             }
         }
         gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
-        for (var _e = 0, items_2 = items; _e < items_2.length; _e++) {
-            var _f = items_2[_e], offset = _f.offset, payload = _f.payload;
+        for (let { offset, payload } of items) {
             gl.bufferSubData(gl.ARRAY_BUFFER, offset, payload);
         }
         gl.bindBuffer(gl.ARRAY_BUFFER, null);
-    };
+    }
     //TODO: test
-    BufferManager.prototype.updateCentersHide = function (data) {
-        var _a = this, gl = _a.gl, buffer = _a.buffer;
-        var items = [];
-        for (var _i = 0, data_4 = data; _i < data_4.length; _i++) {
-            var _b = data_4[_i], centerID = _b.centerID, _c = _b.hide, hide = _c === void 0 ? null : _c;
+    updateCentersHide(data) {
+        const { gl, buffer } = this;
+        const items = [];
+        for (const { centerID, hide = null } of data) {
             if (hide === null)
                 continue;
-            var block = new Float32Array([hide]);
-            var center = this._centerMaps.get(centerID);
+            const block = new Float32Array([hide]);
+            const center = this._centerMaps.get(centerID);
             if (!center)
                 continue;
-            var paddingAngles = center.get("paddingAngles");
-            var rings = center.get("rings");
-            for (var _d = 0, rings_3 = rings; _d < rings_3.length; _d++) {
-                var ringID = rings_3[_d].ringID;
-                for (var _e = 0, paddingAngles_3 = paddingAngles; _e < paddingAngles_3.length; _e++) {
-                    var paddingAngle = paddingAngles_3[_e];
-                    var offsetKey = offsetMapKey(centerID, ringID, paddingAngle);
+            const paddingAngles = center.get("paddingAngles");
+            const rings = center.get("rings");
+            for (const { ringID } of rings) {
+                for (const paddingAngle of paddingAngles) {
+                    const offsetKey = offsetMapKey(centerID, ringID, paddingAngle);
                     items.push({ key: offsetKey, payload: block });
                 }
             }
         }
         this._updatePartial(items, 8, gl, buffer);
-    };
-    BufferManager.prototype.updateCentersColor = function (data) {
-        var _a = this, gl = _a.gl, buffer = _a.buffer;
-        var items = [];
-        for (var _i = 0, data_5 = data; _i < data_5.length; _i++) {
-            var _b = data_5[_i], centerID = _b.centerID, rgba = _b.rgba;
-            var center = this._centerMaps.get(centerID);
+    }
+    updateCentersColor(data) {
+        const { gl, buffer } = this;
+        const items = [];
+        for (const { centerID, rgba } of data) {
+            const center = this._centerMaps.get(centerID);
             if (!center)
                 continue;
             center.set("rgba", rgba);
-            var paddingAngles = center.get("paddingAngles");
-            var rings = center.get("rings");
-            var payload = new Float32Array(rgba);
-            for (var _c = 0, rings_4 = rings; _c < rings_4.length; _c++) {
-                var ringID = rings_4[_c].ringID;
-                for (var _d = 0, paddingAngles_4 = paddingAngles; _d < paddingAngles_4.length; _d++) {
-                    var paddingAngle = paddingAngles_4[_d];
-                    var offsetKey = offsetMapKey(centerID, ringID, paddingAngle);
-                    items.push({ key: offsetKey, payload: payload });
+            const paddingAngles = center.get("paddingAngles");
+            const rings = center.get("rings");
+            const payload = new Float32Array(rgba);
+            for (const { ringID } of rings) {
+                for (const paddingAngle of paddingAngles) {
+                    const offsetKey = offsetMapKey(centerID, ringID, paddingAngle);
+                    items.push({ key: offsetKey, payload });
                 }
             }
         }
         this._updatePartial(items, 4, gl, buffer);
-    };
-    BufferManager.prototype.__requiredSpaceForBulk = function (data) {
-        var space = 0;
-        for (var _i = 0, data_6 = data; _i < data_6.length; _i++) {
-            var _a = data_6[_i], paddingAngles = _a.paddingAngles, rings = _a.rings;
+    }
+    __requiredSpaceForBulk(data) {
+        let space = 0;
+        for (const { paddingAngles, rings } of data) {
             space += paddingAngles.length * rings.length;
         }
         return space;
-    };
+    }
     // TODO: TEST IT WITH INSERT
-    BufferManager.prototype.removeCenters = function (centerIDs) {
-        var keys = [];
-        for (var _i = 0, centerIDs_1 = centerIDs; _i < centerIDs_1.length; _i++) {
-            var centerID = centerIDs_1[_i];
-            var center = this._centerMaps.get(centerID);
+    removeCenters(centerIDs) {
+        const keys = [];
+        for (const centerID of centerIDs) {
+            const center = this._centerMaps.get(centerID);
             if (!center)
                 continue;
-            var rings = center.get("rings");
-            var paddingAngles = center.get("paddingAngles");
-            for (var _a = 0, rings_5 = rings; _a < rings_5.length; _a++) {
-                var ringID = rings_5[_a].ringID;
-                for (var _b = 0, paddingAngles_5 = paddingAngles; _b < paddingAngles_5.length; _b++) {
-                    var paddingAngle = paddingAngles_5[_b];
+            const rings = center.get("rings");
+            const paddingAngles = center.get("paddingAngles");
+            for (const { ringID } of rings) {
+                for (const paddingAngle of paddingAngles) {
                     keys.push(offsetMapKey(centerID, ringID, paddingAngle));
                 }
             }
             this._centerMaps.delete(centerID);
         }
         this._removeFromBuffer(keys);
-    };
-    return BufferManager;
-}(account_1.BufferOffsetManager));
+    }
+}
 exports.BufferManager = BufferManager;
-var offsetMapKey = function (centerID, ringID, paddingAngle) { return "".concat(centerID, "_").concat(ringID, "_").concat(paddingAngle); };
+const offsetMapKey = (centerID, ringID, paddingAngle) => `${centerID}_${ringID}_${paddingAngle}`;
 /**
  * {center has x,y, color, paddingAngles, rings} key: centerID
  * {ring has ranges, paddings} key: ringKey