babylon.effect.ts 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366
  1. module BABYLON {
  2. export class Effect {
  3. public name: any;
  4. public defines: string;
  5. public onCompiled: (effect: Effect) => void;
  6. public onError: (effect: Effect, errors: string) => void;
  7. private _engine: Engine;
  8. private _uniformsNames: string[];
  9. private _samplers: string[];
  10. private _isReady = false;
  11. private _compilationError = "";
  12. private _attributesNames: string[];
  13. private _attributes: number[];
  14. private _uniforms: WebGLUniformLocation[];
  15. public _key: string;
  16. private _program: WebGLProgram;
  17. private _valueCache = [];
  18. constructor(baseName: any, attributesNames: string[], uniformsNames: string[], samplers: string[], engine, defines?: string, optionalDefines?: string[], onCompiled?: (effect: Effect) => void, onError?: (effect: Effect, errors: string) => void) {
  19. this._engine = engine;
  20. this.name = baseName;
  21. this.defines = defines;
  22. this._uniformsNames = uniformsNames.concat(samplers);
  23. this._samplers = samplers;
  24. this._attributesNames = attributesNames;
  25. this.onError = onError;
  26. this.onCompiled = onCompiled;
  27. var vertexSource;
  28. var fragmentSource;
  29. if (baseName.vertexElement) {
  30. vertexSource = document.getElementById(baseName.vertexElement);
  31. } else {
  32. vertexSource = baseName.vertex || baseName;
  33. }
  34. if (baseName.fragmentElement) {
  35. fragmentSource = document.getElementById(baseName.fragmentElement);
  36. } else {
  37. fragmentSource = baseName.fragment || baseName;
  38. }
  39. this._loadVertexShader(vertexSource, vertexCode => {
  40. this._loadFragmentShader(fragmentSource, (fragmentCode) => {
  41. this._prepareEffect(vertexCode, fragmentCode, attributesNames, defines, optionalDefines);
  42. });
  43. });
  44. }
  45. // Properties
  46. public isReady(): boolean {
  47. return this._isReady;
  48. }
  49. public getProgram(): WebGLProgram {
  50. return this._program;
  51. }
  52. public getAttributesNames(): string[] {
  53. return this._attributesNames;
  54. }
  55. public getAttributeLocation(index: number): number {
  56. return this._attributes[index];
  57. }
  58. public getAttributeLocationByName(name: string): number {
  59. var index = this._attributesNames.indexOf(name);
  60. return this._attributes[index];
  61. }
  62. public getAttributesCount(): number {
  63. return this._attributes.length;
  64. }
  65. public getUniformIndex(uniformName: string): number {
  66. return this._uniformsNames.indexOf(uniformName);
  67. }
  68. public getUniform(uniformName: string): WebGLUniformLocation {
  69. return this._uniforms[this._uniformsNames.indexOf(uniformName)];
  70. }
  71. public getSamplers(): string[] {
  72. return this._samplers;
  73. }
  74. public getCompilationError(): string {
  75. return this._compilationError;
  76. }
  77. // Methods
  78. public _loadVertexShader(vertex: any, callback: (data: any) => void): void {
  79. // DOM element ?
  80. if (vertex instanceof HTMLElement) {
  81. var vertexCode = BABYLON.Tools.GetDOMTextContent(vertex);
  82. callback(vertexCode);
  83. return;
  84. }
  85. // Is in local store ?
  86. if (BABYLON.Effect.ShadersStore[vertex + "VertexShader"]) {
  87. callback(BABYLON.Effect.ShadersStore[vertex + "VertexShader"]);
  88. return;
  89. }
  90. var vertexShaderUrl;
  91. if (vertex[0] === ".") {
  92. vertexShaderUrl = vertex;
  93. } else {
  94. vertexShaderUrl = BABYLON.Engine.ShadersRepository + vertex;
  95. }
  96. // Vertex shader
  97. BABYLON.Tools.LoadFile(vertexShaderUrl + ".vertex.fx", callback);
  98. }
  99. public _loadFragmentShader(fragment: any, callback: (data: any) => void): void {
  100. // DOM element ?
  101. if (fragment instanceof HTMLElement) {
  102. var fragmentCode = BABYLON.Tools.GetDOMTextContent(fragment);
  103. callback(fragmentCode);
  104. return;
  105. }
  106. // Is in local store ?
  107. if (BABYLON.Effect.ShadersStore[fragment + "PixelShader"]) {
  108. callback(BABYLON.Effect.ShadersStore[fragment + "PixelShader"]);
  109. return;
  110. }
  111. var fragmentShaderUrl;
  112. if (fragment[0] === ".") {
  113. fragmentShaderUrl = fragment;
  114. } else {
  115. fragmentShaderUrl = BABYLON.Engine.ShadersRepository + fragment;
  116. }
  117. // Fragment shader
  118. BABYLON.Tools.LoadFile(fragmentShaderUrl + ".fragment.fx", callback);
  119. }
  120. public _prepareEffect(vertexSourceCode: string, fragmentSourceCode: string, attributesNames: string[], defines: string, optionalDefines?: string[], useFallback?: boolean): void {
  121. try {
  122. var engine = this._engine;
  123. this._program = engine.createShaderProgram(vertexSourceCode, fragmentSourceCode, defines);
  124. this._uniforms = engine.getUniforms(this._program, this._uniformsNames);
  125. this._attributes = engine.getAttributes(this._program, attributesNames);
  126. for (var index = 0; index < this._samplers.length; index++) {
  127. var sampler = this.getUniform(this._samplers[index]);
  128. if (sampler == null) {
  129. this._samplers.splice(index, 1);
  130. index--;
  131. }
  132. }
  133. engine.bindSamplers(this);
  134. this._isReady = true;
  135. if (this.onCompiled) {
  136. this.onCompiled(this);
  137. }
  138. } catch (e) {
  139. if (!useFallback && optionalDefines) {
  140. for (index = 0; index < optionalDefines.length; index++) {
  141. defines = defines.replace(optionalDefines[index], "");
  142. }
  143. this._prepareEffect(vertexSourceCode, fragmentSourceCode, attributesNames, defines, optionalDefines, true);
  144. } else {
  145. Tools.Error("Unable to compile effect: " + this.name);
  146. Tools.Error("Defines: " + defines);
  147. Tools.Error("Optional defines: " + optionalDefines);
  148. Tools.Error("Error: " + e.message);
  149. this._compilationError = e.message;
  150. if (this.onError) {
  151. this.onError(this, this._compilationError);
  152. }
  153. }
  154. }
  155. }
  156. public _bindTexture(channel: string, texture: WebGLTexture): void {
  157. this._engine._bindTexture(this._samplers.indexOf(channel), texture);
  158. }
  159. public setTexture(channel: string, texture: BaseTexture): void {
  160. this._engine.setTexture(this._samplers.indexOf(channel), texture);
  161. }
  162. public setTextureFromPostProcess(channel: string, postProcess: PostProcess): void {
  163. this._engine.setTextureFromPostProcess(this._samplers.indexOf(channel), postProcess);
  164. }
  165. //public _cacheMatrix(uniformName, matrix) {
  166. // if (!this._valueCache[uniformName]) {
  167. // this._valueCache[uniformName] = new BABYLON.Matrix();
  168. // }
  169. // for (var index = 0; index < 16; index++) {
  170. // this._valueCache[uniformName].m[index] = matrix.m[index];
  171. // }
  172. //};
  173. public _cacheFloat2(uniformName: string, x: number, y: number): void {
  174. if (!this._valueCache[uniformName]) {
  175. this._valueCache[uniformName] = [x, y];
  176. return;
  177. }
  178. this._valueCache[uniformName][0] = x;
  179. this._valueCache[uniformName][1] = y;
  180. }
  181. public _cacheFloat3(uniformName: string, x: number, y: number, z: number): void {
  182. if (!this._valueCache[uniformName]) {
  183. this._valueCache[uniformName] = [x, y, z];
  184. return;
  185. }
  186. this._valueCache[uniformName][0] = x;
  187. this._valueCache[uniformName][1] = y;
  188. this._valueCache[uniformName][2] = z;
  189. }
  190. public _cacheFloat4(uniformName: string, x: number, y: number, z: number, w: number): void {
  191. if (!this._valueCache[uniformName]) {
  192. this._valueCache[uniformName] = [x, y, z, w];
  193. return;
  194. }
  195. this._valueCache[uniformName][0] = x;
  196. this._valueCache[uniformName][1] = y;
  197. this._valueCache[uniformName][2] = z;
  198. this._valueCache[uniformName][3] = w;
  199. }
  200. public setArray(uniformName: string, array: number[]): Effect {
  201. this._engine.setArray(this.getUniform(uniformName), array);
  202. return this;
  203. }
  204. public setMatrices(uniformName: string, matrices: Float32Array): Effect {
  205. this._engine.setMatrices(this.getUniform(uniformName), matrices);
  206. return this;
  207. }
  208. public setMatrix(uniformName: string, matrix: Matrix): Effect {
  209. //if (this._valueCache[uniformName] && this._valueCache[uniformName].equals(matrix))
  210. // return;
  211. //this._cacheMatrix(uniformName, matrix);
  212. this._engine.setMatrix(this.getUniform(uniformName), matrix);
  213. return this;
  214. }
  215. public setFloat(uniformName: string, value: number): Effect {
  216. if (this._valueCache[uniformName] && this._valueCache[uniformName] === value)
  217. return this;
  218. this._valueCache[uniformName] = value;
  219. this._engine.setFloat(this.getUniform(uniformName), value);
  220. return this;
  221. }
  222. public setBool(uniformName: string, bool: boolean): Effect {
  223. if (this._valueCache[uniformName] && this._valueCache[uniformName] === bool)
  224. return this;
  225. this._valueCache[uniformName] = bool;
  226. this._engine.setBool(this.getUniform(uniformName), bool ? 1 : 0);
  227. return this;
  228. }
  229. public setVector2(uniformName: string, vector2: Vector2): Effect {
  230. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] == vector2.x && this._valueCache[uniformName][1] == vector2.y)
  231. return this;
  232. this._cacheFloat2(uniformName, vector2.x, vector2.y);
  233. this._engine.setFloat2(this.getUniform(uniformName), vector2.x, vector2.y);
  234. return this;
  235. }
  236. public setFloat2(uniformName: string, x: number, y: number): Effect {
  237. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] == x && this._valueCache[uniformName][1] == y)
  238. return this;
  239. this._cacheFloat2(uniformName, x, y);
  240. this._engine.setFloat2(this.getUniform(uniformName), x, y);
  241. return this;
  242. }
  243. public setVector3(uniformName: string, vector3: Vector3): Effect {
  244. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] == vector3.x && this._valueCache[uniformName][1] == vector3.y && this._valueCache[uniformName][2] == vector3.z)
  245. return this;
  246. this._cacheFloat3(uniformName, vector3.x, vector3.y, vector3.z);
  247. this._engine.setFloat3(this.getUniform(uniformName), vector3.x, vector3.y, vector3.z);
  248. return this;
  249. }
  250. public setFloat3(uniformName: string, x: number, y: number, z: number): Effect {
  251. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] == x && this._valueCache[uniformName][1] == y && this._valueCache[uniformName][2] == z)
  252. return this;
  253. this._cacheFloat3(uniformName, x, y, z);
  254. this._engine.setFloat3(this.getUniform(uniformName), x, y, z);
  255. return this;
  256. }
  257. public setFloat4(uniformName: string, x: number, y: number, z: number, w: number): Effect {
  258. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] == x && this._valueCache[uniformName][1] == y && this._valueCache[uniformName][2] == z && this._valueCache[uniformName][3] == w)
  259. return this;
  260. this._cacheFloat4(uniformName, x, y, z, w);
  261. this._engine.setFloat4(this.getUniform(uniformName), x, y, z, w);
  262. return this;
  263. }
  264. public setColor3(uniformName: string, color3: Color3): Effect {
  265. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] == color3.r && this._valueCache[uniformName][1] == color3.g && this._valueCache[uniformName][2] == color3.b)
  266. return this;
  267. this._cacheFloat3(uniformName, color3.r, color3.g, color3.b);
  268. this._engine.setColor3(this.getUniform(uniformName), color3);
  269. return this;
  270. }
  271. public setColor4(uniformName: string, color3: Color3, alpha: number): Effect {
  272. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] == color3.r && this._valueCache[uniformName][1] == color3.g && this._valueCache[uniformName][2] == color3.b && this._valueCache[uniformName][3] == alpha)
  273. return this;
  274. this._cacheFloat4(uniformName, color3.r, color3.g, color3.b, alpha);
  275. this._engine.setColor4(this.getUniform(uniformName), color3, alpha);
  276. return this;
  277. }
  278. // Statics
  279. public static ShadersStore = {};
  280. }
  281. }