@mapcatch/util 2.0.5 → 2.0.7

package/src/gl-operations/reglCommands/transitions.js

@@ -1,111 +0,0 @@
-import vertSingle from '../shaders/vertex/single.js'
-import vertDouble from '../shaders/vertex/double.js'
-
-import fragInterpolateColor from '../shaders/fragment/interpolateColor.js'
-import fragInterpolateColorOnly from '../shaders/fragment/interpolateColorOnly.js'
-import fragInterpolateValue from '../shaders/fragment/interpolateValue.js'
-
-import * as util from '../util'
-
-/**
- * The DrawCommand output by this function interpolates, for each pixel, between two values, one
- * from `textureA` and one from `textureB`. The same color scale / sentinel values are applied to
- * both.
- */
-export function createDrawTileInterpolateValueCommand (
-  regl,
-  commonConfig,
-  fragMacros
-) {
-  return regl({
-    ...commonConfig,
-    vert: vertDouble,
-    frag: util.defineMacros(fragInterpolateValue, fragMacros),
-    uniforms: {
-      ...commonConfig.uniforms,
-      scaleLength: regl.prop('scaleLength'),
-      sentinelLength: regl.prop('sentinelLength'),
-      scaleColormap: regl.prop('scaleColormap'),
-      sentinelColormap: regl.prop('sentinelColormap'),
-      aboveColor: regl.prop('aboveColor'),
-      belowColor: regl.prop('belowColor'),
-      textureA: (_, { textureA }) => textureA,
-      textureB: (_, { textureB }) => textureB,
-      interpolationFraction: (_, { interpolationFraction }) => interpolationFraction
-    },
-    attributes: {
-      ...commonConfig.attributes,
-      texCoordA: (_, { textureBoundsA }) => util.getTexCoordVerticesTriangleStripQuad(textureBoundsA),
-      texCoordB: (_, { textureBoundsB }) => util.getTexCoordVerticesTriangleStripQuad(textureBoundsB)
-    }
-  })
-}
-
-/**
- * The behavior of this DrawCommand is similar to the one above, except that pixels from `textureA`
- * are colorized with one color scale / set of sentinel values, while pixels from `textureB` use a
- * different color scale / set of sentinel values.
- */
-export function createDrawTileInterpolateColorCommand (
-  regl,
-  commonConfig,
-  fragMacros
-) {
-  return regl({
-    ...commonConfig,
-    vert: vertDouble,
-    frag: util.defineMacros(fragInterpolateColor, fragMacros),
-    uniforms: {
-      ...commonConfig.uniforms,
-      scaleLengthA: regl.prop('scaleLengthA'),
-      sentinelLengthA: regl.prop('sentinelLengthA'),
-      scaleColormapA: regl.prop('scaleColormapA'),
-      sentinelColormapA: regl.prop('sentinelColormapA'),
-      scaleLengthB: regl.prop('scaleLengthB'),
-      sentinelLengthB: regl.prop('sentinelLengthB'),
-      scaleColormapB: regl.prop('scaleColormapB'),
-      sentinelColormapB: regl.prop('sentinelColormapB'),
-      textureA: (_, { textureA }) => textureA,
-      textureB: (_, { textureB }) => textureB,
-      interpolationFraction: (_, { interpolationFraction }) => interpolationFraction
-    },
-    attributes: {
-      ...commonConfig.attributes,
-      texCoordA: (_, { textureBoundsA }) => util.getTexCoordVerticesTriangleStripQuad(textureBoundsA),
-      texCoordB: (_, { textureBoundsB }) => util.getTexCoordVerticesTriangleStripQuad(textureBoundsB)
-    }
-  })
-}
-
-/**
- * The behavior of this DrawCommand is similar to the one above, except that the pixel values
- * are the same. Only the colorscale changes.
- */
-export function createDrawTileInterpolateColorOnlyCommand (
-  regl,
-  commonConfig,
-  fragMacros
-) {
-  return regl({
-    ...commonConfig,
-    vert: vertSingle,
-    frag: util.defineMacros(fragInterpolateColorOnly, fragMacros),
-    uniforms: {
-      ...commonConfig.uniforms,
-      scaleLengthA: regl.prop('scaleLengthA'),
-      sentinelLengthA: regl.prop('sentinelLengthA'),
-      scaleColormapA: regl.prop('scaleColormapA'),
-      sentinelColormapA: regl.prop('sentinelColormapA'),
-      scaleLengthB: regl.prop('scaleLengthB'),
-      sentinelLengthB: regl.prop('sentinelLengthB'),
-      scaleColormapB: regl.prop('scaleColormapB'),
-      sentinelColormapB: regl.prop('sentinelColormapB'),
-      texture: (_, { texture }) => texture,
-      interpolationFraction: (_, { interpolationFraction }) => interpolationFraction
-    },
-    attributes: {
-      ...commonConfig.attributes,
-      texCoord: (_, { textureBounds }) => util.getTexCoordVerticesTriangleStripQuad(textureBounds)
-    }
-  })
-}

package/src/gl-operations/reglCommands/util.js

@@ -1,71 +0,0 @@
-import vertSingle from '../shaders/vertex/single.js'
-
-import fragConvertDem from '../shaders/fragment/convertDem.js'
-
-import * as util from '../util'
-
-const littleEndian = util.machineIsLittleEndian()
-
-/**
- * The object generated by this function should be merged into the DrawConfig for each Regl
- * command in the application.
- */
-export function getCommonDrawConfiguration (
-  tileSize,
-  nodataValue
-) {
-  return {
-    uniforms: {
-      nodataValue,
-      littleEndian,
-      transformMatrix: ({ viewportWidth, viewportHeight }) => (
-        util.getTransformMatrix(viewportWidth, viewportHeight)
-      )
-    },
-    attributes: {
-      position: (_, { canvasCoordinates }) => {
-        const [left, top] = canvasCoordinates
-        const [right, bottom] = [left + tileSize, top + tileSize]
-        return [
-          [left, top ],
-          [right, top ],
-          [left, bottom],
-          [right, bottom]
-        ]
-      }
-    },
-    // We don't need the depth buffer for 2D drawing. Leaving it enabled (and failing to clear it
-    // between draw calls) results in visual artifacts.
-    depth: { enable: false },
-    primitive: 'triangle strip',
-    count: 4,
-    viewport: (_, { canvasSize: [width, height] }) => ({ width, height })
-  }
-}
-
-/**
- * The command output by this function converts a tile in DEM format
- * to float32 packed as rgba.
- */
-export function createConvertDemCommand (
-  regl,
-  commonConfig
-) {
-  return regl({
-    ...commonConfig,
-    vert: vertSingle,
-    frag: fragConvertDem,
-    depth:  {
-      enable: false
-    },
-    uniforms: {
-      ...commonConfig.uniforms,
-      texture: (_, { texture }) => texture
-    },
-    attributes: {
-      ...commonConfig.attributes,
-      texCoord: [[0, 1], [1, 1], [0, 0], [1, 0]]
-    },
-    framebuffer: regl.prop('fbo')
-  })
-}

package/src/gl-operations/renderer.js

@@ -1,210 +0,0 @@
-import REGL from 'regl'
-import {
-  CLEAR_COLOR,
-  MAX_TEXTURE_DIMENSION,
-  EARTH_SUN_DISTANCE,
-  SUN_RADIUS
-} from './constants'
-
-import TextureManager from './texture_manager'
-import * as util from './util'
-import { vec3 } from 'gl-matrix'
-import * as reglCommands from './reglCommands'
-
-
-export default class Renderer {
-  constructor (gloperations, tileSize, nodataValue, scaleInput, sentinelInput, colorscaleMaxLength, sentinelMaxLength, aboveColor, belowColor) {
-    const canvas = document.createElement('canvas')
-    let maxTextureDimension = MAX_TEXTURE_DIMENSION
-    let normalTextureDimension = 1024
-
-    const regl = REGL({
-      canvas: canvas,
-      // profile: true,
-      // extension only used for advanced hillshading
-      // TODO: add fallback to rgba if writing to float fails
-      optionalExtensions: ['OES_texture_float', 'WEBGL_color_buffer_float'],
-      onDone: function (err, regl) {
-        if (err) {
-          console.error(err)
-          return
-        } else {
-          // cannot use this directly as it seems to cause some issues
-          // maxTextureDimension = regl.limits.maxTextureSize;
-          if (regl.limits.maxTextureSize > 2048) {
-            maxTextureDimension = 2048
-          }
-          if (regl.limits.maxTextureSize > 4096) {
-            maxTextureDimension = 4096
-          }
-          if (regl.limits.maxTextureSize > 8192) {
-            maxTextureDimension = 8192
-          }
-
-          // TODO: use lower normal dimension where relevant
-          // Currently set to same due to a bug
-          normalTextureDimension = maxTextureDimension
-        }
-        // TODO: Improve software rendering detection
-        if (regl.limits.maxFragmentUniforms === 261) {
-          console.warn('Software rendering detected. Many features of this plugin will fail.\
-          If you have a GPU, check if drivers are installed ok?')
-        }
-      }
-    })
-
-    const commonDrawConfig = reglCommands.getCommonDrawConfiguration(tileSize, nodataValue)
-    const fragMacros = {
-      SCALE_MAX_LENGTH: colorscaleMaxLength,
-      SENTINEL_MAX_LENGTH: sentinelMaxLength
-    }
-
-    // Assign object "instance" properties.
-    Object.assign(this, {
-      gloperations: gloperations,
-      canvas: canvas,
-      regl: regl,
-      tileSize: tileSize,
-      nodataValue: nodataValue,
-      maxTextureDimension: maxTextureDimension,
-      normalTextureDimension: normalTextureDimension,
-      scaleInput: scaleInput,
-      sentinelInput: sentinelInput,
-      scaleColormap: util.createColormapTexture(scaleInput, regl),
-      sentinelColormap: util.createColormapTexture(sentinelInput, regl),
-      textureManager: new TextureManager(regl, tileSize, normalTextureDimension, false),
-      drawTile: reglCommands.createDrawTileCommand(regl, commonDrawConfig, fragMacros),
-      aboveColor: util.colorStringToInts(aboveColor || '#00000000').map(i => i / 255.0),
-      belowColor: util.colorStringToInts(belowColor || '#00000000').map(i => i / 255.0)
-    })
-  }
-
-  destroy () {
-    if (this.regl) this.regl.destroy()
-    this.regl = null
-  }
-
-  renderTile ({ coords, pixelData }, _hillshadeOptions, zoom) {
-    const {
-      regl,
-      textureManager,
-      tileSize
-    } = this
-    this.setCanvasSize(tileSize, tileSize)
-    // Add image to the texture and retrieve its texture coordinates.
-    const textureBounds = textureManager.addTile(coords, pixelData)
-
-    regl.clear({ color: CLEAR_COLOR })
-
-    const zoomdelta = _hillshadeOptions.hsSimpleZoomdelta || 0
-
-    const offset_pixels = Math.max(0.5, 2 ** (zoom + zoomdelta) / 2048)
-    const offset_texcoords = offset_pixels / textureManager.texture.width
-
-    if (_hillshadeOptions.hillshadeType === 'none') {
-      this.drawTile({
-        canvasSize: [tileSize, tileSize],
-        canvasCoordinates: [0, 0],
-        textureBounds,
-        texture: textureManager.texture,
-        scaleLength: this.scaleInput.length,
-        sentinelLength: this.sentinelInput.length,
-        scaleColormap: this.scaleColormap,
-        sentinelColormap: this.sentinelColormap,
-        enableSimpleHillshade: false,
-        aboveColor: this.aboveColor,
-        belowColor: this.belowColor
-      })
-    } else if (_hillshadeOptions.hillshadeType === 'simple') {
-      this.drawTileHsSimple({
-        scaleLength: this.scaleInput.length,
-        sentinelLength: this.sentinelInput.length,
-        scaleColormap: this.scaleColormap,
-        sentinelColormap: this.sentinelColormap,
-        canvasSize: [tileSize, tileSize],
-        canvasCoordinates: [0, 0],
-        textureBounds: textureBounds,
-        texture: textureManager.texture,
-        textureSize: textureManager.texture.width,
-        tileSize: tileSize,
-        offset: offset_texcoords,
-        enableSimpleHillshade: true,
-        // elevationScale: _hillshadeOptions.hsElevationScale,
-        azimuth: _hillshadeOptions.hsSimpleAzimuth,
-        altitude: _hillshadeOptions.hsSimpleAltitude,
-        slopescale: _hillshadeOptions.hsSimpleSlopescale,
-        aboveColor: this.aboveColor,
-        belowColor: this.belowColor 
-      })
-    }
-
-    // Since the tile will fill the whole canvas, the offset is simply [0, 0].
-    return [0, 0]
-  }
-
-  setCanvasSize (width, height) {
-    Object.assign(this.canvas, { width, height })
-  }
-
-  generateAmbientDirections (iterations) {
-    const ambientDirections = []
-    for (let i = 0; i < iterations; i++) {
-      const direction = vec3.random(vec3.create(), Math.random())
-      ambientDirections.push(direction)
-    }
-    this.ambientDirections = ambientDirections
-  }
-
-  generateSunDirections (iterations, sunRadiusMultiplier) {
-    const sunDirections = []
-    for (let i = 0; i < iterations; i++) {
-      const direction = vec3.normalize(
-        vec3.create(),
-        vec3.add(
-          vec3.create(),
-          vec3.scale(
-            vec3.create(),
-            vec3.normalize(vec3.create(), [1, 1, 1]),
-            EARTH_SUN_DISTANCE
-          ),
-          vec3.random(vec3.create(), SUN_RADIUS * sunRadiusMultiplier)
-        )
-      )
-      sunDirections.push(direction)
-    }
-    this.sunDirections = sunDirections
-  }
-
-  updateColorscale (scaleInput) {
-    this.scaleInputPrevious = this.scaleInput
-    this.scaleInput = scaleInput
-    this.scaleColormapPrevious = this.scaleColormap
-    this.scaleColormap = util.createColormapTexture(scaleInput, this.regl)
-  }
-  updateOuteRangeColor (aboveColor, belowColor) {
-    this.aboveColorPrevious = this.aboveColor
-    this.aboveColor = util.colorStringToInts(aboveColor || '#00000000').map(i => i / 255.0)
-    this.belowColorPrevious = this.belowColor
-    this.belowColor = util.colorStringToInts(belowColor || '#00000000').map(i => i / 255.0)
-  }
-  updateSentinels (sentinelInput) {
-    this.sentinelInputPrevious = this.sentinelInput
-    this.sentinelInput = sentinelInput
-    this.sentinelColormapPrevious = this.sentinelColormap
-    this.sentinelColormap = util.createColormapTexture(sentinelInput, this.regl)
-  }
-  setMaxTextureDimension (newMaxTextureDimension) {
-    const {
-      textureManager,
-      tileSize,
-      regl
-    } = this
-
-    textureManager.destroy()
-
-    Object.assign(this, {
-      maxTextureDimension: newMaxTextureDimension,
-      textureManager: new TextureManager(regl, tileSize, newMaxTextureDimension, false)
-    })
-  }
-}

package/src/gl-operations/shaders/fragment/convertDem.js

@@ -1,26 +0,0 @@
-import glsl from 'glslify'
-
-export default glsl`#ifdef GL_FRAGMENT_PRECISION_HIGH
-precision highp float;
-#else
-precision mediump float;
-#endif
-
-#pragma glslify: floatToRgba = require(glsl-float-to-rgba)
-
-uniform float nodataValue;
-uniform bool littleEndian;
-uniform sampler2D texture;
-varying vec2 vTexCoord;
-
-void main() {
-  //sample the texture
-  vec3 rgb = texture2D(texture, vTexCoord).rgb;
-
-  // Convert the red, green, and blue channels into a float
-  float f = -10000.0 + ((rgb.r * 255.0 * 256.0 * 256.0 + rgb.g * 255.0 * 256.0 + rgb.b * 255.0) * 0.1);
-
-  // convert to rgba and write to framebuffer
-  gl_FragColor = floatToRgba(f, littleEndian);
-}
-`

package/src/gl-operations/shaders/fragment/convolutionSmooth.js

@@ -1,55 +0,0 @@
-import glsl from 'glslify'
-
-export default glsl`#ifdef GL_FRAGMENT_PRECISION_HIGH
-precision highp float;
-#else
-precision mediump float;
-#endif
-
-#pragma glslify: rgbaToFloat = require(glsl-rgba-to-float)
-#pragma glslify: floatToRgba = require(glsl-float-to-rgba)
-#pragma glslify: isCloseEnough = require(../util/isCloseEnough.glsl)
-#pragma glslify: getTexelValue = require(../util/getTexelValue.glsl)
-
-uniform sampler2D texture;
-uniform float textureSize;
-uniform bool littleEndian;
-uniform float nodataValue;
-varying vec2 vTexCoord;
-uniform int kernelSize;
-
-int kernelEnd = int(kernelSize/2);
-int kernelStart = kernelEnd * -1;
-
-float runConvKernel(vec2 pos, vec2 onePixel) {
-  float convKernelWeight = 0.0;
-  float sum = 0.0;
-
-  for (int i = -20; i < 20; i ++) {
-    if (i < kernelStart) continue;
-    if (i > kernelEnd) break;
-    for (int j = -20; j < 20; j ++) {
-      if (j < kernelStart) continue;
-      if (j > kernelEnd) break;
-      float texelValue = getTexelValue(texture, pos + onePixel * vec2(i, j), littleEndian);
-      if (!isCloseEnough(texelValue, nodataValue)) {
-        sum = sum + texelValue;
-        convKernelWeight = convKernelWeight + 1.0;
-      }
-    }
-  }
-  return (sum / convKernelWeight);
-}
-
-
-void main() {
-  float texelFloat = getTexelValue(texture, vTexCoord, littleEndian);
-  if (isCloseEnough(texelFloat, nodataValue)) {
-    gl_FragColor = floatToRgba(nodataValue, littleEndian);
-  } else {
-    vec2 onePixel = vec2(1.0, 1.0) / textureSize;
-    float texelFloatSmoothed = runConvKernel(vTexCoord, onePixel);
-    gl_FragColor = floatToRgba(texelFloatSmoothed, littleEndian);
-  }
-}
-`

package/src/gl-operations/shaders/fragment/diffCalc.js

@@ -1,34 +0,0 @@
-import glsl from 'glslify'
-
-export default glsl`#ifdef GL_FRAGMENT_PRECISION_HIGH
-precision highp float;
-#else
-precision mediump float;
-#endif
-
-#pragma glslify: floatToRgba = require(glsl-float-to-rgba)
-#pragma glslify: isCloseEnough = require(../util/isCloseEnough.glsl)
-#pragma glslify: getTexelValue = require(../util/getTexelValue.glsl)
-
-uniform float nodataValue;
-uniform bool littleEndian;
-uniform sampler2D textureA;
-uniform sampler2D textureB;
-
-varying vec2 vTexCoordA;
-varying vec2 vTexCoordB;
-
-void main() {
-  float texelFloatA = getTexelValue(textureA, vTexCoordA, littleEndian);
-  float texelFloatB = getTexelValue(textureB, vTexCoordB, littleEndian);
-  bool aIsNodata = isCloseEnough(texelFloatA, nodataValue);
-  bool bIsNodata = isCloseEnough(texelFloatB, nodataValue);
-
-  if (aIsNodata || bIsNodata) {
-    gl_FragColor = floatToRgba(nodataValue, littleEndian);
-  } else {
-    float diff = texelFloatB - texelFloatA;
-    gl_FragColor = floatToRgba(diff, littleEndian);
-  }
-}
-`

package/src/gl-operations/shaders/fragment/drawResult.js

@@ -1,47 +0,0 @@
-import glsl from 'glslify'
-
-export default glsl`#ifdef GL_FRAGMENT_PRECISION_HIGH
-precision highp float;
-#else
-precision mediump float;
-#endif
-
-#define TRANSPARENT vec4(0.0)
-
-#pragma glslify: computeColor = require(../util/computeColor.glsl)
-#pragma glslify: isCloseEnough = require(../util/isCloseEnough.glsl)
-#pragma glslify: getTexelValue = require(../util/getTexelValue.glsl)
-
-uniform int scaleLength;
-uniform int sentinelLength;
-uniform sampler2D scaleColormap;
-uniform sampler2D sentinelColormap;
-
-uniform float nodataValue;
-uniform sampler2D texture;
-uniform bool littleEndian;
-
-uniform vec4 aboveColor;
-uniform vec4 belowColor;
-
-varying vec2 vTexCoord;
-
-void main() {
-  float f = getTexelValue(texture, vTexCoord, littleEndian);
-
-  if (isCloseEnough(f, nodataValue)) {
-    gl_FragColor = TRANSPARENT;
-  } else {
-    gl_FragColor = computeColor(
-      f,
-      scaleColormap,
-      sentinelColormap,
-      scaleLength,
-      sentinelLength,
-      littleEndian,
-      aboveColor,
-      belowColor
-    );
-  }
-}
-`

package/src/gl-operations/shaders/fragment/hillshading/hsAdvAmbientShadows.js

@@ -1,79 +0,0 @@
-import glsl from 'glslify'
-
-export default glsl`#ifdef GL_FRAGMENT_PRECISION_HIGH
-precision highp float;
-#else
-precision mediump float;
-#endif
-
-uniform sampler2D tInput;
-uniform sampler2D tNormal;
-uniform sampler2D tSrc;
-uniform vec3 direction;
-uniform vec2 resolution;
-uniform float pixelScale;
-uniform float ambientIterations;
-varying vec2 vTexCoord;
-
-void main() {
-  vec2 ires = 1.0 / resolution;
-  vec3 src = texture2D(tSrc, gl_FragCoord.xy * ires).rgb;
-  vec4 e0 = texture2D(tInput, vTexCoord);
-  vec3 n0 = texture2D(tNormal, vTexCoord).rgb;
-
-  vec3 sr3d = normalize(n0 + direction); // ray direction
-  vec2 sr = normalize(sr3d.xy); // get 2D ray direction
-
-  // initialize pixel traversal algorithm
-  vec2 p0 = vTexCoord * resolution;
-  vec2 p = floor(p0); // pixel we are starting in
-  vec2 stp = sign(sr);
-
-  // how far we need to travel in our ray direction to intersect the next pixel
-  // in the x- and y- directions
-  vec2 tMax = step(0.0, sr) * (1.0 - fract(p0)) + (1.0 - step(0.0, sr)) * fract(p0);
-  tMax /= abs(sr);
-  // how far must we travel along our ray to cover the width and height of a pixel
-  vec2 tDelta = 1.0 / abs(sr);
-
-  // pixel traversal routine
-  for (int i = 0; i < 65536; i++) {
-    if (tMax.x < tMax.y) {
-      tMax.x += tDelta.x;
-      p.x += stp.x;
-    } else {
-      tMax.y += tDelta.y;
-      p.y += stp.y;
-    }
-
-    // normalized texture coordinate for the center of the current pixel
-    vec2 ptex = ires * (p + 0.5);
-
-    // If we left the tile: add some illumination to the pixel for this iteration and stop traversing
-    if (ptex.x < 0.0 || ptex.x > 1.0 || ptex.y < 0.0 || ptex.y > 1.0) {
-      // illumination of this single ray
-      vec3 illumination = vec3(1.0/ambientIterations);
-      // add illumination of this ray to result of previous iteration
-      gl_FragColor = vec4(src + illumination, 1.0);
-      return;
-    }
-
-    // elevation/value at current pixel
-    vec4 e = texture2D(tInput, ptex);
-    // time we have traveled along the 2D ray
-    float time = distance(p + 0.5, p0);
-    // elevation along our original 3D ray at the current point
-    float z = e0.r + time * pixelScale * sr3d.z;
-    // If we did not exit tile, have we hit the terrain?
-    if (e.r > z) {
-      // We hit terrain. Do not add illumination for this iteration
-      gl_FragColor = vec4(src, 1.0);
-      return;
-    }
-  }
-
-  // Should have hit terrain or left the tile by this point, so should never need this
-  // If we finish the loop somehow, let’s pretend it’s been illuminated
-  vec3 illumination = vec3(1.0/ambientIterations);
-  gl_FragColor = vec4(src + illumination, 1.0);
-}`

package/src/gl-operations/shaders/fragment/hillshading/hsAdvDirect.js

@@ -1,60 +0,0 @@
-import glsl from 'glslify'
-
-export default glsl`#ifdef GL_FRAGMENT_PRECISION_HIGH
-precision highp float;
-#else
-precision mediump float;
-#endif
-
-#pragma glslify: computeColor = require(../../util/computeColor.glsl)
-#pragma glslify: isCloseEnough = require(../../util/isCloseEnough.glsl)
-
-uniform sampler2D tInput;
-uniform sampler2D tNormal;
-uniform float floatScale;
-uniform vec3 sunDirection;
-uniform float nodataValue;
-uniform bool littleEndian;
-varying vec2 vTexCoord;
-
-uniform vec4 aboveColor;
-uniform vec4 belowColor;
-
-uniform int scaleLength;
-uniform int sentinelLength;
-uniform sampler2D scaleColormap;
-uniform sampler2D sentinelColormap;
-
-void main() {
-  float f = texture2D(tInput, vTexCoord).r;
-
-  if (isCloseEnough(f, nodataValue)) {
-    // discard;
-    gl_FragColor = vec4(0.0);
-  } else {
-    vec4 clr = computeColor(
-      f / floatScale,
-      scaleColormap,
-      sentinelColormap,
-      scaleLength,
-      sentinelLength,
-      littleEndian,
-      aboveColor,
-      belowColor
-    );
-
-    vec3 n = texture2D(tNormal, vTexCoord).rgb;
-
-    // light intensity that varies on the range  [−1..1]
-    float light = dot(n, sunDirection);
-    // transform the light intensity to the range [0..1]
-    light = 0.5 * light + 0.5;
-
-    // gl_FragColor = vec4(l, l, l, 1.0); // to show light
-
-    vec3 color = light * pow(clr.rgb, vec3(2.0));
-    color = pow(color, vec3(1.0/2.2));
-    gl_FragColor = vec4(color, 1.0);
-  }
-}
-`