@openglobus/og 0.11.7 → 0.12.3

package/src/og/shaders/geoObject.js

@@ -30,7 +30,8 @@ export const geo_object = () =>
             aDirection: { type: "vec3", divisor: 1 },
             aPitchRoll: { type: "vec2", divisor: 1 },
             aColor: { type: "vec4", divisor: 1 },
-            aScale: { type: "float", divisor: 1 }
+            aScale: { type: "float", divisor: 1 },
+            aDispose: { type: "float", divisor: 1 }
         },
         vertexShader: `precision highp float;
 
@@ -42,6 +43,7 @@ export const geo_object = () =>
             attribute vec2 aPitchRoll;
             attribute vec4 aColor;
             attribute float aScale;
+            attribute float aDispose;
             
             uniform vec3 uScaleByDistance;
             uniform mat4 projectionMatrix;
@@ -54,11 +56,13 @@ export const geo_object = () =>
             varying vec3 vNormal;
             varying vec4 vPosition;           
             varying vec4 vColor;
+            varying float vDispose;
             
             const float RADIANS = 3.141592653589793 / 180.0;
 
             void main(void) {
             
+                vDispose = aDispose;
                 vColor = aColor;
                 float roll = aPitchRoll.y * RADIANS;
                 mat3 rotZ = mat3(
@@ -91,7 +95,7 @@ export const geo_object = () =>
 
                 vPosition = viewMatrixRTE * vec4(highDiff + lowDiff, 1.0);
 
-                gl_Position = projectionMatrix * vPosition;
+                gl_Position = mix(vec4(0.0, 0.0, 0.0, 0.0), projectionMatrix * vPosition, aDispose);
             }`,
         fragmentShader: `precision highp float;
 
@@ -135,7 +139,7 @@ export const geo_object_picking = () =>
 
             eyePositionHigh: "vec3",
             eyePositionLow: "vec3",
-            pickingScale: "float",
+            pickingScale: "float"
 
         },
         attributes: {
@@ -145,7 +149,8 @@ export const geo_object_picking = () =>
             aDirection: { type: "vec3", divisor: 1 },
             aPitchRoll: { type: "vec2", divisor: 1 },
             aPickingColor: { type: "vec3", divisor: 1 },
-            aScale: { type: "float", divisor: 1 }
+            aScale: { type: "float", divisor: 1 },
+            aDispose: { type: "float", divisor: 1 }
         },
         vertexShader: `precision highp float;
 
@@ -156,6 +161,7 @@ export const geo_object_picking = () =>
             attribute vec2 aPitchRoll;
             attribute vec3 aPickingColor;
             attribute float aScale;
+            attribute float aDispose;
             
             uniform vec3 uScaleByDistance;
             uniform mat4 projectionMatrix;
@@ -165,12 +171,14 @@ export const geo_object_picking = () =>
             uniform vec3 eyePositionHigh;
             uniform vec3 eyePositionLow;
 
+            varying float vDispose;
             varying vec3 vColor;
             
             const float RADIANS = 3.141592653589793 / 180.0;
 
             void main(void) {
             
+                vDispose = aDispose;
                 vColor = aPickingColor;
                 float roll = aPitchRoll.y * RADIANS;
                 mat3 rotZ = mat3(
@@ -200,12 +208,13 @@ export const geo_object_picking = () =>
                 mat4 viewMatrixRTE = viewMatrix;
                 viewMatrixRTE[3] = vec4(0.0, 0.0, 0.0, 1.0);
 
-                gl_Position = projectionMatrix *viewMatrixRTE * vec4(highDiff + lowDiff, 1.0);
+                gl_Position = mix(vec4(0.0, 0.0, 0.0, 0.0),  projectionMatrix *viewMatrixRTE * vec4(highDiff + lowDiff, 1.0), aDispose);
             }`,
         fragmentShader:
             `precision highp float;
             varying vec3 vColor;
+            varying float vDispose;
             void main () {
-                gl_FragColor = vec4(vColor, 1.0);
+                gl_FragColor = vec4(vColor, vDispose);
             }`
     });

package/src/og/terrain/EmptyTerrain.js

@@ -14,7 +14,9 @@ class EmptyTerrain {
     constructor(options = {}) {
         this.equalizeVertices = false;
 
-        this.equalizeNormals = false;
+        this.equalizeNormals = false;
+
+        this.isEmpty = true;
 
         /**
          * Provider name is "empty"
@@ -106,7 +108,6 @@ class EmptyTerrain {
 
     set geoid(geoid) {
         this._geoid = geoid;
-        //...this._planet
     }
 
     get geoid() {

package/src/og/terrain/GlobusTerrain.js

@@ -66,6 +66,8 @@ class GlobusTerrain extends EmptyTerrain {
          */
         this.events = new Events(EVENT_NAMES, this);
 
+        this.isEmpty = false;
+
         this.equalizeNormals = true;
 
         /**

package/src/og/utils/GeoImageCreator.js

@@ -151,7 +151,11 @@ export class GeoImageCreator {
                 `precision highp float;
                         uniform sampler2D sourceTexture;
                         varying vec2 v_texCoords;
-                        void main () { 
+                        void main () {
+                            if(v_texCoords.x <= 0.001 || v_texCoords.x >= 0.999 ||
+                                v_texCoords.y <= 0.001 || v_texCoords.y >= 0.999) {
+                                discard;
+                            }
                             gl_FragColor = texture2D(sourceTexture, v_texCoords);
                         }`
         }));

package/src/og/utils/Loader.js

@@ -16,7 +16,7 @@ if (window && !('createImageBitmap' in window)) {
 
 export class Loader {
 
-    constructor(maxRequests = 12) {
+    constructor(maxRequests = 24) {
 
         this.MAX_REQUESTS = maxRequests;
 

package/src/og/utils/PlainSegmentWorker.js

@@ -222,19 +222,6 @@ const _programm = `
         res.x = nc * Math.sin(lonrad);
         res.y = (N * (1.0 - E2) + h) * slt;
         res.z = nc * Math.cos(lonrad);
-
-        //let cosLat = Math.cos(lat * RADIANS)
-        //let sinLat = Math.sin(lat * RADIANS)
-
-        //let cosLong = Math.cos(lon * RADIANS)
-        //let sinLong = Math.sin(lon * RADIANS)
-
-        //let c = 1.0 / Math.sqrt(cosLat * cosLat + (1 - f) * (1 - f) * sinLat * sinLat)
-        //s = (1 - f) * (1 - f) * c
-
-        //x = (R*c + altitude) * cosLat * cosLong
-        //y = (R*c + altitude) * cosLat * sinLong
-        //z = (R*s + altitude) * sinLat
     };
 
     var lonLatToCartesianInverse = function (lon, lat, heightFactor, res){

package/src/og/webgl/Handler.js

@@ -646,13 +646,17 @@ class Handler {
             this.initializeExtension(this._params.extensions[i], true);
         }
 
-        //
-        //TODO: webgl1 case
-        //
-        this.createTexture_n = this.createTexture_n_webgl2.bind(this);
-        this.createTexture_l = this.createTexture_l_webgl2.bind(this);
-        this.createTexture_mm = this.createTexture_mm_webgl2.bind(this);
-        this.createTexture_a = this.createTexture_a_webgl2.bind(this);
+        if (this.gl.type === "webgl") {
+            this.createTexture_n = this.createTexture_n_webgl1.bind(this);
+            this.createTexture_l = this.createTexture_l_webgl1.bind(this);
+            this.createTexture_mm = this.createTexture_mm_webgl1.bind(this);
+            this.createTexture_a = this.createTexture_a_webgl1.bind(this);
+        } else {
+            this.createTexture_n = this.createTexture_n_webgl2.bind(this);
+            this.createTexture_l = this.createTexture_l_webgl2.bind(this);
+            this.createTexture_mm = this.createTexture_mm_webgl2.bind(this);
+            this.createTexture_a = this.createTexture_a_webgl2.bind(this);
+        }
 
         this.createTexture["NEAREST"] = this.createTexture_n;
         this.createTexture["LINEAR"] = this.createTexture_l;
@@ -919,7 +923,7 @@ class Handler {
         /** Canvas resize checking */
         let canvas = this.canvas;
 
-        if (canvas.clientWidth * this._params.pixelRatio !== canvas.width || canvas.clientHeight * this._params.pixelRatio !== canvas.height) {
+        if (Math.floor(canvas.clientWidth * this._params.pixelRatio) !== canvas.width || Math.floor(canvas.clientHeight * this._params.pixelRatio) !== canvas.height) {
             this.setSize(canvas.clientWidth, canvas.clientHeight);
         }
 
@@ -979,7 +983,7 @@ class Handler {
         if (params && params.color) {
             imgCnv = new ImageCanvas(2, 2);
             imgCnv.fillColor(params.color);
-            texture = this.createTexture_n_webgl2(imgCnv._canvas, this.gl.RGBA8);
+            texture = this.createTexture_n_webgl2(imgCnv._canvas);
             texture.default = true;
             success(texture);
         } else if (params && params.url) {
@@ -994,7 +998,7 @@ class Handler {
         } else {
             imgCnv = new ImageCanvas(2, 2);
             imgCnv.fillColor("#C5C5C5");
-            texture = this.createTexture_n_webgl2(imgCnv._canvas, this.gl.RGBA8);
+            texture = this.createTexture_n_webgl2(imgCnv._canvas);
             texture.default = true;
             success(texture);
         }

package/types/Clock.d.ts

@@ -0,0 +1,94 @@
+/**
+ * Class represents application timer that stores custom current julian datetime, and time speed multiplier.
+ * @class
+ * @param {Object} [params] - Clock parameters:
+ * @param {number} [params.startDate=0.0] - Julian start date.
+ * @param {number} [params.endDate=0.0] - Julian end date.
+ * @param {number} [params.currentDate] - Julian current date. Default: current date.
+ * @param {number} [params.multiplier=1.0] - Time speed multiolier.
+ */
+export class Clock {
+    static set _staticCounter(arg: any);
+    static get _staticCounter(): any;
+    /**
+     *
+     * @param {Object} [params] - Clock parameters:
+     */
+    constructor(params?: any);
+    _id: number;
+    /**
+     * Clock name.
+     * @public
+     * @type {string}
+     */
+    public name: string;
+    /**
+     * Clock events.
+     * @public
+     * @type {Events}
+     */
+    public events: Events;
+    /**
+     * Start julian date clock loop.
+     * @public
+     * @type {number}
+     */
+    public startDate: number;
+    /**
+     * End julian date clock loop.
+     * @public
+     * @type {number}
+     */
+    public endDate: number;
+    /**
+     * Current julian datetime.
+     * @public
+     * @type {number}
+     */
+    public currentDate: number;
+    /**
+     * Timer speed multiplier.
+     * @public
+     * @type {number}
+     */
+    public multiplier: number;
+    /**
+     * Animation frame delta time.
+     * @public
+     * @readonly
+     * @type {number}
+     */
+    public readonly deltaTicks: number;
+    /**
+     * Timer activity.
+     * @public
+     * @type {boolean}
+     */
+    public active: boolean;
+    _intervalDelay: number;
+    _intervalStart: number;
+    _intervalCallback: any;
+    clearInterval(): void;
+    setInterval(delay: any, callback: any): void;
+    /**
+     * Sets current clock datetime.
+     * @public
+     * @param {Object} date - JavaScript Date object.
+     */
+    public setDate(date: any): void;
+    /**
+     * Returns current application date.
+     * @public
+     * @returns {Date} - Current date.
+     */
+    public getDate(): Date;
+    reset(): void;
+    _tick(dt: any): void;
+    /**
+     * @public
+     * @param {Clock} clock - Clock instance to compare.
+     * @returns {boolean} - Returns true if a clock is the same instance.
+     */
+    public equal(clock: Clock): boolean;
+}
+import { Events } from "./Events.js";

package/types/Deferred.d.ts

@@ -0,0 +1,6 @@
+export function Deferred(): void;
+export class Deferred {
+    resolve: any;
+    reject: any;
+    promise: Promise<any>;
+}

package/types/Events.d.ts

@@ -0,0 +1,77 @@
+/**
+ * Base events class to handle custom events.
+ * @class
+ */
+export class Events {
+    static set _staticCounter(arg: any);
+    static get _staticCounter(): any;
+    /**
+     *
+     * @param {Array.<string>} [eventNames] - Event names that could be dispatched.
+     * @param {*} [sender]
+     */
+    constructor(eventNames?: Array<string>, sender?: any);
+    /**
+     * Registered event names.
+     * @protected
+     * @type {Array.<string>}
+     */
+    protected _eventNames: Array<string>;
+    _sender: any;
+    /**
+     * Stop propagation flag
+     * @protected
+     * @type {boolean}
+     */
+    protected _stopPropagation: boolean;
+    _stampCache: {};
+    __id: number;
+    bindSender(sender: any): void;
+    /**
+     * Function that creates event object properties that would be dispatched.
+     * @public
+     * @param {Array.<string>} eventNames - Specified event names list.
+     */
+    public registerNames(eventNames: Array<string>): void;
+    _getStamp(name: any, id: any, ogid: any): string;
+    /**
+     * Returns true if event callback has stamped.
+     * @protected
+     * @param {Object} name - Event identifier.
+     * @param {Object} obj - Event callback.
+     * @return {boolean} -
+     */
+    protected _stamp(name: any, obj: any): boolean;
+    /**
+     * Attach listener.
+     * @public
+     * @param {string} name - Event name to listen.
+     * @param {eventCallback} callback - Event callback function.
+     * @param {Object} sender - Event callback function owner.
+     */
+    public on(name: string, callback: eventCallback, sender: any, priority?: number): void;
+    /**
+     * Stop listening event name with specified callback function.
+     * @public
+     * @param {string} name - Event name.
+     * @param {eventCallback} callback - Attached  event callback.
+     */
+    public off(name: string, callback: eventCallback): void;
+    /**
+     * Dispatch event.
+     * @public
+     * @param {Object} event - Event instance property that created by event name.
+     * @param {Object} [obj] - Event object.
+     */
+    public dispatch(event: any, ...args: any[]): boolean;
+    /**
+     * Brakes events propagation.
+     * @public
+     */
+    public stopPropagation(): void;
+    /**
+     * Removes all events.
+     * @public
+     */
+    public clear(): void;
+}

package/types/Extent.d.ts

@@ -0,0 +1,166 @@
+/**
+ * Represents geographical coordinates extent.
+ * @class
+ * @param {LonLat} [sw] - South West extent corner coordiantes.
+ * @param {LonLat} [ne] - North East extent corner coordiantes.
+ */
+export class Extent {
+    /**
+     * Whole mercator extent.
+     * @const
+     */
+    static get FULL_MERC(): Extent;
+    /**
+     * Degrees extent from north mercator limit to north pole.
+     * @const
+     */
+    static get NORTH_POLE_DEG(): Extent;
+    /**
+     * Degrees extent from south pole to south mercator limit.
+     * @const
+     */
+    static get SOUTH_POLE_DEG(): Extent;
+    /**
+     * Creates extent instance from values in array.
+     * @static
+     * @param {Array.<number>} arr - South west and north east longitude and latidudes packed in array. (exactly 4 entries)
+     * @return {Extent} Extent object.
+     */
+    static createFromArray(arr: Array<number>): Extent;
+    /**
+     * Creates bound extent instance by coordinate array.
+     * @static
+     * @param {Array.<LonLat>} arr - Coordinate array.
+     * @return {Extent} Extent object.
+     */
+    static createByCoordinates(arr: Array<LonLat>): Extent;
+    /**
+     * Creates bound extent instance by coordinate array.
+     * @static
+     * @param {Array.<Array<number>>} arr - Coordinate array. (exactly 2 entries)
+     * @return {Extent} Extent object.
+     */
+    static createByCoordinatesArr(arr: Array<Array<number>>): Extent;
+    /**
+     * Creates extent by meractor grid tile coordinates.
+     * @static
+     * @param {number} x -
+     * @param {number} y -
+     * @param {number} z -
+     * @param {number} width -
+     * @param {number} height -
+     * @returns {Extent} -
+     */
+    static fromTile(x: number, y: number, z: number, width: number, height: number): Extent;
+    /**
+     * @param {LonLat} [sw] - South West extent corner coordiantes.
+     * @param {LonLat} [ne] - North East extent corner coordiantes.
+     */
+    constructor(sw?: LonLat, ne?: LonLat);
+    /**
+     * @public
+     */
+    public southWest: LonLat;
+    /**
+     * @public
+     */
+    public northEast: LonLat;
+    /**
+     * Sets current bounding extent object by coordinate array.
+     * @public
+     * @param {Array.<LonLat>} arr - Coordinate array.
+     * @return {Extent} Current extent.
+     */
+    public setByCoordinates(arr: Array<LonLat>): Extent;
+    /**
+     * Determines if point inside extent.
+     * @public
+     * @param {LonLat} lonlat - Coordinate point.
+     * @return {boolean} Returns true if point inside extent.
+     */
+    public isInside(lonlat: LonLat): boolean;
+    /**
+     * Returns true if two extent overlap each other.
+     * @public
+     * @param {Extent} e - Another extent.
+     * @return {boolean} -
+     */
+    public overlaps(e: Extent): boolean;
+    /**
+     * Gets extent width.
+     * @public
+     * @return {number} Extent width.
+     */
+    public getWidth(): number;
+    /**
+     * Gets extent height.
+     * @public
+     * @return {number} Extent height.
+     */
+    public getHeight(): number;
+    /**
+     * Creates clone instance of the current extent.
+     * @public
+     * @return {Extent} Extent clone.
+     */
+    public clone(): Extent;
+    /**
+     * Gets the center coordinate of the extent.
+     * @public
+     * @return {number} Center coordinate.
+     */
+    public getCenter(): number;
+    /**
+     * @public
+     */
+    public getNorthWest(): LonLat;
+    /**
+     * @public
+     */
+    public getNorthEast(): LonLat;
+    getSouthWest(): LonLat;
+    /**
+     * @public
+     */
+    public getSouthEast(): LonLat;
+    /**
+     * @public
+     */
+    public getNorth(): number;
+    getEast(): number;
+    /**
+     * @public
+     */
+    public getWest(): number;
+    /**
+     * @public
+     */
+    public getSouth(): number;
+    /**
+     * Returns extents are equals.
+     * @param {Extent} extent - Extent.
+     * @returns {boolean} -
+     */
+    equals(extent: Extent): boolean;
+    /**
+     * Converts extent coordinates to mercator projection coordinates.
+     * @public
+     * @return {Extent} New instance of the current extent.
+     */
+    public forwardMercator(): Extent;
+    /**
+     * Converts extent coordinates from mercator projection to degrees.
+     * @public
+     * @return {Extent} New instance of the current extent.
+     */
+    public inverseMercator(): Extent;
+    /**
+     * Gets cartesian bounding bounds of the current ellipsoid.
+     * @public
+     * @param {Ellipsoid} ellipsoid - Ellipsoid.
+     * @return {Array.<number>} Cartesian 3d coordinate array. (exactly 6 entries)
+     */
+    public getCartesianBounds(ellipsoid: Ellipsoid): Array<number>;
+    toString(): string;
+}
+import { LonLat } from "./LonLat.js";

package/types/Globe.d.ts

@@ -0,0 +1,85 @@
+/**
+ * Creates a WebGL context with globe.
+ * @class
+ *
+ * @example <caption>Basic initialization</caption>
+ * globus = new og.Globe({
+ *     'atmosphere': false,
+ *     'target': 'globus',
+ *     'name': 'Earth',
+ *     'controls': [
+ *          new og.control.MouseNavigation({ autoActivate: true }),
+ *          new og.control.KeyboardNavigation({ autoActivate: true }),
+ *          new og.control.EarthCoordinates({ autoActivate: true, center: false }),
+ *          new og.control.LayerSwitcher({ autoActivate: true }),
+ *          new og.control.ZoomControl({ autoActivate: true }),
+ *          new og.control.TouchNavigation({ autoActivate: true }),
+ *          new og.control.Sun({ autoActivate: true })
+ *      ],
+ *     'terrain': new og.terrain.GlobusTerrain(),
+ *     'layers': [
+ *          new og.layer.XYZ("OpenStreetMap", { isBaseLayer: true, url: "http://b.tile.openstreetmap.org/{z}/{x}/{y}.png", visibility: true, attribution: 'Data @ <a href="http://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="http://www.openstreetmap.org/copyright">ODbL</a>' })
+ *      ],
+ *     'autoActivate': true
+ * });
+ *
+ * @param {object} options - Options:
+ * @param {string} options.target - HTML element id where planet canvas have to be created.
+ * @param {RenderNode} [options.skybox] - Render skybox. null - default.
+ * @param {string} [options.name] - Planet name. Default is unic identifier.
+ * @param {Terrain} [options.terrain] - Terrain provider. Default no terrain - og.terrain.EmptyTerrain.
+ * @param {Array.<control.Control>} [options.controls] - Renderer controls array.
+ * @param {Array.<Layer>} [options.layers] - Planet layers.
+ * @param {Extent} [options.viewExtent] - Viewable starting extent.
+ * @param {boolean} [options.autoActivate] - Globe rendering auto activation flag. True is default.
+ * @param {DOMElement} [options.attributionContainer] - Container for attribution list.
+ * @param {Number} [options.maxGridSize] = Maximal segment grid size. 128 is default
+ * @param {boolean} [options.useSpecularTexture] - use specular water mask
+ * @param {boolean} [options.useNightTexture] - show night cities
+ * @param {Number} [options.maxAltitude=15000000.0] - Maximal camera altitude above terrain
+ * @param {Number} [options.minAltitude=1.0] - Minimal camera altitude above terrain
+ * @param {Number} [options.maxEqualZoomAltitude=15000000.0] - Maximal altitude since segments on the screen bacame the same zoom level
+ * @param {Number} [options.minEqualZoomAltitude=10000.0] - Minimal altitude since segments on the screen bacame the same zoom level
+ * @param {Number} [options.minEqualZoomCameraSlope=0.8] - Minimal camera slope above te globe where segments on the screen bacame the same zoom level
+ * @param {Number} [options.loadingBatchSize=12] -
+ */
+export class Globe {
+    static set _staticCounter(arg: any);
+    static get _staticCounter(): any;
+    /**
+     * @param {*} options
+     */
+    constructor(options: any);
+    _canvas: HTMLCanvasElement;
+    div: any;
+    /**
+     * Interface for the renderer context(events, input states, renderer nodes etc.)
+     * @public
+     * @type {Renderer}
+     */
+    public renderer: Renderer;
+    /**
+     * Planet node name. Access with this.renderer.<name>
+     * @private
+     * @type {String}
+     */
+    private _planetName;
+    planet: Planet;
+    sun: any;
+    _opacityCounter: number;
+    _fadeHandler: any;
+    _stopHandler: any;
+    /**
+     * Starts screen brightness fading in effect by the duration time.
+     * @public
+     */
+    public fadeIn(): void;
+    /**
+     * Starts screen brightness fading out effect by the duration time.
+     * @public
+     * @param {number} duration - Fadeout duration time.
+     */
+    public fadeOut(): void;
+}
+import { Renderer } from "./renderer/Renderer.js";
+import { Planet } from "./scene/Planet.js";