@cesium/engine 1.0.0 → 2.0.0

package/Source/Renderer/Context.js

@@ -4,6 +4,7 @@ import ComponentDatatype from "../Core/ComponentDatatype.js";
 import createGuid from "../Core/createGuid.js";
 import defaultValue from "../Core/defaultValue.js";
 import defined from "../Core/defined.js";
+import deprecationWarning from "../Core/deprecationWarning.js";
 import destroyObject from "../Core/destroyObject.js";
 import DeveloperError from "../Core/DeveloperError.js";
 import Geometry from "../Core/Geometry.js";
@@ -44,7 +45,7 @@ function Context(canvas, options) {
 
   const {
     getWebGLStub,
-    requestWebgl2 = false,
+    requestWebgl1,
     webgl: webglOptions = {},
     allowTextureFilterAnisotropic = true,
   } = defaultValue(options, {});
@@ -59,12 +60,11 @@ function Context(canvas, options) {
 
   const glContext = defined(getWebGLStub)
     ? getWebGLStub(canvas, webglOptions)
-    : getWebGLContext(canvas, webglOptions, requestWebgl2);
+    : getWebGLContext(canvas, webglOptions, requestWebgl1);
 
   // Get context type. instanceof will throw if WebGL2 is not supported
-  const webgl2 =
-    typeof WebGL2RenderingContext !== "undefined" &&
-    glContext instanceof WebGL2RenderingContext;
+  const webgl2Supported = typeof WebGL2RenderingContext !== "undefined";
+  const webgl2 = webgl2Supported && glContext instanceof WebGL2RenderingContext;
 
   this._canvas = canvas;
   this._originalGLContext = glContext;
@@ -367,7 +367,7 @@ function Context(canvas, options) {
    */
   this.options = {
     getWebGLStub: getWebGLStub,
-    requestWebgl2: requestWebgl2,
+    requestWebgl1: requestWebgl1,
     webgl: webglOptions,
     allowTextureFilterAnisotropic: allowTextureFilterAnisotropic,
   };
@@ -397,7 +397,7 @@ function Context(canvas, options) {
  * especially for horizon views.
  * </p>
  *
- * @property {Boolean} [requestWebGl2 = false] If true and the browser supports it, use a WebGL 2 rendering context
+ * @property {Boolean} [requestWebGl1=false] If true and the browser supports it, use a WebGL 1 rendering context
  * @property {Boolean} [allowTextureFilterAnisotropic=true] If true, use anisotropic filtering during texture sampling
  * @property {WebGLOptions} [webgl] WebGL options to be passed on to canvas.getContext
  * @property {Function} [getWebGLStub] A function to create a WebGL stub for testing
@@ -407,19 +407,23 @@ function Context(canvas, options) {
  * @private
  * @param {HTMLCanvasElement} canvas The canvas element to which the context will be associated
  * @param {WebGLOptions} webglOptions WebGL options to be passed on to HTMLCanvasElement.getContext()
- * @param {Boolean} requestWebgl2 Whether to request a WebGL2RenderingContext
+ * @param {Boolean} requestWebgl1 Whether to request a WebGLRenderingContext or a WebGL2RenderingContext.
  * @returns {WebGLRenderingContext|WebGL2RenderingContext}
  */
-function getWebGLContext(canvas, webglOptions, requestWebgl2) {
+function getWebGLContext(canvas, webglOptions, requestWebgl1) {
   if (typeof WebGLRenderingContext === "undefined") {
     throw new RuntimeError(
       "The browser does not support WebGL.  Visit http://get.webgl.org."
     );
   }
 
-  requestWebgl2 =
-    requestWebgl2 && typeof WebGL2RenderingContext !== "undefined";
-  const contextType = requestWebgl2 ? "webgl2" : "webgl";
+  // Ensure that WebGL 2 is supported when it is requested. Otherwise, fall back to WebGL 1.
+  const webgl2Supported = typeof WebGL2RenderingContext !== "undefined";
+  if (!requestWebgl1 && !webgl2Supported) {
+    requestWebgl1 = true;
+  }
+
+  const contextType = requestWebgl1 ? "webgl" : "webgl2";
   const glContext = canvas.getContext(contextType, webglOptions);
 
   if (!defined(glContext)) {
@@ -1633,4 +1637,8 @@ Context.prototype.destroy = function () {
 
   return destroyObject(this);
 };
+
+// Used for specs.
+Context._deprecationWarning = deprecationWarning;
+
 export default Context;

package/Source/Renderer/Pass.js

@@ -20,7 +20,8 @@ const Pass = {
   CESIUM_3D_TILE_CLASSIFICATION_IGNORE_SHOW: 6,
   OPAQUE: 7,
   TRANSLUCENT: 8,
-  OVERLAY: 9,
-  NUMBER_OF_PASSES: 10,
+  VOXELS: 9,
+  OVERLAY: 10,
+  NUMBER_OF_PASSES: 11,
 };
 export default Object.freeze(Pass);

package/Source/Renderer/ShaderBuilder.js

@@ -43,9 +43,9 @@ import ShaderFunction from "./ShaderFunction.js";
  *  "void main()",
  *  "{",
  *  "    #ifdef SOLID_COLOR",
- *  "    gl_FragColor = vec4(u_color, 1.0);",
+ *  "    out_FragColor = vec4(u_color, 1.0);",
  *  "    #else",
- *  "    gl_FragColor = vec4(v_color, 1.0);",
+ *  "    out_FragColor = vec4(v_color, 1.0);",
  *  "    #endif",
  *  "}"
  * ]);
@@ -307,7 +307,7 @@ ShaderBuilder.prototype.addUniform = function (type, identifier, destination) {
  * @return {Number} The integer location of the attribute. This location can be used when creating attributes for a {@link VertexArray}. This will always be 0.
  *
  * @example
- * // creates the line "attribute vec3 a_position;"
+ * // creates the line "in vec3 a_position;"
  * shaderBuilder.setPositionAttribute("vec3", "a_position");
  */
 ShaderBuilder.prototype.setPositionAttribute = function (type, identifier) {
@@ -322,7 +322,7 @@ ShaderBuilder.prototype.setPositionAttribute = function (type, identifier) {
   }
   //>>includeEnd('debug');
 
-  this._positionAttributeLine = `attribute ${type} ${identifier};`;
+  this._positionAttributeLine = `in ${type} ${identifier};`;
 
   // Some WebGL implementations require attribute 0 to always be active, so
   // this builder assumes the position will always go in location 0
@@ -343,7 +343,7 @@ ShaderBuilder.prototype.setPositionAttribute = function (type, identifier) {
  * @return {Number} The integer location of the attribute. This location can be used when creating attributes for a {@link VertexArray}
  *
  * @example
- * // creates the line "attribute vec2 a_texCoord0;" in the vertex shader
+ * // creates the line "in vec2 a_texCoord0;" in the vertex shader
  * shaderBuilder.addAttribute("vec2", "a_texCoord0");
  */
 ShaderBuilder.prototype.addAttribute = function (type, identifier) {
@@ -352,7 +352,7 @@ ShaderBuilder.prototype.addAttribute = function (type, identifier) {
   Check.typeOf.string("identifier", identifier);
   //>>includeEnd('debug');
 
-  const line = `attribute ${type} ${identifier};`;
+  const line = `in ${type} ${identifier};`;
   this._attributeLines.push(line);
 
   const location = this._nextAttributeLocation;
@@ -371,7 +371,8 @@ ShaderBuilder.prototype.addAttribute = function (type, identifier) {
  * @param {String} identifier An identifier for the varying. Identifiers must begin with <code>v_</code> to be consistent with Cesium's style guide.
  *
  * @example
- * // creates the line "varying vec3 v_color;" in both shaders
+ * // creates the line "in vec3 v_color;" in the vertex shader
+ * // creates the line "out vec3 v_color;" in the fragment shader
  * shaderBuilder.addVarying("vec3", "v_color");
  */
 ShaderBuilder.prototype.addVarying = function (type, identifier) {
@@ -380,9 +381,9 @@ ShaderBuilder.prototype.addVarying = function (type, identifier) {
   Check.typeOf.string("identifier", identifier);
   //>>includeEnd('debug');
 
-  const line = `varying ${type} ${identifier};`;
-  this._vertexShaderParts.varyingLines.push(line);
-  this._fragmentShaderParts.varyingLines.push(line);
+  const line = `${type} ${identifier};`;
+  this._vertexShaderParts.varyingLines.push(`out ${line}`);
+  this._fragmentShaderParts.varyingLines.push(`in ${line}`);
 };
 
 /**
@@ -427,9 +428,9 @@ ShaderBuilder.prototype.addVertexLines = function (lines) {
  *  "void main()",
  *  "{",
  *  "    #ifdef SOLID_COLOR",
- *  "    gl_FragColor = vec4(u_color, 1.0);",
+ *  "    out_FragColor = vec4(u_color, 1.0);",
  *  "    #else",
- *  "    gl_FragColor = vec4(v_color, 1.0);",
+ *  "    out_FragColor = vec4(v_color, 1.0);",
  *  "    #endif",
  *  "}"
  * ]);

package/Source/Renderer/ShaderSource.js

@@ -1,9 +1,9 @@
 import defaultValue from "../Core/defaultValue.js";
 import defined from "../Core/defined.js";
 import DeveloperError from "../Core/DeveloperError.js";
-import modernizeShader from "../Renderer/modernizeShader.js";
 import CzmBuiltins from "../Shaders/Builtin/CzmBuiltins.js";
 import AutomaticUniforms from "./AutomaticUniforms.js";
+import demodernizeShader from "./demodernizeShader.js";
 
 function removeComments(source) {
   // remove inline comments
@@ -223,12 +223,6 @@ function combineShader(shaderSource, isFragmentShader, context) {
   // combine into single string
   let result = "";
 
-  // #version must be first
-  // defaults to #version 100 if not specified
-  if (defined(version)) {
-    result = `#version ${version}\n`;
-  }
-
   const extensionsLength = extensions.length;
   for (i = 0; i < extensionsLength; i++) {
     result += extensions[i];
@@ -261,12 +255,6 @@ function combineShader(shaderSource, isFragmentShader, context) {
     }
   }
 
-  // GLSLModernizer inserts its own layout qualifiers
-  // at this position in the source
-  if (context.webgl2) {
-    result += "#define OUTPUT_DECLARATION\n\n";
-  }
-
   // Define a constant for the OES_texture_float_linear extension since WebGL does not.
   if (context.textureFloatLinear) {
     result += "#define OES_texture_float_linear\n\n";
@@ -278,19 +266,36 @@ function combineShader(shaderSource, isFragmentShader, context) {
   }
 
   // append built-ins
+  let builtinSources = "";
   if (shaderSource.includeBuiltIns) {
-    result += getBuiltinsAndAutomaticUniforms(combinedSources);
+    builtinSources = getBuiltinsAndAutomaticUniforms(combinedSources);
   }
 
   // reset line number
   result += "\n#line 0\n";
 
   // append actual source
+  const combinedShader = builtinSources + combinedSources;
+  if (
+    context.webgl2 &&
+    isFragmentShader &&
+    !/layout\s*\(location\s*=\s*0\)\s*out\s+vec4\s+out_FragColor;/g.test(
+      combinedShader
+    ) &&
+    !/czm_out_FragColor/g.test(combinedShader) &&
+    /out_FragColor/g.test(combinedShader)
+  ) {
+    result += "layout(location = 0) out vec4 out_FragColor;\n\n";
+  }
+
+  result += builtinSources;
   result += combinedSources;
 
   // modernize the source
-  if (context.webgl2) {
-    result = modernizeShader(result, isFragmentShader, true);
+  if (!context.webgl2) {
+    result = demodernizeShader(result, isFragmentShader);
+  } else {
+    result = `#version 300 es\n${result}`;
   }
 
   return result;
@@ -302,21 +307,21 @@ function combineShader(shaderSource, isFragmentShader, context) {
  * @param {Object} [options] Object with the following properties:
  * @param {String[]} [options.sources] An array of strings to combine containing GLSL code for the shader.
  * @param {String[]} [options.defines] An array of strings containing GLSL identifiers to <code>#define</code>.
- * @param {String} [options.pickColorQualifier] The GLSL qualifier, <code>uniform</code> or <code>varying</code>, for the input <code>czm_pickColor</code>.  When defined, a pick fragment shader is generated.
+ * @param {String} [options.pickColorQualifier] The GLSL qualifier, <code>uniform</code> or <code>in</code>, for the input <code>czm_pickColor</code>.  When defined, a pick fragment shader is generated.
  * @param {Boolean} [options.includeBuiltIns=true] If true, referenced built-in functions will be included with the combined shader.  Set to false if this shader will become a source in another shader, to avoid duplicating functions.
  *
- * @exception {DeveloperError} options.pickColorQualifier must be 'uniform' or 'varying'.
+ * @exception {DeveloperError} options.pickColorQualifier must be 'uniform' or 'in'.
  *
  * @example
  * // 1. Prepend #defines to a shader
  * const source = new Cesium.ShaderSource({
  *   defines : ['WHITE'],
- *   sources : ['void main() { \n#ifdef WHITE\n gl_FragColor = vec4(1.0); \n#else\n gl_FragColor = vec4(0.0); \n#endif\n }']
+ *   sources : ['void main() { \n#ifdef WHITE\n out_FragColor = vec4(1.0); \n#else\n out_FragColor = vec4(0.0); \n#endif\n }']
  * });
  *
  * // 2. Modify a fragment shader for picking
  * const source2 = new Cesium.ShaderSource({
- *   sources : ['void main() { gl_FragColor = vec4(1.0); }'],
+ *   sources : ['void main() { out_FragColor = vec4(1.0); }'],
  *   pickColorQualifier : 'uniform'
  * });
  *
@@ -330,10 +335,10 @@ function ShaderSource(options) {
   if (
     defined(pickColorQualifier) &&
     pickColorQualifier !== "uniform" &&
-    pickColorQualifier !== "varying"
+    pickColorQualifier !== "in"
   ) {
     throw new DeveloperError(
-      "options.pickColorQualifier must be 'uniform' or 'varying'."
+      "options.pickColorQualifier must be 'uniform' or 'in'."
     );
   }
   //>>includeEnd('debug');
@@ -430,8 +435,8 @@ ShaderSource.createPickVertexShaderSource = function (vertexShaderSource) {
     "czm_old_main"
   );
   const pickMain =
-    "attribute vec4 pickColor; \n" +
-    "varying vec4 czm_pickColor; \n" +
+    "in vec4 pickColor; \n" +
+    "out vec4 czm_pickColor; \n" +
     "void main() \n" +
     "{ \n" +
     "    czm_old_main(); \n" +
@@ -454,10 +459,10 @@ ShaderSource.createPickFragmentShaderSource = function (
     `void main() \n` +
     `{ \n` +
     `    czm_old_main(); \n` +
-    `    if (gl_FragColor.a == 0.0) { \n` +
+    `    if (out_FragColor.a == 0.0) { \n` +
     `       discard; \n` +
     `    } \n` +
-    `    gl_FragColor = czm_pickColor; \n` +
+    `    out_FragColor = czm_pickColor; \n` +
     `}`;
 
   return `${renamedFS}\n${pickMain}`;

package/Source/Renderer/demodernizeShader.js

@@ -0,0 +1,76 @@
+/**
+ * Transpiles a [GLSL 3.00]{@link https://registry.khronos.org/OpenGL/specs/es/3.0/GLSL_ES_Specification_3.00.pdf}
+ * shader to a [GLSL 1.00]{@link https://registry.khronos.org/OpenGL/specs/es/2.0/GLSL_ES_Specification_1.00.pdf} shader.
+ *
+ * This function does not aim to provide a comprehensive transpilation from GLSL 3.00 to GLSL 1.00; only the functionality
+ * used within the CesiumJS shaders is supported.
+ *
+ * @private
+ *
+ * @param {string} input The GLSL 3.00 shader.
+ * @param {boolean} isFragmentShader True if the shader is a fragment shader.
+ *
+ * @return {string}
+ */
+function demodernizeShader(input, isFragmentShader) {
+  let output = input;
+
+  // Remove version string got GLSL 3.00.
+  output = output.replaceAll(`version 300 es`, ``);
+
+  // Replace all texture calls with texture2D
+  output = output.replaceAll(
+    /(texture\()/g,
+    `texture2D(` // Trailing ')' is included in the match group.
+  );
+
+  if (isFragmentShader) {
+    // Replace the in with varying.
+    output = output.replaceAll(/(in)\s+(vec\d|mat\d|float)/g, `varying $2`);
+
+    if (/out_FragData_(\d+)/.test(output)) {
+      output = `#extension GL_EXT_draw_buffers : enable\n${output}`;
+
+      // Remove all layout declarations for out_FragData.
+      output = output.replaceAll(
+        /layout\s+\(location\s*=\s*\d+\)\s*out\s+vec4\s+out_FragData_\d+;/g,
+        ``
+      );
+
+      // Replace out_FragData with gl_FragData.
+      output = output.replaceAll(/out_FragData_(\d+)/g, `gl_FragData[$1]`);
+    }
+
+    // Replace out_FragColor with gl_FragColor.
+    output = output.replaceAll(/out_FragColor/g, `gl_FragColor`);
+    output = output.replaceAll(/out_FragColor\[(\d+)\]/g, `gl_FragColor[$1]`);
+
+    // Remove all layout declarations for out_FragColor.
+    output = output.replaceAll(
+      /layout\s+\(location\s*=\s*0\)\s*out\s+vec4\s+out_FragColor/g,
+      ``
+    );
+
+    if (/gl_FragDepth/.test(output)) {
+      output = `#extension GL_EXT_frag_depth : enable\n${output}`;
+      // Replace gl_FragDepth with gl_FragDepthEXT.
+      output = output.replaceAll(/gl_FragDepth/g, `gl_FragDepthEXT`);
+    }
+  } else {
+    // Replace the in with attribute.
+    output = output.replaceAll(/(in)\s+(vec\d|mat\d|float)/g, `attribute $2`);
+
+    // Replace the out with varying.
+    output = output.replaceAll(
+      /(out)\s+(vec\d|mat\d|float)\s+([\w]+);/g,
+      `varying $2 $3;`
+    );
+  }
+
+  // Add version string for GLSL 1.00.
+  output = `#version 100\n${output}`;
+
+  return output;
+}
+
+export default demodernizeShader;

package/Source/Scene/AutoExposure.js

@@ -203,16 +203,16 @@ function createUniformMap(autoexposure, index) {
 function getShaderSource(index, length) {
   let source =
     "uniform sampler2D colorTexture; \n" +
-    "varying vec2 v_textureCoordinates; \n" +
+    "in vec2 v_textureCoordinates; \n" +
     "float sampleTexture(vec2 offset) { \n";
 
   if (index === 0) {
     source +=
-      "    vec4 color = texture2D(colorTexture, v_textureCoordinates + offset); \n" +
+      "    vec4 color = texture(colorTexture, v_textureCoordinates + offset); \n" +
       "    return czm_luminance(color.rgb); \n";
   } else {
     source +=
-      "    return texture2D(colorTexture, v_textureCoordinates + offset).r; \n";
+      "    return texture(colorTexture, v_textureCoordinates + offset).r; \n";
   }
 
   source += "}\n\n";
@@ -244,13 +244,13 @@ function getShaderSource(index, length) {
 
   if (index === length - 1) {
     source +=
-      "    float previous = texture2D(previousLuminance, vec2(0.5)).r; \n" +
+      "    float previous = texture(previousLuminance, vec2(0.5)).r; \n" +
       "    color = clamp(color, minMaxLuminance.x, minMaxLuminance.y); \n" +
       "    color = previous + (color - previous) / (60.0 * 1.5); \n" +
       "    color = clamp(color, minMaxLuminance.x, minMaxLuminance.y); \n";
   }
 
-  source += "    gl_FragColor = vec4(color); \n" + "} \n";
+  source += "    out_FragColor = vec4(color); \n" + "} \n";
   return source;
 }
 

package/Source/Scene/BatchTable.js

@@ -530,12 +530,12 @@ function getGlslAttributeFunction(batchTable, attributeIndex) {
   ) {
     glslFunction +=
       "vec4 textureValue; \n" +
-      "textureValue.x = czm_unpackFloat(texture2D(batchTexture, st)); \n" +
-      "textureValue.y = czm_unpackFloat(texture2D(batchTexture, st + vec2(batchTextureStep.x, 0.0))); \n" +
-      "textureValue.z = czm_unpackFloat(texture2D(batchTexture, st + vec2(batchTextureStep.x * 2.0, 0.0))); \n" +
-      "textureValue.w = czm_unpackFloat(texture2D(batchTexture, st + vec2(batchTextureStep.x * 3.0, 0.0))); \n";
+      "textureValue.x = czm_unpackFloat(texture(batchTexture, st)); \n" +
+      "textureValue.y = czm_unpackFloat(texture(batchTexture, st + vec2(batchTextureStep.x, 0.0))); \n" +
+      "textureValue.z = czm_unpackFloat(texture(batchTexture, st + vec2(batchTextureStep.x * 2.0, 0.0))); \n" +
+      "textureValue.w = czm_unpackFloat(texture(batchTexture, st + vec2(batchTextureStep.x * 3.0, 0.0))); \n";
   } else {
-    glslFunction += "    vec4 textureValue = texture2D(batchTexture, st); \n";
+    glslFunction += "    vec4 textureValue = texture(batchTexture, st); \n";
   }
 
   glslFunction += `    ${functionReturnType} value = textureValue${functionReturnValue}; \n`;

package/Source/Scene/BillboardCollection.js

@@ -1789,10 +1789,10 @@ function updateBoundingVolume(collection, frameState, boundingVolume) {
 function createDebugCommand(billboardCollection, context) {
   const fs =
     "uniform sampler2D billboard_texture; \n" +
-    "varying vec2 v_textureCoordinates; \n" +
+    "in vec2 v_textureCoordinates; \n" +
     "void main() \n" +
     "{ \n" +
-    "    gl_FragColor = texture2D(billboard_texture, v_textureCoordinates); \n" +
+    "    out_FragColor = texture(billboard_texture, v_textureCoordinates); \n" +
     "} \n";
 
   const drawCommand = context.createViewportQuadCommand(fs, {

package/Source/Scene/BingMapsImageryProvider.js

@@ -177,7 +177,7 @@ function BingMapsImageryProvider(options) {
 
   this._proxy = options.proxy;
   this._credit = new Credit(
-    `<a href="http://www.bing.com"><img src="${BingMapsImageryProvider.logoUrl}" title="Bing Imagery"/></a>`
+    `<a href="https://www.microsoft.com/en-us/maps/product/enduserterms"><img src="${BingMapsImageryProvider.logoUrl}" title="Bing Imagery"/></a>`
   );
 
   this._tilingScheme = new WebMercatorTilingScheme({

package/Source/Scene/Cesium3DTile.js

@@ -146,7 +146,7 @@ function Cesium3DTile(tileset, baseResource, header, parent) {
 
   if (!defined(this._geometricError)) {
     this._geometricError = defined(parent)
-      ? parent.geometricError
+      ? parent._geometricError
       : tileset._geometricError;
     Cesium3DTile._deprecationWarning(
       "geometricErrorUndefined",
@@ -874,7 +874,7 @@ Cesium3DTile.prototype.getScreenSpaceError = function (
   const heightFraction = defaultValue(progressiveResolutionHeightFraction, 1.0);
   const parentGeometricError = defined(this.parent)
     ? this.parent.geometricError
-    : tileset._geometricError;
+    : tileset._scaledGeometricError;
   const geometricError = useParentGeometricError
     ? parentGeometricError
     : this.geometricError;
@@ -1791,6 +1791,12 @@ Cesium3DTile.prototype.updateGeometricErrorScale = function () {
   const scale = Matrix4.getScale(this.computedTransform, scratchScale);
   const uniformScale = Cartesian3.maximumComponent(scale);
   this.geometricError = this._geometricError * uniformScale;
+
+  if (!defined(this.parent)) {
+    // Update the tileset's geometric error
+    const tileset = this._tileset;
+    tileset._scaledGeometricError = tileset._geometricError * uniformScale;
+  }
 };
 
 function applyDebugSettings(tile, tileset, frameState, passOptions) {