reflectionTextureBlock.ts 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440
  1. import { NodeMaterialBlock } from '../../nodeMaterialBlock';
  2. import { NodeMaterialBlockConnectionPointTypes } from '../../Enums/nodeMaterialBlockConnectionPointTypes';
  3. import { NodeMaterialBuildState } from '../../nodeMaterialBuildState';
  4. import { NodeMaterialBlockTargets } from '../../Enums/nodeMaterialBlockTargets';
  5. import { NodeMaterialConnectionPoint } from '../../nodeMaterialBlockConnectionPoint';
  6. import { BaseTexture } from '../../../Textures/baseTexture';
  7. import { AbstractMesh } from '../../../../Meshes/abstractMesh';
  8. import { NodeMaterial, NodeMaterialDefines } from '../../nodeMaterial';
  9. import { Effect } from '../../../effect';
  10. import { Mesh } from '../../../../Meshes/mesh';
  11. import { Nullable } from '../../../../types';
  12. import { _TypeStore } from '../../../../Misc/typeStore';
  13. import { Scene } from '../../../../scene';
  14. import { InputBlock } from '../Input/inputBlock';
  15. import { NodeMaterialSystemValues } from '../../Enums/nodeMaterialSystemValues';
  16. import { Constants } from '../../../../Engines/constants';
  17. import "../../../../Shaders/ShadersInclude/reflectionFunction";
  18. import { CubeTexture } from '../../../Textures/cubeTexture';
  19. import { Texture } from '../../../Textures/texture';
  20. /**
  21. * Block used to read a reflection texture from a sampler
  22. */
  23. export class ReflectionTextureBlock extends NodeMaterialBlock {
  24. private _define3DName: string;
  25. private _defineCubicName: string;
  26. private _defineExplicitName: string;
  27. private _defineProjectionName: string;
  28. private _defineLocalCubicName: string;
  29. private _defineSphericalName: string;
  30. private _definePlanarName: string;
  31. private _defineEquirectangularName: string;
  32. private _defineMirroredEquirectangularFixedName: string;
  33. private _defineEquirectangularFixedName: string;
  34. private _defineSkyboxName: string;
  35. private _cubeSamplerName: string;
  36. private _2DSamplerName: string;
  37. private _positionUVWName: string;
  38. private _directionWName: string;
  39. private _reflectionCoordsName: string;
  40. private _reflection2DCoordsName: string;
  41. private _reflectionColorName: string;
  42. private _reflectionMatrixName: string;
  43. /**
  44. * Gets or sets the texture associated with the node
  45. */
  46. public texture: Nullable<BaseTexture>;
  47. /**
  48. * Create a new TextureBlock
  49. * @param name defines the block name
  50. */
  51. public constructor(name: string) {
  52. super(name, NodeMaterialBlockTargets.VertexAndFragment);
  53. this.registerInput("position", NodeMaterialBlockConnectionPointTypes.Vector3, false, NodeMaterialBlockTargets.Vertex);
  54. this.registerInput("worldPosition", NodeMaterialBlockConnectionPointTypes.Vector4, false, NodeMaterialBlockTargets.Vertex);
  55. this.registerInput("worldNormal", NodeMaterialBlockConnectionPointTypes.Vector4, false, NodeMaterialBlockTargets.Fragment); // Flagging as fragment as the normal can be changed by fragment code
  56. this.registerInput("world", NodeMaterialBlockConnectionPointTypes.Matrix, false, NodeMaterialBlockTargets.Vertex);
  57. this.registerInput("cameraPosition", NodeMaterialBlockConnectionPointTypes.Vector3, false, NodeMaterialBlockTargets.Fragment);
  58. this.registerInput("view", NodeMaterialBlockConnectionPointTypes.Matrix, false, NodeMaterialBlockTargets.Fragment);
  59. this.registerOutput("rgb", NodeMaterialBlockConnectionPointTypes.Color3, NodeMaterialBlockTargets.Fragment);
  60. this.registerOutput("r", NodeMaterialBlockConnectionPointTypes.Float, NodeMaterialBlockTargets.Fragment);
  61. this.registerOutput("g", NodeMaterialBlockConnectionPointTypes.Float, NodeMaterialBlockTargets.Fragment);
  62. this.registerOutput("b", NodeMaterialBlockConnectionPointTypes.Float, NodeMaterialBlockTargets.Fragment);
  63. this._inputs[0].acceptedConnectionPointTypes.push(NodeMaterialBlockConnectionPointTypes.Vector4);
  64. }
  65. /**
  66. * Gets the current class name
  67. * @returns the class name
  68. */
  69. public getClassName() {
  70. return "ReflectionTextureBlock";
  71. }
  72. /**
  73. * Gets the world position input component
  74. */
  75. public get position(): NodeMaterialConnectionPoint {
  76. return this._inputs[0];
  77. }
  78. /**
  79. * Gets the world position input component
  80. */
  81. public get worldPosition(): NodeMaterialConnectionPoint {
  82. return this._inputs[1];
  83. }
  84. /**
  85. * Gets the world normal input component
  86. */
  87. public get worldNormal(): NodeMaterialConnectionPoint {
  88. return this._inputs[2];
  89. }
  90. /**
  91. * Gets the world input component
  92. */
  93. public get world(): NodeMaterialConnectionPoint {
  94. return this._inputs[3];
  95. }
  96. /**
  97. * Gets the camera (or eye) position component
  98. */
  99. public get cameraPosition(): NodeMaterialConnectionPoint {
  100. return this._inputs[4];
  101. }
  102. /**
  103. * Gets the view input component
  104. */
  105. public get view(): NodeMaterialConnectionPoint {
  106. return this._inputs[5];
  107. }
  108. /**
  109. * Gets the rgb output component
  110. */
  111. public get rgb(): NodeMaterialConnectionPoint {
  112. return this._outputs[0];
  113. }
  114. /**
  115. * Gets the r output component
  116. */
  117. public get r(): NodeMaterialConnectionPoint {
  118. return this._outputs[1];
  119. }
  120. /**
  121. * Gets the g output component
  122. */
  123. public get g(): NodeMaterialConnectionPoint {
  124. return this._outputs[2];
  125. }
  126. /**
  127. * Gets the b output component
  128. */
  129. public get b(): NodeMaterialConnectionPoint {
  130. return this._outputs[3];
  131. }
  132. public autoConfigure(material: NodeMaterial) {
  133. if (!this.position.isConnected) {
  134. let positionInput = material.getInputBlockByPredicate((b) => b.isAttribute && b.name === "position");
  135. if (!positionInput) {
  136. positionInput = new InputBlock("position");
  137. positionInput.setAsAttribute();
  138. }
  139. positionInput.output.connectTo(this.position);
  140. }
  141. if (!this.world.isConnected) {
  142. let worldInput = material.getInputBlockByPredicate((b) => b.systemValue === NodeMaterialSystemValues.World);
  143. if (!worldInput) {
  144. worldInput = new InputBlock("world");
  145. worldInput.setAsSystemValue(NodeMaterialSystemValues.World);
  146. }
  147. worldInput.output.connectTo(this.world);
  148. }
  149. if (!this.cameraPosition.isConnected) {
  150. let cameraPositionInput = material.getInputBlockByPredicate((b) => b.systemValue === NodeMaterialSystemValues.CameraPosition);
  151. if (!cameraPositionInput) {
  152. cameraPositionInput = new InputBlock("cameraPosition");
  153. cameraPositionInput.setAsSystemValue(NodeMaterialSystemValues.CameraPosition);
  154. }
  155. cameraPositionInput.output.connectTo(this.cameraPosition);
  156. }
  157. if (!this.view.isConnected) {
  158. let viewInput = material.getInputBlockByPredicate((b) => b.systemValue === NodeMaterialSystemValues.View);
  159. if (!viewInput) {
  160. viewInput = new InputBlock("view");
  161. viewInput.setAsSystemValue(NodeMaterialSystemValues.View);
  162. }
  163. viewInput.output.connectTo(this.view);
  164. }
  165. }
  166. public prepareDefines(mesh: AbstractMesh, nodeMaterial: NodeMaterial, defines: NodeMaterialDefines) {
  167. if (!defines._areTexturesDirty) {
  168. return;
  169. }
  170. if (!this.texture || !this.texture.getTextureMatrix) {
  171. return;
  172. }
  173. defines.setValue(this._define3DName, this.texture.isCube);
  174. defines.setValue(this._defineLocalCubicName, (<any>this.texture).boundingBoxSize ? true : false);
  175. defines.setValue(this._defineExplicitName, this.texture.coordinatesMode === Constants.TEXTURE_EXPLICIT_MODE);
  176. defines.setValue(this._defineSkyboxName, this.texture.coordinatesMode === Constants.TEXTURE_SKYBOX_MODE);
  177. defines.setValue(this._defineCubicName, this.texture.coordinatesMode === Constants.TEXTURE_CUBIC_MODE);
  178. defines.setValue(this._defineSphericalName, this.texture.coordinatesMode === Constants.TEXTURE_SPHERICAL_MODE);
  179. defines.setValue(this._definePlanarName, this.texture.coordinatesMode === Constants.TEXTURE_PLANAR_MODE);
  180. defines.setValue(this._defineProjectionName, this.texture.coordinatesMode === Constants.TEXTURE_PROJECTION_MODE);
  181. defines.setValue(this._defineEquirectangularName, this.texture.coordinatesMode === Constants.TEXTURE_EQUIRECTANGULAR_MODE);
  182. defines.setValue(this._defineEquirectangularFixedName, this.texture.coordinatesMode === Constants.TEXTURE_FIXED_EQUIRECTANGULAR_MODE);
  183. defines.setValue(this._defineMirroredEquirectangularFixedName, this.texture.coordinatesMode === Constants.TEXTURE_FIXED_EQUIRECTANGULAR_MIRRORED_MODE);
  184. }
  185. public isReady() {
  186. if (this.texture && !this.texture.isReadyOrNotBlocking()) {
  187. return false;
  188. }
  189. return true;
  190. }
  191. public bind(effect: Effect, nodeMaterial: NodeMaterial, mesh?: Mesh) {
  192. if (!mesh || !this.texture) {
  193. return;
  194. }
  195. effect.setMatrix(this._reflectionMatrixName, this.texture.getReflectionTextureMatrix());
  196. if (this.texture.isCube) {
  197. effect.setTexture(this._cubeSamplerName, this.texture);
  198. } else {
  199. effect.setTexture(this._2DSamplerName, this.texture);
  200. }
  201. }
  202. private _injectVertexCode(state: NodeMaterialBuildState) {
  203. let worldPosVaryingName = "v_" + this.worldPosition.associatedVariableName;
  204. if (state._emitVaryingFromString(worldPosVaryingName, "vec4")) {
  205. state.compilationString += `${worldPosVaryingName} = ${this.worldPosition.associatedVariableName};\r\n`;
  206. }
  207. this._positionUVWName = state._getFreeVariableName("positionUVW");
  208. this._directionWName = state._getFreeVariableName("directionW");
  209. if (state._emitVaryingFromString(this._positionUVWName, "vec3", this._defineSkyboxName)) {
  210. state.compilationString += `#ifdef ${this._defineSkyboxName}\r\n`;
  211. state.compilationString += `${this._positionUVWName} = ${this.position.associatedVariableName}.xyz;\r\n`;
  212. state.compilationString += `#endif\r\n`;
  213. }
  214. if (state._emitVaryingFromString(this._directionWName, "vec3", `defined(${this._defineEquirectangularFixedName}) || defined(${this._defineMirroredEquirectangularFixedName})`)) {
  215. state.compilationString += `#if defined(${this._defineEquirectangularFixedName}) || defined(${this._defineMirroredEquirectangularFixedName})\r\n`;
  216. state.compilationString += `${this._directionWName} = normalize(vec3(${this.world.associatedVariableName} * vec4(${this.position.associatedVariableName}.xyz, 0.0)));\r\n`;
  217. state.compilationString += `#endif\r\n`;
  218. }
  219. }
  220. private _writeOutput(state: NodeMaterialBuildState, output: NodeMaterialConnectionPoint, swizzle: string) {
  221. state.compilationString += `${this._declareOutput(output, state)} = ${this._reflectionColorName}.${swizzle};\r\n`;
  222. }
  223. protected _buildBlock(state: NodeMaterialBuildState) {
  224. super._buildBlock(state);
  225. if (!this.texture) {
  226. if (state.target === NodeMaterialBlockTargets.Fragment) {
  227. for (var output of this._outputs) {
  228. if (output.hasEndpoints) {
  229. state.compilationString += `${this._declareOutput(output, state)} = vec3(0.).${output.name};\r\n`;
  230. }
  231. }
  232. }
  233. return;
  234. }
  235. if (state.target !== NodeMaterialBlockTargets.Fragment) {
  236. this._define3DName = state._getFreeDefineName("REFLECTIONMAP_3D");
  237. this._defineCubicName = state._getFreeDefineName("REFLECTIONMAP_CUBIC");
  238. this._defineSphericalName = state._getFreeDefineName("REFLECTIONMAP_SPHERICAL");
  239. this._definePlanarName = state._getFreeDefineName("REFLECTIONMAP_PLANAR");
  240. this._defineProjectionName = state._getFreeDefineName("REFLECTIONMAP_PROJECTION");
  241. this._defineExplicitName = state._getFreeDefineName("REFLECTIONMAP_EXPLICIT");
  242. this._defineEquirectangularName = state._getFreeDefineName("REFLECTIONMAP_EQUIRECTANGULAR");
  243. this._defineLocalCubicName = state._getFreeDefineName("USE_LOCAL_REFLECTIONMAP_CUBIC");
  244. this._defineMirroredEquirectangularFixedName = state._getFreeDefineName("REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED");
  245. this._defineEquirectangularFixedName = state._getFreeDefineName("REFLECTIONMAP_EQUIRECTANGULAR_FIXED");
  246. this._defineSkyboxName = state._getFreeDefineName("REFLECTIONMAP_SKYBOX");
  247. // Vertex
  248. this._injectVertexCode(state);
  249. return;
  250. }
  251. state.sharedData.blockingBlocks.push(this);
  252. state.sharedData.textureBlocks.push(this);
  253. // Samplers
  254. this._cubeSamplerName = state._getFreeVariableName(this.name + "CubeSampler");
  255. state.samplers.push(this._cubeSamplerName);
  256. this._2DSamplerName = state._getFreeVariableName(this.name + "2DSampler");
  257. state.samplers.push(this._2DSamplerName);
  258. state._samplerDeclaration += `#ifdef ${this._define3DName}\r\n`;
  259. state._samplerDeclaration += `uniform samplerCube ${this._cubeSamplerName};\r\n`;
  260. state._samplerDeclaration += `#else\r\n`;
  261. state._samplerDeclaration += `uniform sampler2D ${this._2DSamplerName};\r\n`;
  262. state._samplerDeclaration += `#endif\r\n`;
  263. // Fragment
  264. state.sharedData.blocksWithDefines.push(this);
  265. state.sharedData.bindableBlocks.push(this);
  266. let comments = `//${this.name}`;
  267. state._emitFunction("ReciprocalPI", "#define RECIPROCAL_PI2 0.15915494", "");
  268. state._emitFunctionFromInclude("reflectionFunction", comments);
  269. this._reflectionColorName = state._getFreeVariableName("reflectionColor");
  270. this._reflectionCoordsName = state._getFreeVariableName("reflectionUVW");
  271. this._reflection2DCoordsName = state._getFreeVariableName("reflectionUV");
  272. this._reflectionMatrixName = state._getFreeVariableName("reflectionMatrix");
  273. state._emitUniformFromString(this._reflectionMatrixName, "mat4");
  274. // Code
  275. let worldPos = `v_${this.worldPosition.associatedVariableName}`;
  276. let worldNormal = this.worldNormal.associatedVariableName + ".xyz";
  277. let reflectionMatrix = this._reflectionMatrixName;
  278. let direction = `normalize(${this._directionWName})`;
  279. let positionUVW = `${this._positionUVWName}`;
  280. let vEyePosition = `${this.cameraPosition.associatedVariableName}`;
  281. let view = `${this.view.associatedVariableName}`;
  282. state.compilationString += `vec3 ${this._reflectionColorName};\r\n`;
  283. state.compilationString += `#ifdef ${this._defineMirroredEquirectangularFixedName}\r\n`;
  284. state.compilationString += ` vec3 ${this._reflectionCoordsName} = computeMirroredFixedEquirectangularCoords(${worldPos}, ${worldNormal}, ${direction});\r\n`;
  285. state.compilationString += `#endif\r\n`;
  286. state.compilationString += `#ifdef ${this._defineEquirectangularFixedName}\r\n`;
  287. state.compilationString += ` vec3 ${this._reflectionCoordsName} = computeFixedEquirectangularCoords(${worldPos}, ${worldNormal}, ${direction});\r\n`;
  288. state.compilationString += `#endif\r\n`;
  289. state.compilationString += `#ifdef ${this._defineEquirectangularName}\r\n`;
  290. state.compilationString += ` vec3 ${this._reflectionCoordsName} = computeEquirectangularCoords(${worldPos}, ${worldNormal}, ${vEyePosition}.xyz, ${reflectionMatrix});\r\n`;
  291. state.compilationString += ` #endif\r\n`;
  292. state.compilationString += `#ifdef ${this._defineSphericalName}\r\n`;
  293. state.compilationString += ` vec3 ${this._reflectionCoordsName} = computeSphericalCoords(${worldPos}, ${worldNormal}, ${view}, ${reflectionMatrix});\r\n`;
  294. state.compilationString += `#endif\r\n`;
  295. state.compilationString += `#ifdef ${this._definePlanarName}\r\n`;
  296. state.compilationString += ` vec3 ${this._reflectionCoordsName} = computePlanarCoords(${worldPos}, ${worldNormal}, ${vEyePosition}.xyz, ${reflectionMatrix});\r\n`;
  297. state.compilationString += `#endif\r\n`;
  298. state.compilationString += `#ifdef ${this._defineCubicName}\r\n`;
  299. state.compilationString += ` #ifdef ${this._defineLocalCubicName}\r\n`;
  300. state.compilationString += ` vec3 ${this._reflectionCoordsName} = computeCubicLocalCoords(${worldPos}, ${worldNormal}, ${vEyePosition}.xyz, ${reflectionMatrix}, vReflectionSize, vReflectionPosition);\r\n`;
  301. state.compilationString += ` #else\r\n`;
  302. state.compilationString += ` vec3 ${this._reflectionCoordsName} = computeCubicCoords(${worldPos}, ${worldNormal}, ${vEyePosition}.xyz, ${reflectionMatrix});\r\n`;
  303. state.compilationString += ` #endif\r\n`;
  304. state.compilationString += `#endif\r\n`;
  305. state.compilationString += `#ifdef ${this._defineProjectionName}\r\n`;
  306. state.compilationString += ` vec3 ${this._reflectionCoordsName} = computeProjectionCoords(${worldPos}, ${view}, ${reflectionMatrix});\r\n`;
  307. state.compilationString += `#endif\r\n`;
  308. state.compilationString += `#ifdef ${this._defineSkyboxName}\r\n`;
  309. state.compilationString += ` vec3 ${this._reflectionCoordsName} = computeSkyBoxCoords(${positionUVW}, ${reflectionMatrix});\r\n`;
  310. state.compilationString += `#endif\r\n`;
  311. state.compilationString += `#ifdef ${this._defineExplicitName}\r\n`;
  312. state.compilationString += ` vec3 ${this._reflectionCoordsName} = vec3(0, 0, 0);\r\n`;
  313. state.compilationString += `#endif\r\n`;
  314. state.compilationString += `#ifdef ${this._define3DName}\r\n`;
  315. state.compilationString += `${this._reflectionColorName} = textureCube(${this._cubeSamplerName}, ${this._reflectionCoordsName}).rgb;\r\n`;
  316. state.compilationString += `#else\r\n`;
  317. state.compilationString += `vec2 ${this._reflection2DCoordsName} = ${this._reflectionCoordsName}.xy;\r\n`;
  318. state.compilationString += `#ifdef ${this._defineProjectionName}\r\n`;
  319. state.compilationString += `${this._reflection2DCoordsName} /= ${this._reflectionCoordsName}.z;\r\n`;
  320. state.compilationString += `#endif\r\n`;
  321. state.compilationString += `${this._reflection2DCoordsName}.y = 1.0 - ${this._reflection2DCoordsName}.y;\r\n`;
  322. state.compilationString += `${this._reflectionColorName} = texture2D(${this._2DSamplerName}, ${this._reflection2DCoordsName}).rgb;\r\n`;
  323. state.compilationString += `#endif\r\n`;
  324. for (var output of this._outputs) {
  325. if (output.hasEndpoints) {
  326. this._writeOutput(state, output, output.name);
  327. }
  328. }
  329. return this;
  330. }
  331. protected _dumpPropertiesCode() {
  332. if (!this.texture) {
  333. return "";
  334. }
  335. let codeString: string;
  336. if (this.texture.isCube) {
  337. codeString = `${this._codeVariableName}.texture = new BABYLON.CubeTexture("${this.texture.name}");\r\n`;
  338. } else {
  339. codeString = `${this._codeVariableName}.texture = new BABYLON.Texture("${this.texture.name}");\r\n`;
  340. }
  341. codeString += `${this._codeVariableName}.texture.coordinatesMode = ${this.texture.coordinatesMode};\r\n`;
  342. return codeString;
  343. }
  344. public serialize(): any {
  345. let serializationObject = super.serialize();
  346. if (this.texture) {
  347. serializationObject.texture = this.texture.serialize();
  348. }
  349. return serializationObject;
  350. }
  351. public _deserialize(serializationObject: any, scene: Scene, rootUrl: string) {
  352. super._deserialize(serializationObject, scene, rootUrl);
  353. if (serializationObject.texture) {
  354. rootUrl = serializationObject.texture.url.indexOf("data:") === 0 ? "" : rootUrl;
  355. if (serializationObject.texture.isCube) {
  356. this.texture = CubeTexture.Parse(serializationObject.texture, scene, rootUrl);
  357. } else {
  358. this.texture = Texture.Parse(serializationObject.texture, scene, rootUrl);
  359. }
  360. }
  361. }
  362. }
  363. _TypeStore.RegisteredTypes["BABYLON.ReflectionTextureBlock"] = ReflectionTextureBlock;