@pirireis/webglobeplugins 0.9.11 → 0.9.12

package/programs/helpers/fadeaway/logic.js

@@ -1,10 +1,33 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-var util_1 = require("../../../util");
-var vertexShaderSource = "#version 300 es\nprecision highp float; \nin vec2 a_position;\nout vec2 v_texCoord;    \nvoid main() {\n    gl_Position = vec4(a_position, 0.0, 1.0);\n    v_texCoord = a_position * 0.5 + vec2(0.5);\n}\n";
-var fragmentShaderSource = "#version 300 es\nprecision highp float;\nuniform float opacity;\nuniform sampler2D u_texture;\nin vec2 v_texCoord;\nout vec4 outColor;\nvoid main() {\n\n    vec4 color = texture(u_texture, v_texCoord);\n    if (color.a <= 0.2) {\n        outColor = vec4(0.0);\n        return;\n    }\n    outColor = vec4(color.rgb, color.a * opacity);\n}\n";
-var FadeAwayProgram = /** @class */ (function () {
-    function FadeAwayProgram(gl) {
+const util_1 = require("../../../util");
+const vertexShaderSource = `#version 300 es
+precision highp float; 
+in vec2 a_position;
+out vec2 v_texCoord;    
+void main() {
+    gl_Position = vec4(a_position, 0.0, 1.0);
+    v_texCoord = a_position * 0.5 + vec2(0.5);
+}
+`;
+const fragmentShaderSource = `#version 300 es
+precision highp float;
+uniform float opacity;
+uniform sampler2D u_texture;
+in vec2 v_texCoord;
+out vec4 outColor;
+void main() {
+
+    vec4 color = texture(u_texture, v_texCoord);
+    if (color.a <= 0.2) {
+        outColor = vec4(0.0);
+        return;
+    }
+    outColor = vec4(color.rgb, color.a * opacity);
+}
+`;
+class FadeAwayProgram {
+    constructor(gl) {
         this.gl = gl;
         this.program = (0, util_1.createProgram)(gl, vertexShaderSource, fragmentShaderSource);
         this.vao = gl.createVertexArray();
@@ -28,8 +51,8 @@ var FadeAwayProgram = /** @class */ (function () {
             opacity: gl.getUniformLocation(this.program, 'opacity')
         };
     }
-    FadeAwayProgram.prototype.draw = function (texture, opacity) {
-        var _a = this, gl = _a.gl, vao = _a.vao, uniforms = _a.uniforms, program = _a.program;
+    draw(texture, opacity) {
+        const { gl, vao, uniforms, program } = this;
         gl.useProgram(program);
         gl.bindVertexArray(vao);
         gl.uniform1f(uniforms.opacity, opacity);
@@ -38,13 +61,12 @@ var FadeAwayProgram = /** @class */ (function () {
         gl.bindTexture(gl.TEXTURE_2D, texture);
         gl.drawArrays(gl.TRIANGLES, 0, 6);
         gl.bindVertexArray(null);
-    };
-    FadeAwayProgram.prototype.free = function () {
-        var _a = this, gl = _a.gl, vao = _a.vao, _buffer = _a._buffer, program = _a.program;
+    }
+    free() {
+        const { gl, vao, _buffer, program } = this;
         gl.deleteVertexArray(vao);
         gl.deleteProgram(program);
         gl.deleteBuffer(_buffer);
-    };
-    return FadeAwayProgram;
-}());
+    }
+}
 exports.default = FadeAwayProgram;

package/programs/helpers/fadeaway/object.js

@@ -3,19 +3,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var programcache_1 = require("../../programcache");
-var logic_1 = __importDefault(require("./logic"));
-var FadeAway = /** @class */ (function () {
-    function FadeAway(gl) {
+const programcache_1 = require("../../programcache");
+const logic_1 = __importDefault(require("./logic"));
+class FadeAway {
+    constructor(gl) {
         this.gl = gl;
         this.program = programcache_1.glProgramCache.getProgram(gl, logic_1.default);
     }
-    FadeAway.prototype.draw = function (sourceTexture, opacity) {
+    draw(sourceTexture, opacity) {
         this.program.draw(sourceTexture, opacity);
-    };
-    FadeAway.prototype.free = function () {
+    }
+    free() {
         programcache_1.glProgramCache.releaseProgram(logic_1.default);
-    };
-    return FadeAway;
-}());
+    }
+}
 exports.default = FadeAway;

package/programs/helpers/index.js

@@ -4,5 +4,5 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.FadeAway = void 0;
-var fadeaway_1 = __importDefault(require("./fadeaway"));
+const fadeaway_1 = __importDefault(require("./fadeaway"));
 exports.FadeAway = fadeaway_1.default;

package/programs/index.js

@@ -37,22 +37,22 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.rings = exports.FadeAway = exports.vectorfield = exports.noRegisterGlobeProgramCache = exports.globeProgramCache = exports.glProgramCache = exports.CameraUniformBlockString = exports.CameraUniformBlockTotem = exports.ArrowField = exports.GlobeShellWiggle = exports.Float2LegendWithRatio = void 0;
-var float2legendwithratio_1 = require("./float2legendwithratio");
+const float2legendwithratio_1 = require("./float2legendwithratio");
 Object.defineProperty(exports, "Float2LegendWithRatio", { enumerable: true, get: function () { return float2legendwithratio_1.Float2LegendWithRatio; } });
-var wiggle_1 = require("./globeshell/wiggle");
+const wiggle_1 = require("./globeshell/wiggle");
 Object.defineProperty(exports, "GlobeShellWiggle", { enumerable: true, get: function () { return wiggle_1.GlobeShellWiggle; } });
-var index_1 = require("./totems/index");
+const index_1 = require("./totems/index");
 Object.defineProperty(exports, "CameraUniformBlockTotem", { enumerable: true, get: function () { return index_1.CameraUniformBlockTotem; } });
 Object.defineProperty(exports, "CameraUniformBlockString", { enumerable: true, get: function () { return index_1.CameraUniformBlockString; } });
-var arrowfield_1 = __importDefault(require("./arrowfield"));
+const arrowfield_1 = __importDefault(require("./arrowfield"));
 exports.ArrowField = arrowfield_1.default;
-var programcache_1 = require("./programcache");
+const programcache_1 = require("./programcache");
 Object.defineProperty(exports, "glProgramCache", { enumerable: true, get: function () { return programcache_1.glProgramCache; } });
 Object.defineProperty(exports, "globeProgramCache", { enumerable: true, get: function () { return programcache_1.globeProgramCache; } });
 Object.defineProperty(exports, "noRegisterGlobeProgramCache", { enumerable: true, get: function () { return programcache_1.noRegisterGlobeProgramCache; } });
-var vectorfield = __importStar(require("./vectorfields"));
+const vectorfield = __importStar(require("./vectorfields"));
 exports.vectorfield = vectorfield;
-var helpers_1 = require("./helpers");
+const helpers_1 = require("./helpers");
 Object.defineProperty(exports, "FadeAway", { enumerable: true, get: function () { return helpers_1.FadeAway; } });
-var rings = __importStar(require("./rings"));
+const rings = __importStar(require("./rings"));
 exports.rings = rings;

package/programs/line-on-globe/angled-line.js

@@ -2,20 +2,80 @@
 // angle radius, rgba, dashRatio, rgbaMode
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AngledLineProgramCache = void 0;
-var util_1 = require("../../util");
-var totems_1 = require("../totems");
-var geometrytransformations_1 = require("../../util/shaderfunctions/geometrytransformations");
-var programcache_1 = require("../programcache");
-var EDGE_COUNT_ON_SPHERE = 50;
-var vertexShaderSource = "#version 300 es\nprecision highp float;\n\n".concat(totems_1.CameraUniformBlockString, "\n").concat(geometrytransformations_1.longLatRadToMercator, "\n").concat(geometrytransformations_1.longLatRadToCartesian3D, "\n").concat(geometrytransformations_1.cartesian3DToGLPosition, "\n").concat(geometrytransformations_1.mercatorXYToGLPosition, "\n").concat(geometrytransformations_1.circleLimpFromLongLatRadCenterCartesian3D, "\n").concat(geometrytransformations_1.circleLimpFromLongLatRadCenterMercatorCompass, "\n").concat(geometrytransformations_1.circleLimpFromLongLatRadCenterMercatorRealDistance, "\n\nin vec2 center_point;\nin float angle;\nin float radius;\nin vec4 rgba;\nin float dash_ratio;\nin float dash_opacity;\n\nout vec4 v_color;\nout float v_dash_ratio;\nout float interpolation;\nout float v_dash_opacity;\nout vec2 v_limp;\n// TODO: Draw World Boundaries \nvoid main() {\n    if ( is3D ) {\n        interpolation = float( gl_VertexID ) / ").concat(EDGE_COUNT_ON_SPHERE - 1, ".0;\n        float radius_ = radius* interpolation;\n        vec3 position = circleLimpFromLongLatRadCenterCartesian3D( center_point, radius_, angle);\n        gl_Position = cartesian3DToGLPosition( position);\n        v_limp = vec2(0.0, 0.0);\n    } else {\n        interpolation = float( gl_VertexID );\n        float radius_ = radius * interpolation;\n        vec2 position = circleLimpFromLongLatRadCenterMercatorRealDistance( center_point, radius_, angle);\n        v_limp = position;\n        gl_Position = mercatorXYToGLPosition( position);\n    }\n    v_dash_opacity = dash_opacity;\n    v_color = rgba;\n    v_dash_ratio = dash_ratio;\n}");
-var fragmentShaderSource = "#version 300 es\n".concat(geometrytransformations_1.POLE, "\nprecision highp float;\n\nuniform float opacity;\nin vec4 v_color;\nin float v_dash_ratio;\nin float v_dash_opacity;\nin float interpolation;\nin vec2 v_limp;\nout vec4 color;\n\nvoid main() {\n    if ( v_limp.x < -POLE || v_limp.x > POLE || v_limp.y < -POLE || v_limp.y > POLE ){ color = vec4(0.0,0.0,0.0,0.0); return; }\n    color = vec4(v_color.rgb, v_color.a * opacity);\n    if (fract(interpolation / (2.0 * v_dash_ratio)) < 0.5 ) {\n        color.a *= v_dash_opacity;\n    }   \n}");
-var Logic = /** @class */ (function () {
-    function Logic(globe) {
+const util_1 = require("../../util");
+const totems_1 = require("../totems");
+const geometrytransformations_1 = require("../../util/shaderfunctions/geometrytransformations");
+const programcache_1 = require("../programcache");
+const EDGE_COUNT_ON_SPHERE = 50;
+const vertexShaderSource = `#version 300 es
+precision highp float;
+
+${totems_1.CameraUniformBlockString}
+${geometrytransformations_1.longLatRadToMercator}
+${geometrytransformations_1.longLatRadToCartesian3D}
+${geometrytransformations_1.cartesian3DToGLPosition}
+${geometrytransformations_1.mercatorXYToGLPosition}
+${geometrytransformations_1.circleLimpFromLongLatRadCenterCartesian3D}
+${geometrytransformations_1.circleLimpFromLongLatRadCenterMercatorCompass}
+${geometrytransformations_1.circleLimpFromLongLatRadCenterMercatorRealDistance}
+
+in vec2 center_point;
+in float angle;
+in float radius;
+in vec4 rgba;
+in float dash_ratio;
+in float dash_opacity;
+
+out vec4 v_color;
+out float v_dash_ratio;
+out float interpolation;
+out float v_dash_opacity;
+out vec2 v_limp;
+// TODO: Draw World Boundaries 
+void main() {
+    if ( is3D ) {
+        interpolation = float( gl_VertexID ) / ${EDGE_COUNT_ON_SPHERE - 1}.0;
+        float radius_ = radius* interpolation;
+        vec3 position = circleLimpFromLongLatRadCenterCartesian3D( center_point, radius_, angle);
+        gl_Position = cartesian3DToGLPosition( position);
+        v_limp = vec2(0.0, 0.0);
+    } else {
+        interpolation = float( gl_VertexID );
+        float radius_ = radius * interpolation;
+        vec2 position = circleLimpFromLongLatRadCenterMercatorRealDistance( center_point, radius_, angle);
+        v_limp = position;
+        gl_Position = mercatorXYToGLPosition( position);
+    }
+    v_dash_opacity = dash_opacity;
+    v_color = rgba;
+    v_dash_ratio = dash_ratio;
+}`;
+const fragmentShaderSource = `#version 300 es
+${geometrytransformations_1.POLE}
+precision highp float;
+
+uniform float opacity;
+in vec4 v_color;
+in float v_dash_ratio;
+in float v_dash_opacity;
+in float interpolation;
+in vec2 v_limp;
+out vec4 color;
+
+void main() {
+    if ( v_limp.x < -POLE || v_limp.x > POLE || v_limp.y < -POLE || v_limp.y > POLE ){ color = vec4(0.0,0.0,0.0,0.0); return; }
+    color = vec4(v_color.rgb, v_color.a * opacity);
+    if (fract(interpolation / (2.0 * v_dash_ratio)) < 0.5 ) {
+        color.a *= v_dash_opacity;
+    }   
+}`;
+class Logic {
+    constructor(globe) {
         this.globe = globe;
         this.gl = globe.gl;
         this.program = (0, util_1.createProgram)(this.gl, vertexShaderSource, fragmentShaderSource);
         this._lastOpacity = 1;
-        var _a = this, gl = _a.gl, program = _a.program;
+        const { gl, program } = this;
         { // assign attribute locations
             gl.bindAttribLocation(program, 0, "center_point");
             gl.bindAttribLocation(program, 1, "angle");
@@ -26,24 +86,24 @@ var Logic = /** @class */ (function () {
         }
         {
             this._opacityLocation = gl.getUniformLocation(program, "opacity");
-            var currentProgram = gl.getParameter(gl.CURRENT_PROGRAM);
+            const currentProgram = gl.getParameter(gl.CURRENT_PROGRAM);
             gl.useProgram(program);
             gl.uniform1f(this._opacityLocation, this._lastOpacity);
             gl.useProgram(currentProgram);
         }
         this.cameraBlockBindingPoint = 0;
-        var cameraBlockIndex = gl.getUniformBlockIndex(program, "CameraUniformBlock");
+        const cameraBlockIndex = gl.getUniformBlockIndex(program, "CameraUniformBlock");
         this.cameraBlockTotem = totems_1.CameraUniformBlockTotemCache.get(globe);
         gl.uniformBlockBinding(program, cameraBlockIndex, this.cameraBlockBindingPoint);
     }
-    Logic.prototype.draw = function (vao, length, opacity) {
-        var _a = this, gl = _a.gl, program = _a.program, globe = _a.globe, cameraBlockTotem = _a.cameraBlockTotem, cameraBlockBindingPoint = _a.cameraBlockBindingPoint;
+    draw(vao, length, opacity) {
+        const { gl, program, globe, cameraBlockTotem, cameraBlockBindingPoint } = this;
         gl.useProgram(program);
         if (opacity !== this._lastOpacity) {
             gl.uniform1f(this._opacityLocation, opacity);
             this._lastOpacity = opacity;
         }
-        var drawCount = globe.api_GetCurrentGeometry() === 0 ? EDGE_COUNT_ON_SPHERE : 2;
+        const drawCount = globe.api_GetCurrentGeometry() === 0 ? EDGE_COUNT_ON_SPHERE : 2;
         gl.bindVertexArray(vao);
         cameraBlockTotem.bind(cameraBlockBindingPoint);
         // gl.disable(gl.DEPTH_TEST);
@@ -51,48 +111,48 @@ var Logic = /** @class */ (function () {
         gl.bindVertexArray(null);
         cameraBlockTotem.unbind(cameraBlockBindingPoint);
         // gl.enable(gl.DEPTH_TEST);
-    };
-    Logic.prototype.createVAO = function (centerCoords, angle, radius, rgba, dashRatio, dashOpacity) {
-        var gl = this.gl;
-        var vao = gl.createVertexArray();
+    }
+    createVAO(centerCoords, angle, radius, rgba, dashRatio, dashOpacity) {
+        const { gl } = this;
+        const vao = gl.createVertexArray();
         gl.bindVertexArray(vao);
         {
-            var buffer = centerCoords.buffer, _a = centerCoords.stride, stride = _a === void 0 ? 0 : _a, _b = centerCoords.offset, offset = _b === void 0 ? 0 : _b;
+            const { buffer, stride = 0, offset = 0 } = centerCoords;
             gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
             gl.enableVertexAttribArray(0);
             gl.vertexAttribPointer(0, 2, gl.FLOAT, false, stride, offset);
             gl.vertexAttribDivisor(0, 1);
         }
         {
-            var buffer = angle.buffer, _c = angle.stride, stride = _c === void 0 ? 0 : _c, _d = angle.offset, offset = _d === void 0 ? 0 : _d;
+            const { buffer, stride = 0, offset = 0 } = angle;
             gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
             gl.enableVertexAttribArray(1);
             gl.vertexAttribPointer(1, 1, gl.FLOAT, false, stride, offset);
             gl.vertexAttribDivisor(1, 1);
         }
         {
-            var buffer = radius.buffer, _e = radius.stride, stride = _e === void 0 ? 0 : _e, _f = radius.offset, offset = _f === void 0 ? 0 : _f;
+            const { buffer, stride = 0, offset = 0 } = radius;
             gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
             gl.enableVertexAttribArray(2);
             gl.vertexAttribPointer(2, 1, gl.FLOAT, false, stride, offset);
             gl.vertexAttribDivisor(2, 1);
         }
         {
-            var buffer = rgba.buffer, _g = rgba.stride, stride = _g === void 0 ? 0 : _g, _h = rgba.offset, offset = _h === void 0 ? 0 : _h;
+            const { buffer, stride = 0, offset = 0 } = rgba;
             gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
             gl.enableVertexAttribArray(3);
             gl.vertexAttribPointer(3, 4, gl.FLOAT, false, stride, offset);
             gl.vertexAttribDivisor(3, 1);
         }
         {
-            var buffer = dashRatio.buffer, _j = dashRatio.stride, stride = _j === void 0 ? 0 : _j, _k = dashRatio.offset, offset = _k === void 0 ? 0 : _k;
+            const { buffer, stride = 0, offset = 0 } = dashRatio;
             gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
             gl.enableVertexAttribArray(4);
             gl.vertexAttribPointer(4, 1, gl.FLOAT, false, stride, offset);
             gl.vertexAttribDivisor(4, 1);
         }
         {
-            var buffer = dashOpacity.buffer, _l = dashOpacity.stride, stride = _l === void 0 ? 0 : _l, _m = dashOpacity.offset, offset = _m === void 0 ? 0 : _m;
+            const { buffer, stride = 0, offset = 0 } = dashOpacity;
             gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
             gl.enableVertexAttribArray(5);
             gl.vertexAttribPointer(5, 1, gl.FLOAT, false, stride, offset);
@@ -100,18 +160,17 @@ var Logic = /** @class */ (function () {
         }
         gl.bindVertexArray(null);
         return vao;
-    };
-    Logic.prototype.free = function () {
+    }
+    free() {
         if (this.isFreed)
             return;
         totems_1.CameraUniformBlockTotemCache.release(this.globe);
         this.cameraBlockTotem = null;
         this.gl.deleteProgram(this.program);
         this.isFreed = true;
-    };
-    return Logic;
-}());
+    }
+}
 exports.AngledLineProgramCache = Object.freeze({
-    get: function (globe) { return programcache_1.noRegisterGlobeProgramCache.getProgram(globe, Logic); },
-    release: function (globe) { return programcache_1.noRegisterGlobeProgramCache.releaseProgram(globe, Logic); }
+    get: (globe) => { return programcache_1.noRegisterGlobeProgramCache.getProgram(globe, Logic); },
+    release: (globe) => { return programcache_1.noRegisterGlobeProgramCache.releaseProgram(globe, Logic); }
 });

package/programs/line-on-globe/circle-accurate-3d.js

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CircleCache = void 0;
-var webglobjectbuilders_1 = require("../../util/webglobjectbuilders");
-var camerauniformblock_1 = require("../totems/camerauniformblock");
-var programcache_1 = require("../programcache");
+const webglobjectbuilders_1 = require("../../util/webglobjectbuilders");
+const camerauniformblock_1 = require("../totems/camerauniformblock");
+const programcache_1 = require("../programcache");
 // import { vaoAttributeLoader } from "../../util/account/util";
-var attribute_loader_1 = require("../../util/gl-util/buffer/attribute-loader");
-var geometrytransformations_1 = require("../../util/shaderfunctions/geometrytransformations");
+const attribute_loader_1 = require("../../util/gl-util/buffer/attribute-loader");
+const geometrytransformations_1 = require("../../util/shaderfunctions/geometrytransformations");
 /**
  * TODO:
  * 1. integrate geometry functions for radius angle and center
@@ -15,22 +15,73 @@ var geometrytransformations_1 = require("../../util/shaderfunctions/geometrytran
  * TODO:
  * center_position is too small or doenst loaded as expected.
  */
-var EDGE_COUNT_ON_SPHERE = 360;
+const EDGE_COUNT_ON_SPHERE = 360;
 //${circleLimpFromLongLatRadCenterCartesian3D_accurate}
-var vertexShaderSource = "#version 300 es\nprecision highp float;\n".concat(geometrytransformations_1.PI, "\n").concat(camerauniformblock_1.CameraUniformBlockString, "\n").concat(geometrytransformations_1.cartesian3DToGLPosition, "\n").concat(geometrytransformations_1.circleOnSphere, "\n\nuniform float edge_count;\n\nin vec3 center_position3d;\nin vec3 target_position3d;\n// in float radius;\nin vec4 color;\nin float dash_ratio;\nin float dash_opacity;\n\nout float interpolation;\nout vec4 v_color;\nout float v_dash_ratio;\nout float v_dash_opacity;\nvoid main() {\n    interpolation = float( gl_VertexID ) / ").concat(EDGE_COUNT_ON_SPHERE, ".0;\n    if ( is3D ) {\n        float angle = PI * 2.0 * interpolation;\n        vec3 position = circleOnSphere(center_position3d, target_position3d, angle);\n        gl_Position = cartesian3DToGLPosition(position);\n    } else {\n        return;\n    }\n    v_dash_ratio = dash_ratio;\n    v_dash_opacity = dash_opacity;\n    v_color = color;\n    gl_PointSize = 3.0;\n}");
-var fragmentShaderSource = "#version 300 es\n".concat(geometrytransformations_1.POLE, "\nprecision highp float;\nuniform float opacity;\nin vec4 v_color;\nin float v_dash_ratio;\nin float v_dash_opacity;\nin float interpolation;\nin vec2 v_limp;\nout vec4 color;\nvoid main() {\n    color = v_color;\n    color.a *= opacity;\n    if ( v_dash_ratio == 1.0 || v_dash_ratio == 0.0 ) return;\n    if (fract(interpolation / (2.0 * v_dash_ratio)) < 0.5 ) {\n        color.a *= v_dash_opacity;\n    }   \n}\n");
-var Logic = /** @class */ (function () {
-    function Logic(globe) {
+const vertexShaderSource = `#version 300 es
+precision highp float;
+${geometrytransformations_1.PI}
+${camerauniformblock_1.CameraUniformBlockString}
+${geometrytransformations_1.cartesian3DToGLPosition}
+${geometrytransformations_1.circleOnSphere}
+
+uniform float edge_count;
+
+in vec3 center_position3d;
+in vec3 target_position3d;
+// in float radius;
+in vec4 color;
+in float dash_ratio;
+in float dash_opacity;
+
+out float interpolation;
+out vec4 v_color;
+out float v_dash_ratio;
+out float v_dash_opacity;
+void main() {
+    interpolation = float( gl_VertexID ) / ${EDGE_COUNT_ON_SPHERE}.0;
+    if ( is3D ) {
+        float angle = PI * 2.0 * interpolation;
+        vec3 position = circleOnSphere(center_position3d, target_position3d, angle);
+        gl_Position = cartesian3DToGLPosition(position);
+    } else {
+        return;
+    }
+    v_dash_ratio = dash_ratio;
+    v_dash_opacity = dash_opacity;
+    v_color = color;
+    gl_PointSize = 3.0;
+}`;
+const fragmentShaderSource = `#version 300 es
+${geometrytransformations_1.POLE}
+precision highp float;
+uniform float opacity;
+in vec4 v_color;
+in float v_dash_ratio;
+in float v_dash_opacity;
+in float interpolation;
+in vec2 v_limp;
+out vec4 color;
+void main() {
+    color = v_color;
+    color.a *= opacity;
+    if ( v_dash_ratio == 1.0 || v_dash_ratio == 0.0 ) return;
+    if (fract(interpolation / (2.0 * v_dash_ratio)) < 0.5 ) {
+        color.a *= v_dash_opacity;
+    }   
+}
+`;
+class Logic {
+    constructor(globe) {
         this.globe = globe;
         this.gl = globe.gl;
         this._lastOpacity = 1.0;
         this.program = (0, webglobjectbuilders_1.createProgram)(this.gl, vertexShaderSource, fragmentShaderSource);
-        var _a = this, gl = _a.gl, program = _a.program;
+        const { gl, program } = this;
         this.program.uniforms = {
             opacity: gl.getUniformLocation(program, "opacity")
         };
         { // initial uniform values
-            var currentProgram = gl.getParameter(gl.CURRENT_PROGRAM);
+            const currentProgram = gl.getParameter(gl.CURRENT_PROGRAM);
             gl.useProgram(program);
             gl.uniform1f(program.uniforms.opacity, 1.0);
             gl.useProgram(currentProgram);
@@ -44,26 +95,26 @@ var Logic = /** @class */ (function () {
         }
         this.cameraBindingPoint = 0;
         this.cameraBlockTotem = camerauniformblock_1.CameraUniformBlockTotemCache.get(globe);
-        var cameraBlockLocation = gl.getUniformBlockIndex(program, "CameraUniformBlock");
+        const cameraBlockLocation = gl.getUniformBlockIndex(program, "CameraUniformBlock");
         gl.uniformBlockBinding(program, cameraBlockLocation, this.cameraBindingPoint);
     }
-    Logic.prototype.createVAO = function (center3dObj, target3dObj, colorObj, dashRatioObj, dashOpacityObj) {
-        var gl = this.gl;
-        var vao = gl.createVertexArray();
-        var divisor = 1;
+    createVAO(center3dObj, target3dObj, colorObj, dashRatioObj, dashOpacityObj) {
+        const { gl } = this;
+        const vao = gl.createVertexArray();
+        const divisor = 1;
         gl.bindVertexArray(vao);
-        (0, attribute_loader_1.attributeLoader)(gl, center3dObj, 0, 3, { divisor: divisor });
-        (0, attribute_loader_1.attributeLoader)(gl, target3dObj, 1, 3, { divisor: divisor });
+        (0, attribute_loader_1.attributeLoader)(gl, center3dObj, 0, 3, { divisor });
+        (0, attribute_loader_1.attributeLoader)(gl, target3dObj, 1, 3, { divisor });
         // attributeLoader(gl, radiusObj, 1, 1, { divisor });
-        (0, attribute_loader_1.attributeLoader)(gl, colorObj, 2, 4, { divisor: divisor });
-        (0, attribute_loader_1.attributeLoader)(gl, dashRatioObj, 3, 1, { divisor: divisor });
-        (0, attribute_loader_1.attributeLoader)(gl, dashOpacityObj, 4, 1, { divisor: divisor });
+        (0, attribute_loader_1.attributeLoader)(gl, colorObj, 2, 4, { divisor });
+        (0, attribute_loader_1.attributeLoader)(gl, dashRatioObj, 3, 1, { divisor });
+        (0, attribute_loader_1.attributeLoader)(gl, dashOpacityObj, 4, 1, { divisor });
         gl.bindVertexArray(null);
         gl.bindVertexArray(null);
         return vao;
-    };
-    Logic.prototype.draw = function (vao, length, opacity) {
-        var _a = this, gl = _a.gl, program = _a.program, cameraBlockTotem = _a.cameraBlockTotem, cameraBindingPoint = _a.cameraBindingPoint;
+    }
+    draw(vao, length, opacity) {
+        const { gl, program, cameraBlockTotem, cameraBindingPoint } = this;
         gl.useProgram(program);
         if (this._lastOpacity !== opacity) {
             gl.uniform1f(program.uniforms.opacity, opacity);
@@ -75,17 +126,16 @@ var Logic = /** @class */ (function () {
         // gl.drawArraysInstanced(gl.POINTS, 0, EDGE_COUNT_ON_SPHERE + 1, length);
         cameraBlockTotem.unbind(cameraBindingPoint);
         gl.bindVertexArray(null);
-    };
-    Logic.prototype.free = function () {
+    }
+    free() {
         if (this.isFreed)
             return;
         camerauniformblock_1.CameraUniformBlockTotemCache.release(this.globe);
         this.gl.deleteProgram(this.program);
         this.isFreed = true;
-    };
-    return Logic;
-}());
+    }
+}
 exports.CircleCache = Object.freeze({
-    get: function (globe) { return programcache_1.noRegisterGlobeProgramCache.getProgram(globe, Logic); },
-    release: function (globe) { return programcache_1.noRegisterGlobeProgramCache.releaseProgram(globe, Logic); }
+    get: (globe) => programcache_1.noRegisterGlobeProgramCache.getProgram(globe, Logic),
+    release: (globe) => programcache_1.noRegisterGlobeProgramCache.releaseProgram(globe, Logic)
 });