refactor(ColorLayer): add effect type ColorLayer parameter.

DEPRECATED:
ColorLayer.fx is deprecated, use type_effect and amount_effect instead.

examples/layers/JSONLayers/ScanEX.json

@@ -1,6 +1,7 @@
 {
     "id":         "ScanEX",
-    "fx" :        2.5,
+    "effect_type": 3,
+    "effect_parameter": 2.5,
     "source": {
         "crs": "EPSG:3857",
         "url": "https://wxs.ign.fr/3ht7xcw6f7nciopo16etuqp2/geoportail/wmts",

examples/vector_tile_raster_3d.html

@@ -68,7 +68,8 @@
 
             var mvtLayer = new itowns.ColorLayer('MVT', {
                 source: mvtSource,
-                fx: 2.5,
+                effect_type: itowns.colorLayerEffects.removeLightColor,
+                effect_parameter: 2.5,
                 addLabelLayer: true,
             });
 

src/Core/Deprecated/Undeprecator.js

@@ -1,3 +1,19 @@
+import { colorLayerEffects } from 'Renderer/LayeredMaterial';
+
+export const deprecatedColorLayerOptions = (options) => {
+    if (options.fx) {
+        console.warn('ColorLayer fx is deprecated, use ColorLayer.effect_type and ColorLayer.effect_parameter instead.');
+        if (options.fx > 2.0) {
+            options.effect_parameter = options.fx;
+            options.effect_type = colorLayerEffects.removeLightColor;
+        } else if (options.fx > 0.0) {
+            options.effect_parameter = options.fx;
+            options.effect_type = colorLayerEffects.removeWhiteColor;
+        }
+    }
+    return options;
+};
+
 export const deprecatedParsingOptionsToNewOne = (options) => {
     /* istanbul ignore next */
     if (options.crsOut || options.crsIn) {

src/Layer/ColorLayer.js

@@ -2,6 +2,7 @@ import RasterLayer from 'Layer/RasterLayer';
 import { updateLayeredMaterialNodeImagery } from 'Process/LayeredMaterialNodeProcessing';
 import { RasterColorTile } from 'Renderer/RasterTile';
 import Style from 'Core/Style';
+import { deprecatedColorLayerOptions } from 'Core/Deprecated/Undeprecator';
 
 /**
  * Fires when the visiblity of the layer has changed.
@@ -26,11 +27,13 @@ import Style from 'Core/Style';
  * @property {number} opacity - property to adjust transparency, opacity is between 0. and 1.
  * @property {boolean} transparent - specify if the layer could be transparent.
  * @property {boolean} noTextureParentOutsideLimit - don't parent texture if it's outside limit.
- * @property {number} fx - special effects apply on raster color.
- * if `fx` equals:
+ * @property {number} effect_type - type effect to apply on raster color.
+ * if `effect_type` equals:
  * * `0`: no special effect.
- * * `> 0. to < 2.0`: light color to invisible effect.
- * * `>= 2`: white color to invisible effect.
+ * * `1`: light color to invisible effect.
+ * * `2`: white color to invisible effect.
+ * * `3`: custom shader effect (defined `ShaderChunk.customBodyColorLayer` and `ShaderChunk.customHeaderColorLayer`).
+ * @property {number} effect_parameter - amount value used with effect applied on raster color.
  */
 class ColorLayer extends RasterLayer {
     /**
@@ -52,6 +55,13 @@ class ColorLayer extends RasterLayer {
      * @param {Source} [config.source] - Description and options of the source.
      * @param {number} [config.magFilter] - How the texture is sampled when a texel covers more than one pixel. [see](https://threejs.org/docs/?q=texture#api/en/textures/Texture.magFilter)
      * @param {number} [config.minFilter] - How the texture is sampled when a texel covers less than one pixel. [see](https://threejs.org/docs/?q=texture#api/en/textures/Texture.minFilter)
+     * @param {number} [effect_type=0] - type effect to apply on raster color.
+     * if `effect_type` equals:
+     * * `0`: no special effect.
+     * * `1`: light color to invisible effect.
+     * * `2`: white color to invisible effect.
+     * * `3`: custom shader effect (defined `ShaderChunk.customBodyColorLayer` and `ShaderChunk.customHeaderColorLayer`).
+     * @param {number} [effect_parameter=1.0] - amount value used with effect applied on raster color.
      *
      * @example
      * // Create a ColorLayer
@@ -71,6 +81,7 @@ class ColorLayer extends RasterLayer {
      * view.addLayer(color);
      */
     constructor(id, config = {}) {
+        deprecatedColorLayerOptions(config);
         super(id, config);
         this.isColorLayer = true;
         this.style = new Style(config.style);
@@ -79,7 +90,6 @@ class ColorLayer extends RasterLayer {
         this.defineLayerProperty('sequence', 0);
         this.transparent = config.transparent || (this.opacity < 1.0);
         this.noTextureParentOutsideLimit = config.source ? config.source.isFileSource : false;
-        this.fx = config.fx || 0;
 
         // Feature options
         this.buildExtent = true;

src/Main.js

@@ -32,7 +32,7 @@ export { default as DEMUtils } from 'Utils/DEMUtils';
 export { default as CameraUtils } from 'Utils/CameraUtils';
 export { default as OrientationUtils } from 'Utils/OrientationUtils';
 export { default as ShaderChunk } from 'Renderer/Shader/ShaderChunk';
-export { getMaxColorSamplerUnitsCount } from 'Renderer/LayeredMaterial';
+export { getMaxColorSamplerUnitsCount, colorLayerEffects } from 'Renderer/LayeredMaterial';
 export { default as Capabilities } from 'Core/System/Capabilities';
 export { CAMERA_TYPE } from 'Renderer/Camera';
 

src/Renderer/LayeredMaterial.js

@@ -31,6 +31,13 @@ export function getMaxColorSamplerUnitsCount() {
     return Math.min(maxSamplerUnitsCount - samplersElevationCount, maxSamplersColorCount);
 }
 
+export const colorLayerEffects = {
+    noEffect: 0,
+    removeLightColor: 1,
+    removeWhiteColor: 2,
+    customEffect: 3,
+};
+
 const defaultStructLayer = {
     bias: 0,
     zmin: 0,
@@ -40,7 +47,8 @@ const defaultStructLayer = {
     textureOffset: 0,
     opacity: 0,
     crs: 0,
-    effect: 0,
+    effect_parameter: 0,
+    effect_type: colorLayerEffects.noEffect,
 };
 
 function updateLayersUniforms(uniforms, olayers, max) {

src/Renderer/RasterTile.js

@@ -105,8 +105,11 @@ class RasterTile extends THREE.EventDispatcher {
 export default RasterTile;
 
 export class RasterColorTile extends RasterTile {
-    get effect() {
-        return this.layer.fx;
+    get effect_type() {
+        return this.layer.effect_type;
+    }
+    get effect_parameter() {
+        return this.layer.effect_parameter;
     }
 }
 

src/Renderer/Shader/Chunk/color_layers_pars_fragment.glsl

@@ -1,7 +1,8 @@
 struct Layer {
     int textureOffset;
     int crs;
-    float effect;
+    int effect_type;
+    float effect_parameter;
     float opacity;
 };
 
@@ -60,16 +61,14 @@ vec4 getLayerColor(int textureOffset, sampler2D tex, vec4 offsetScale, Layer lay
     float borderDistance = getBorderDistance(uv.xy);
     if (textureOffset != layer.textureOffset + int(uv.z) || borderDistance < minBorderDistance ) return vec4(0);
     vec4 color = texture2D(tex, pitUV(uv.xy, offsetScale));
-    if(layer.effect != 0.0) {
-        if (layer.effect <= - 1.0) {
-            #include <itowns/custom_body_colorLayer>
-        } else if(layer.effect > 2.0) {
-            color.rgb /= color.a;
-            color = applyLightColorToInvisibleEffect(color, layer.effect);
-        } else if(layer.effect > 0.0) {
-            color.rgb /= color.a;
-            color = applyWhiteToInvisibleEffect(color, layer.effect);
-        }
+    if (layer.effect_type == 1) {
+        color.rgb /= color.a;
+        color = applyLightColorToInvisibleEffect(color, layer.effect_parameter);
+    } else if (layer.effect_type == 2) {
+        color.rgb /= color.a;
+        color = applyWhiteToInvisibleEffect(color, layer.effect_parameter);
+    } else if (layer.effect_type == 3) {
+        #include <itowns/custom_body_colorLayer>
     }
     color.a *= layer.opacity;
     return color;