@openglobus/og 0.13.8 → 0.13.10

package/src/og/layer/Layer.js

@@ -12,7 +12,7 @@ import { LonLat } from "../LonLat.js";
 import { Material } from "./Material.js";
 import { Vec3 } from "../math/Vec3.js";
 
-export const FADING_FACTOR = 0.29;
+const FADING_RATIO = 15.8;
 
 /**
  * @classdesc
@@ -27,6 +27,7 @@ export const FADING_FACTOR = 0.29;
  * @param {string} [options.attribution] - Layer attribution that displayed in the attribution area on the screen.
  * @param {boolean} [options.isBaseLayer=false] - This is a base layer.
  * @param {boolean} [options.visibility=true] - Layer visibility.
+ * @param {boolean} [options.displayInLayerSwitcher=true] - Presence of layer in dialog window of LayerSwitcher control.
  * @param {boolean} [options.isSRGB=false] - Layer image webgl nternal format.
  * @param {Extent} [options.extent=[[-180.0, -90.0], [180.0, 90.0]]] - Visible extent.
  * @param {string} [options.textureFilter="anisotropic"] - Image texture filter. Available values: "nearest", "linear", "mipmap" and "anisotropic".
@@ -67,6 +68,8 @@ class Layer {
          */
         this.name = name || "noname";
 
+        this.properties = options.properties || {};
+
         this._labelMaxLetters = options.labelMaxLetters;
 
         this.displayInLayerSwitcher =
@@ -141,7 +144,7 @@ class Layer {
 
         this._fading = options.fading || false;
 
-        this._fadingFactor = FADING_FACTOR;
+        this._fadingFactor = this._opacity / FADING_RATIO;
 
         if (this._fading) {
             this._fadingOpacity = this._visibility ? this._opacity : 0.0;
@@ -204,7 +207,7 @@ class Layer {
          * @public
          * @type {Events}
          */
-        this.events = new Events(EVENT_NAMES, this);
+        this.events = new Events(options.events ? [...EVENT_NAMES, ...options.events] : EVENT_NAMES, this);
     }
 
     static getTMS(x, y, z) {
@@ -239,20 +242,18 @@ class Layer {
     }
 
     set opacity(opacity) {
-        if (this._fading) {
-            if (opacity > this._opacity) {
-                this._fadingFactor = (opacity - this._opacity) / 2.8;
-            } else if (opacity < this._opacity) {
-                this._fadingFactor = (opacity - this._opacity) / 2.8;
+        if (opacity !== this._opacity) {
+            if (this._fading) {
+                if (opacity > this._opacity) {
+                    this._fadingFactor = (opacity - this._opacity) / FADING_RATIO;
+                } else if (opacity < this._opacity) {
+                    this._fadingFactor = (opacity - this._opacity) / FADING_RATIO;
+                }
+            } else {
+                this._fadingOpacity = opacity;
             }
-        } else {
-            this._fadingOpacity = opacity;
+            this._opacity = opacity;
         }
-        this._opacity = opacity;
-    }
-
-    get opacity() {
-        return this._opacity;
     }
 
     set pickingEnabled(picking) {
@@ -289,7 +290,7 @@ class Layer {
      * @returns {boolean} - Returns true if the layers is the same instance of the input.
      */
     isEqual(layer) {
-        return layer._id === this._id;
+        return layer && (layer._id === this._id);
     }
 
     /**
@@ -308,7 +309,9 @@ class Layer {
 
         this.createTexture = planet.renderer.handler.createTexture[this._textureFilter];
 
-        planet.layers.push(this);
+        // TODO: replace to planet
+        planet._layers.push(this);
+
         this._planet = planet;
         this.events.on("visibilitychange", planet._onLayerVisibilityChanged, planet);
         if (this._isBaseLayer && this._visibility) {
@@ -325,6 +328,10 @@ class Layer {
         this._bindPicking();
     }
 
+    get isIdle() {
+        return this._planet && this._planet._terrainCompletedActivated;
+    }
+
     /**
      * Assign picking color to the layer.
      * @protected
@@ -352,17 +359,20 @@ class Layer {
      * @returns {Layer} -This layer.
      */
     remove() {
-        var p = this._planet;
+        let p = this._planet;
         if (p) {
-            for (var i = 0; i < p.layers.length; i++) {
-                if (this.isEqual(p.layers[i])) {
+            //TODO: replace to planet
+            for (let i = 0; i < p._layers.length; i++) {
+                if (this.isEqual(p._layers[i])) {
                     p.renderer.clearPickingColor(this);
-                    p.layers.splice(i, 1);
+                    p._layers.splice(i, 1);
                     p.updateVisibleLayers();
                     this.clear();
                     p.events.dispatch(p.events.layerremove, this);
                     this.events.dispatch(this.events.remove, p);
                     this._planet = null;
+                    this._internalFormat = null;
+                    this.createTexture = null;
                     return this;
                 }
             }
@@ -377,8 +387,6 @@ class Layer {
     clear() {
         if (this._planet) {
             this._planet._clearLayerMaterial(this);
-            this._internalFormat = null;
-            this.createTexture = null;
         }
     }
 
@@ -513,7 +521,7 @@ class Layer {
             this._planet._renderCompleted = false;
         }
 
-        this.applyMaterial(m);
+        this.applyMaterial(m, true);
     }
 
     _preLoadRecursive(node, maxZoom) {
@@ -603,6 +611,14 @@ class Layer {
         // }
     }
 
+    get opacity() {
+        return this._opacity;
+    }
+
+    get screenOpacity() {
+        return this._fading ? this._fadingOpacity : this._opacity;
+    }
+
     _refreshFadingOpacity() {
         var p = this._planet;
         if (
@@ -620,20 +636,45 @@ class Layer {
             ) {
                 this._fadingOpacity = this._opacity;
             }
+
             return false;
         } else {
-            this._fadingOpacity -= FADING_FACTOR;
-
-            if (this._fadingOpacity < 0.0) {
-                this._fadingOpacity = 0.0;
-                return !this._visibility;
-            }
+            //this._fadingOpacity -= this._opacity / FADING_RATIO;
+            //if (this._fadingOpacity < 0.0) {
+            this._fadingOpacity = 0.0;
+            //}
+            return !this._visibility;
         }
     }
 
     createMaterial(segment) {
         return new Material(segment, this);
     }
+
+    redraw() {
+        if (this._planet) {
+            this._planet._quadTree.traverseTree((n) => {
+                    if (n.segment.materials[this._id]) {
+                        n.segment.materials[this._id].clear();
+                    }
+                }
+            );
+
+            this._planet._quadTreeNorth.traverseTree((n) => {
+                    if (n.segment.materials[this._id]) {
+                        n.segment.materials[this._id].clear();
+                    }
+                }
+            );
+
+            this._planet._quadTreeSouth.traverseTree((n) => {
+                    if (n.segment.materials[this._id]) {
+                        n.segment.materials[this._id].clear();
+                    }
+                }
+            );
+        }
+    }
 }
 
 const EVENT_NAMES = [

package/src/og/layer/Material.js

@@ -1,109 +1,109 @@
-/**
- * @module og/layer/Material
- */
-
-"use strict";
-
-class Material {
-    /**
-     *
-     * @param {*} segment
-     * @param {*} layer
-     */
-    constructor(segment, layer) {
-        this.segment = segment;
-        this.layer = layer;
-        this.isReady = false;
-        this.isLoading = false;
-        this.texture = null;
-        this.pickingMask = null;
-        //this.image = null;
-        this.textureExists = false;
-        this.appliedNodeId = 0;
-        this.texOffset = [0.0, 0.0, 1.0, 1.0];
-        this.loadingAttempts = 0;
-
-        // vector data
-        this._updateTexture = null;
-        this._updatePickingMask = null;
-        this.pickingReady = false;
-    }
-
-    ///**
-    // * @param {*} layer
-    // */
-    //assignLayer(layer) {
-    //    this.layer = layer;
-    //}
-
-    /**
-     *
-     */
-    abortLoading() {
-        this.layer.abortMaterialLoading(this);
-    }
-
-    _createTexture(img) {
-        return this.layer.createTexture(img, this.layer._internalFormat);
-    }
-
-    /**
-     *
-     * @param {*} img
-     */
-    applyImage(img) {
-        if (this.segment.initialized) {
-            this._updateTexture = null;
-            //this.image = img;
-            this.texture = this._createTexture(img);
-            this.appliedNodeId = this.segment.node.nodeId;
-            this.isReady = true;
-            this.pickingReady = true;
-            this.textureExists = true;
-            this.isLoading = false;
-            this.texOffset = [0.0, 0.0, 1.0, 1.0];
-        }
-    }
-
-    /**
-     *
-     * @param {*} texture
-     * @param {*} pickingMask
-     */
-    applyTexture(texture, pickingMask) {
-        if (this.segment.initialized) {
-            this.texture = texture;
-            this._updateTexture = null;
-            this.pickingMask = pickingMask || null;
-            this._updatePickingMask = null;
-            this.isReady = true;
-            this.pickingReady = true;
-            this.textureExists = true;
-            this.isLoading = false;
-            this.appliedNodeId = this.segment.node.nodeId;
-            this.texOffset = [0.0, 0.0, 1.0, 1.0];
-        }
-    }
-
-    /**
-     *
-     */
-    textureNotExists() {
-        if (this.segment.initialized) {
-            this.pickingReady = true;
-            this.isLoading = false;
-            this.isReady = true;
-            this.textureExists = false;
-        }
-    }
-
-    /**
-     *
-     */
-    clear() {
-        this.loadingAttempts = 0;
-        this.layer.clearMaterial(this);
-    }
-}
-
-export { Material };
+/**
+ * @module og/layer/Material
+ */
+
+"use strict";
+
+class Material {
+    /**
+     *
+     * @param {*} segment
+     * @param {*} layer
+     */
+    constructor(segment, layer) {
+        this.segment = segment;
+        this.layer = layer;
+        this.isReady = false;
+        this.isLoading = false;
+        this.texture = null;
+        this.pickingMask = null;
+        //this.image = null;
+        this.textureExists = false;
+        this.appliedNodeId = 0;
+        this.texOffset = [0.0, 0.0, 1.0, 1.0];
+        this.loadingAttempts = 0;
+
+        // vector data
+        this._updateTexture = null;
+        this._updatePickingMask = null;
+        this.pickingReady = false;
+    }
+
+    ///**
+    // * @param {*} layer
+    // */
+    //assignLayer(layer) {
+    //    this.layer = layer;
+    //}
+
+    /**
+     *
+     */
+    abortLoading() {
+        this.layer.abortMaterialLoading(this);
+    }
+
+    _createTexture(img) {
+        return this.layer._planet && this.layer.createTexture(img, this.layer._internalFormat);
+    }
+
+    /**
+     *
+     * @param {*} img
+     */
+    applyImage(img) {
+        if (this.segment.initialized) {
+            this._updateTexture = null;
+            //this.image = img;
+            this.texture = this._createTexture(img);
+            this.appliedNodeId = this.segment.node.nodeId;
+            this.isReady = true;
+            this.pickingReady = true;
+            this.textureExists = true;
+            this.isLoading = false;
+            this.texOffset = [0.0, 0.0, 1.0, 1.0];
+        }
+    }
+
+    /**
+     *
+     * @param {*} texture
+     * @param {*} pickingMask
+     */
+    applyTexture(texture, pickingMask) {
+        if (this.segment.initialized) {
+            this.texture = texture;
+            this._updateTexture = null;
+            this.pickingMask = pickingMask || null;
+            this._updatePickingMask = null;
+            this.isReady = true;
+            this.pickingReady = true;
+            this.textureExists = true;
+            this.isLoading = false;
+            this.appliedNodeId = this.segment.node.nodeId;
+            this.texOffset = [0.0, 0.0, 1.0, 1.0];
+        }
+    }
+
+    /**
+     *
+     */
+    textureNotExists() {
+        if (this.segment.initialized) {
+            this.pickingReady = true;
+            this.isLoading = false;
+            this.isReady = true;
+            this.textureExists = false;
+        }
+    }
+
+    /**
+     *
+     */
+    clear() {
+        this.loadingAttempts = 0;
+        this.layer.clearMaterial(this);
+    }
+}
+
+export { Material };

package/src/og/layer/Vector.js

@@ -83,6 +83,7 @@ class Vector extends Layer {
 
         this._hasImageryTiles = false;
 
+
         /**
          * First index - near distance to the entity, after that entity becomes full scale.
          * Second index - far distance to the entity, when entity becomes zero scale.

package/src/og/layer/XYZ.js

@@ -76,11 +76,6 @@ class XYZ extends Layer {
          */
         this.maxNativeZoom = options.maxNativeZoom || 19;
 
-        /**
-         * @protected
-         */
-        this._crossOrigin = options.crossOrigin === undefined ? "" : options.crossOrigin;
-
         /**
          * Rewrites imagery tile url query.
          * @private
@@ -90,10 +85,16 @@ class XYZ extends Layer {
          * @returns {string} - Url query string.
          */
         this._urlRewriteCallback = options.urlRewrite || null;
+
+        this._requestsPeerSubdomian = 4;
+        this._requestCount = 0;
     }
 
+    /**
+     * @warning Use XYZ.isIdle in requesAnimationFrame(after setVisibility)
+     */
     get isIdle() {
-        return !this._planet || this._planet._tileLoader.isIdle(this);
+        return super.isIdle && this._planet._tileLoader.getRequestCounter(this) === 0;
     }
 
     get instanceName() {
@@ -106,7 +107,7 @@ class XYZ extends Layer {
      */
     abortLoading() {
         if (this._planet) {
-            this._planet._tileLoader.abort();
+            this._planet._tileLoader.abort(this);
         }
     }
 
@@ -118,13 +119,17 @@ class XYZ extends Layer {
     setVisibility(visibility) {
         if (visibility !== this._visibility) {
             super.setVisibility(visibility);
-
             if (!visibility) {
                 this.abortLoading();
             }
         }
     }
 
+    remove() {
+        this.abortLoading();
+        super.remove();
+    }
+
     /**
      * Sets imagery tiles url source template.
      * @public
@@ -148,6 +153,7 @@ class XYZ extends Layer {
      * @param {Material} material - Loads current material.
      */
     loadMaterial(material, forceLoading) {
+
         let seg = material.segment;
 
         if (this._isBaseLayer) {
@@ -216,7 +222,9 @@ class XYZ extends Layer {
     }
 
     _getSubdomain() {
-        return this._s[Math.floor(Math.random() * this._s.length)];
+        this._requestCount++;
+        return this._s[Math.floor(this._requestCount % (this._requestsPeerSubdomian * this._s.length) / this._requestsPeerSubdomian)];
+
     }
 
     /**
@@ -240,7 +248,7 @@ class XYZ extends Layer {
         this._urlRewriteCallback = ur;
     }
 
-    applyMaterial(material) {
+    applyMaterial(material, forceLoading) {
         if (material.isReady) {
             return material.texOffset;
         } else if (material.segment.tileZoom <= this.minNativeZoom) {
@@ -267,7 +275,7 @@ class XYZ extends Layer {
                 if (pn.segment.tileZoom === maxNativeZoom) {
                     material.textureNotExists();
                 } else if (material.segment.tileZoom <= maxNativeZoom) {
-                    !material.isLoading && !material.isReady && this.loadMaterial(material);
+                    !material.isLoading && !material.isReady && this.loadMaterial(material, forceLoading);
                 } else {
                     let pn = segment.node;
                     while (pn.segment.tileZoom > material.layer.maxNativeZoom) {
@@ -309,7 +317,7 @@ class XYZ extends Layer {
     clearMaterial(material) {
         if (material.isReady && material.textureExists) {
             !material.texture.default &&
-                material.segment.handler.gl.deleteTexture(material.texture);
+            material.segment.handler.gl.deleteTexture(material.texture);
             material.texture = null;
 
             if (material.image) {