SkyBox.js 8.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232
  1. /*global define*/
  2. define([
  3. '../Core/BoxGeometry',
  4. '../Core/Cartesian3',
  5. '../Core/defaultValue',
  6. '../Core/defined',
  7. '../Core/destroyObject',
  8. '../Core/DeveloperError',
  9. '../Core/GeometryPipeline',
  10. '../Core/Matrix4',
  11. '../Core/VertexFormat',
  12. '../Renderer/BufferUsage',
  13. '../Renderer/DrawCommand',
  14. '../Renderer/loadCubeMap',
  15. '../Shaders/SkyBoxFS',
  16. '../Shaders/SkyBoxVS',
  17. './BlendingState',
  18. './SceneMode'
  19. ], function(
  20. BoxGeometry,
  21. Cartesian3,
  22. defaultValue,
  23. defined,
  24. destroyObject,
  25. DeveloperError,
  26. GeometryPipeline,
  27. Matrix4,
  28. VertexFormat,
  29. BufferUsage,
  30. DrawCommand,
  31. loadCubeMap,
  32. SkyBoxFS,
  33. SkyBoxVS,
  34. BlendingState,
  35. SceneMode) {
  36. "use strict";
  37. /**
  38. * A sky box around the scene to draw stars. The sky box is defined using the True Equator Mean Equinox (TEME) axes.
  39. * <p>
  40. * This is only supported in 3D. The sky box is faded out when morphing to 2D or Columbus view.
  41. * </p>
  42. *
  43. * @alias SkyBox
  44. * @constructor
  45. *
  46. * @param {Object} options Object with the following properties:
  47. * @param {Object} [options.sources] The source URL or <code>Image</code> object for each of the six cube map faces. See the example below.
  48. * @param {Boolean} [options.show=true] Determines if this primitive will be shown.
  49. *
  50. * @see Scene#skyBox
  51. * @see Transforms.computeTemeToPseudoFixedMatrix
  52. *
  53. * @example
  54. * scene.skyBox = new Cesium.SkyBox({
  55. * sources : {
  56. * positiveX : 'skybox_px.png',
  57. * negativeX : 'skybox_nx.png',
  58. * positiveY : 'skybox_py.png',
  59. * negativeY : 'skybox_ny.png',
  60. * positiveZ : 'skybox_pz.png',
  61. * negativeZ : 'skybox_nz.png'
  62. * }
  63. * });
  64. */
  65. var SkyBox = function(options) {
  66. /**
  67. * The sources used to create the cube map faces: an object
  68. * with <code>positiveX</code>, <code>negativeX</code>, <code>positiveY</code>,
  69. * <code>negativeY</code>, <code>positiveZ</code>, and <code>negativeZ</code> properties.
  70. * These can be either URLs or <code>Image</code> objects.
  71. *
  72. * @type Object
  73. * @default undefined
  74. */
  75. this.sources = options.sources;
  76. this._sources = undefined;
  77. /**
  78. * Determines if the sky box will be shown.
  79. *
  80. * @type {Boolean}
  81. * @default true
  82. */
  83. this.show = defaultValue(options.show, true);
  84. this._command = new DrawCommand({
  85. modelMatrix : Matrix4.clone(Matrix4.IDENTITY),
  86. owner : this
  87. });
  88. this._cubeMap = undefined;
  89. };
  90. /**
  91. * Called when {@link Viewer} or {@link CesiumWidget} render the scene to
  92. * get the draw commands needed to render this primitive.
  93. * <p>
  94. * Do not call this function directly. This is documented just to
  95. * list the exceptions that may be propagated when the scene is rendered:
  96. * </p>
  97. *
  98. * @exception {DeveloperError} this.sources is required and must have positiveX, negativeX, positiveY, negativeY, positiveZ, and negativeZ properties.
  99. * @exception {DeveloperError} this.sources properties must all be the same type.
  100. */
  101. SkyBox.prototype.update = function(context, frameState) {
  102. if (!this.show) {
  103. return undefined;
  104. }
  105. if ((frameState.mode !== SceneMode.SCENE3D) &&
  106. (frameState.mode !== SceneMode.MORPHING)) {
  107. return undefined;
  108. }
  109. // The sky box is only rendered during the render pass; it is not pickable, it doesn't cast shadows, etc.
  110. if (!frameState.passes.render) {
  111. return undefined;
  112. }
  113. if (this._sources !== this.sources) {
  114. this._sources = this.sources;
  115. var sources = this.sources;
  116. //>>includeStart('debug', pragmas.debug);
  117. if ((!defined(sources.positiveX)) ||
  118. (!defined(sources.negativeX)) ||
  119. (!defined(sources.positiveY)) ||
  120. (!defined(sources.negativeY)) ||
  121. (!defined(sources.positiveZ)) ||
  122. (!defined(sources.negativeZ))) {
  123. throw new DeveloperError('this.sources is required and must have positiveX, negativeX, positiveY, negativeY, positiveZ, and negativeZ properties.');
  124. }
  125. if ((typeof sources.positiveX !== typeof sources.negativeX) ||
  126. (typeof sources.positiveX !== typeof sources.positiveY) ||
  127. (typeof sources.positiveX !== typeof sources.negativeY) ||
  128. (typeof sources.positiveX !== typeof sources.positiveZ) ||
  129. (typeof sources.positiveX !== typeof sources.negativeZ)) {
  130. throw new DeveloperError('this.sources properties must all be the same type.');
  131. }
  132. //>>includeEnd('debug');
  133. if (typeof sources.positiveX === 'string') {
  134. // Given urls for cube-map images. Load them.
  135. loadCubeMap(context, this._sources).then(function(cubeMap) {
  136. that._cubeMap = that._cubeMap && that._cubeMap.destroy();
  137. that._cubeMap = cubeMap;
  138. });
  139. } else {
  140. this._cubeMap = this._cubeMap && this._cubeMap.destroy();
  141. this._cubeMap = context.createCubeMap({
  142. source : sources
  143. });
  144. }
  145. }
  146. var command = this._command;
  147. if (!defined(command.vertexArray)) {
  148. var that = this;
  149. command.uniformMap = {
  150. u_cubeMap: function() {
  151. return that._cubeMap;
  152. }
  153. };
  154. var geometry = BoxGeometry.createGeometry(BoxGeometry.fromDimensions({
  155. dimensions : new Cartesian3(2.0, 2.0, 2.0),
  156. vertexFormat : VertexFormat.POSITION_ONLY
  157. }));
  158. var attributeLocations = GeometryPipeline.createAttributeLocations(geometry);
  159. command.vertexArray = context.createVertexArrayFromGeometry({
  160. geometry: geometry,
  161. attributeLocations: attributeLocations,
  162. bufferUsage: BufferUsage.STATIC_DRAW
  163. });
  164. command.shaderProgram = context.createShaderProgram(SkyBoxVS, SkyBoxFS, attributeLocations);
  165. command.renderState = context.createRenderState({
  166. blending : BlendingState.ALPHA_BLEND
  167. });
  168. }
  169. if (!defined(this._cubeMap)) {
  170. return undefined;
  171. }
  172. return command;
  173. };
  174. /**
  175. * Returns true if this object was destroyed; otherwise, false.
  176. * <br /><br />
  177. * If this object was destroyed, it should not be used; calling any function other than
  178. * <code>isDestroyed</code> will result in a {@link DeveloperError} exception.
  179. *
  180. * @returns {Boolean} <code>true</code> if this object was destroyed; otherwise, <code>false</code>.
  181. *
  182. * @see SkyBox#destroy
  183. */
  184. SkyBox.prototype.isDestroyed = function() {
  185. return false;
  186. };
  187. /**
  188. * Destroys the WebGL resources held by this object. Destroying an object allows for deterministic
  189. * release of WebGL resources, instead of relying on the garbage collector to destroy this object.
  190. * <br /><br />
  191. * Once an object is destroyed, it should not be used; calling any function other than
  192. * <code>isDestroyed</code> will result in a {@link DeveloperError} exception. Therefore,
  193. * assign the return value (<code>undefined</code>) to the object as done in the example.
  194. *
  195. * @returns {undefined}
  196. *
  197. * @exception {DeveloperError} This object was destroyed, i.e., destroy() was called.
  198. *
  199. * @see SkyBox#isDestroyed
  200. *
  201. * @example
  202. * skyBox = skyBox && skyBox.destroy();
  203. */
  204. SkyBox.prototype.destroy = function() {
  205. var command = this._command;
  206. command.vertexArray = command.vertexArray && command.vertexArray.destroy();
  207. command.shaderProgram = command.shaderProgram && command.shaderProgram.destroy();
  208. this._cubeMap = this._cubeMap && this._cubeMap.destroy();
  209. return destroyObject(this);
  210. };
  211. return SkyBox;
  212. });