babylon.effect.js 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470
  1. var BABYLON;
  2. (function (BABYLON) {
  3. var EffectFallbacks = (function () {
  4. function EffectFallbacks() {
  5. this._defines = {};
  6. this._currentRank = 32;
  7. this._maxRank = -1;
  8. }
  9. EffectFallbacks.prototype.addFallback = function (rank, define) {
  10. if (!this._defines[rank]) {
  11. if (rank < this._currentRank) {
  12. this._currentRank = rank;
  13. }
  14. if (rank > this._maxRank) {
  15. this._maxRank = rank;
  16. }
  17. this._defines[rank] = new Array();
  18. }
  19. this._defines[rank].push(define);
  20. };
  21. EffectFallbacks.prototype.addCPUSkinningFallback = function (rank, mesh) {
  22. this._meshRank = rank;
  23. this._mesh = mesh;
  24. if (rank > this._maxRank) {
  25. this._maxRank = rank;
  26. }
  27. };
  28. Object.defineProperty(EffectFallbacks.prototype, "isMoreFallbacks", {
  29. get: function () {
  30. return this._currentRank <= this._maxRank;
  31. },
  32. enumerable: true,
  33. configurable: true
  34. });
  35. EffectFallbacks.prototype.reduce = function (currentDefines) {
  36. var currentFallbacks = this._defines[this._currentRank];
  37. for (var index = 0; index < currentFallbacks.length; index++) {
  38. currentDefines = currentDefines.replace("#define " + currentFallbacks[index], "");
  39. }
  40. if (this._mesh && this._currentRank === this._meshRank) {
  41. this._mesh.computeBonesUsingShaders = false;
  42. currentDefines = currentDefines.replace("#define NUM_BONE_INFLUENCERS " + this._mesh.numBoneInfluencers, "#define NUM_BONE_INFLUENCERS 0");
  43. BABYLON.Tools.Log("Falling back to CPU skinning for " + this._mesh.name);
  44. }
  45. this._currentRank++;
  46. return currentDefines;
  47. };
  48. return EffectFallbacks;
  49. }());
  50. BABYLON.EffectFallbacks = EffectFallbacks;
  51. var Effect = (function () {
  52. function Effect(baseName, attributesNames, uniformsNames, samplers, engine, defines, fallbacks, onCompiled, onError, indexParameters) {
  53. var _this = this;
  54. this._isReady = false;
  55. this._compilationError = "";
  56. this._valueCache = [];
  57. this._engine = engine;
  58. this.name = baseName;
  59. this.defines = defines;
  60. this._uniformsNames = uniformsNames.concat(samplers);
  61. this._samplers = samplers;
  62. this._attributesNames = attributesNames;
  63. this.onError = onError;
  64. this.onCompiled = onCompiled;
  65. this._indexParameters = indexParameters;
  66. var vertexSource;
  67. var fragmentSource;
  68. if (baseName.vertexElement) {
  69. vertexSource = document.getElementById(baseName.vertexElement);
  70. if (!vertexSource) {
  71. vertexSource = baseName.vertexElement;
  72. }
  73. }
  74. else {
  75. vertexSource = baseName.vertex || baseName;
  76. }
  77. if (baseName.fragmentElement) {
  78. fragmentSource = document.getElementById(baseName.fragmentElement);
  79. if (!fragmentSource) {
  80. fragmentSource = baseName.fragmentElement;
  81. }
  82. }
  83. else {
  84. fragmentSource = baseName.fragment || baseName;
  85. }
  86. this._loadVertexShader(vertexSource, function (vertexCode) {
  87. _this._processIncludes(vertexCode, function (vertexCodeWithIncludes) {
  88. _this._loadFragmentShader(fragmentSource, function (fragmentCode) {
  89. _this._processIncludes(fragmentCode, function (fragmentCodeWithIncludes) {
  90. _this._prepareEffect(vertexCodeWithIncludes, fragmentCodeWithIncludes, attributesNames, defines, fallbacks);
  91. });
  92. });
  93. });
  94. });
  95. }
  96. // Properties
  97. Effect.prototype.isReady = function () {
  98. return this._isReady;
  99. };
  100. Effect.prototype.getProgram = function () {
  101. return this._program;
  102. };
  103. Effect.prototype.getAttributesNames = function () {
  104. return this._attributesNames;
  105. };
  106. Effect.prototype.getAttributeLocation = function (index) {
  107. return this._attributes[index];
  108. };
  109. Effect.prototype.getAttributeLocationByName = function (name) {
  110. var index = this._attributesNames.indexOf(name);
  111. return this._attributes[index];
  112. };
  113. Effect.prototype.getAttributesCount = function () {
  114. return this._attributes.length;
  115. };
  116. Effect.prototype.getUniformIndex = function (uniformName) {
  117. return this._uniformsNames.indexOf(uniformName);
  118. };
  119. Effect.prototype.getUniform = function (uniformName) {
  120. return this._uniforms[this._uniformsNames.indexOf(uniformName)];
  121. };
  122. Effect.prototype.getSamplers = function () {
  123. return this._samplers;
  124. };
  125. Effect.prototype.getCompilationError = function () {
  126. return this._compilationError;
  127. };
  128. // Methods
  129. Effect.prototype._loadVertexShader = function (vertex, callback) {
  130. // DOM element ?
  131. if (vertex instanceof HTMLElement) {
  132. var vertexCode = BABYLON.Tools.GetDOMTextContent(vertex);
  133. callback(vertexCode);
  134. return;
  135. }
  136. // Is in local store ?
  137. if (Effect.ShadersStore[vertex + "VertexShader"]) {
  138. callback(Effect.ShadersStore[vertex + "VertexShader"]);
  139. return;
  140. }
  141. var vertexShaderUrl;
  142. if (vertex[0] === "." || vertex[0] === "/" || vertex.indexOf("http") > -1) {
  143. vertexShaderUrl = vertex;
  144. }
  145. else {
  146. vertexShaderUrl = BABYLON.Engine.ShadersRepository + vertex;
  147. }
  148. // Vertex shader
  149. BABYLON.Tools.LoadFile(vertexShaderUrl + ".vertex.fx", callback);
  150. };
  151. Effect.prototype._loadFragmentShader = function (fragment, callback) {
  152. // DOM element ?
  153. if (fragment instanceof HTMLElement) {
  154. var fragmentCode = BABYLON.Tools.GetDOMTextContent(fragment);
  155. callback(fragmentCode);
  156. return;
  157. }
  158. // Is in local store ?
  159. if (Effect.ShadersStore[fragment + "PixelShader"]) {
  160. callback(Effect.ShadersStore[fragment + "PixelShader"]);
  161. return;
  162. }
  163. if (Effect.ShadersStore[fragment + "FragmentShader"]) {
  164. callback(Effect.ShadersStore[fragment + "FragmentShader"]);
  165. return;
  166. }
  167. var fragmentShaderUrl;
  168. if (fragment[0] === "." || fragment[0] === "/" || fragment.indexOf("http") > -1) {
  169. fragmentShaderUrl = fragment;
  170. }
  171. else {
  172. fragmentShaderUrl = BABYLON.Engine.ShadersRepository + fragment;
  173. }
  174. // Fragment shader
  175. BABYLON.Tools.LoadFile(fragmentShaderUrl + ".fragment.fx", callback);
  176. };
  177. Effect.prototype._dumpShadersName = function () {
  178. if (this.name.vertexElement) {
  179. BABYLON.Tools.Error("Vertex shader:" + this.name.vertexElement);
  180. BABYLON.Tools.Error("Fragment shader:" + this.name.fragmentElement);
  181. }
  182. else if (this.name.vertex) {
  183. BABYLON.Tools.Error("Vertex shader:" + this.name.vertex);
  184. BABYLON.Tools.Error("Fragment shader:" + this.name.fragment);
  185. }
  186. else {
  187. BABYLON.Tools.Error("Vertex shader:" + this.name);
  188. BABYLON.Tools.Error("Fragment shader:" + this.name);
  189. }
  190. };
  191. Effect.prototype._processIncludes = function (sourceCode, callback) {
  192. var _this = this;
  193. var regex = /#include<(.+)>(\((.*)\))*(\[(.*)\])*/g;
  194. var match = regex.exec(sourceCode);
  195. var returnValue = new String(sourceCode);
  196. while (match != null) {
  197. var includeFile = match[1];
  198. if (Effect.IncludesShadersStore[includeFile]) {
  199. // Substitution
  200. var includeContent = Effect.IncludesShadersStore[includeFile];
  201. if (match[2]) {
  202. var splits = match[3].split(",");
  203. for (var index = 0; index < splits.length; index += 2) {
  204. var source = new RegExp(splits[index], "g");
  205. var dest = splits[index + 1];
  206. includeContent = includeContent.replace(source, dest);
  207. }
  208. }
  209. if (match[4]) {
  210. var indexString = match[5];
  211. if (indexString.indexOf("..") !== -1) {
  212. var indexSplits = indexString.split("..");
  213. var minIndex = parseInt(indexSplits[0]);
  214. var maxIndex = parseInt(indexSplits[1]);
  215. var sourceIncludeContent = includeContent.slice(0);
  216. includeContent = "";
  217. if (isNaN(maxIndex)) {
  218. maxIndex = this._indexParameters[indexSplits[1]];
  219. }
  220. for (var i = minIndex; i <= maxIndex; i++) {
  221. includeContent += sourceIncludeContent.replace(/\{X\}/g, i) + "\n";
  222. }
  223. }
  224. else {
  225. includeContent = includeContent.replace(/\{X\}/g, indexString);
  226. }
  227. }
  228. // Replace
  229. returnValue = returnValue.replace(match[0], includeContent);
  230. }
  231. else {
  232. var includeShaderUrl = BABYLON.Engine.ShadersRepository + "ShadersInclude/" + includeFile + ".fx";
  233. BABYLON.Tools.LoadFile(includeShaderUrl, function (fileContent) {
  234. Effect.IncludesShadersStore[includeFile] = fileContent;
  235. _this._processIncludes(returnValue, callback);
  236. });
  237. return;
  238. }
  239. match = regex.exec(sourceCode);
  240. }
  241. callback(returnValue);
  242. };
  243. Effect.prototype._processPrecision = function (source) {
  244. if (source.indexOf("precision highp float") === -1) {
  245. if (!this._engine.getCaps().highPrecisionShaderSupported) {
  246. source = "precision mediump float;\n" + source;
  247. }
  248. else {
  249. source = "precision highp float;\n" + source;
  250. }
  251. }
  252. else {
  253. if (!this._engine.getCaps().highPrecisionShaderSupported) {
  254. source = source.replace("precision highp float", "precision mediump float");
  255. }
  256. }
  257. return source;
  258. };
  259. Effect.prototype._prepareEffect = function (vertexSourceCode, fragmentSourceCode, attributesNames, defines, fallbacks) {
  260. try {
  261. var engine = this._engine;
  262. // Precision
  263. vertexSourceCode = this._processPrecision(vertexSourceCode);
  264. fragmentSourceCode = this._processPrecision(fragmentSourceCode);
  265. this._program = engine.createShaderProgram(vertexSourceCode, fragmentSourceCode, defines);
  266. this._uniforms = engine.getUniforms(this._program, this._uniformsNames);
  267. this._attributes = engine.getAttributes(this._program, attributesNames);
  268. for (var index = 0; index < this._samplers.length; index++) {
  269. var sampler = this.getUniform(this._samplers[index]);
  270. if (sampler == null) {
  271. this._samplers.splice(index, 1);
  272. index--;
  273. }
  274. }
  275. engine.bindSamplers(this);
  276. this._isReady = true;
  277. if (this.onCompiled) {
  278. this.onCompiled(this);
  279. }
  280. }
  281. catch (e) {
  282. // Is it a problem with precision?
  283. if (e.message.indexOf("highp") !== -1) {
  284. vertexSourceCode = vertexSourceCode.replace("precision highp float", "precision mediump float");
  285. fragmentSourceCode = fragmentSourceCode.replace("precision highp float", "precision mediump float");
  286. this._prepareEffect(vertexSourceCode, fragmentSourceCode, attributesNames, defines, fallbacks);
  287. return;
  288. }
  289. // Let's go through fallbacks then
  290. if (fallbacks && fallbacks.isMoreFallbacks) {
  291. BABYLON.Tools.Error("Unable to compile effect with current defines. Trying next fallback.");
  292. this._dumpShadersName();
  293. defines = fallbacks.reduce(defines);
  294. this._prepareEffect(vertexSourceCode, fragmentSourceCode, attributesNames, defines, fallbacks);
  295. }
  296. else {
  297. BABYLON.Tools.Error("Unable to compile effect: ");
  298. this._dumpShadersName();
  299. BABYLON.Tools.Error("Defines: " + defines);
  300. BABYLON.Tools.Error("Error: " + e.message);
  301. this._compilationError = e.message;
  302. if (this.onError) {
  303. this.onError(this, this._compilationError);
  304. }
  305. }
  306. }
  307. };
  308. Object.defineProperty(Effect.prototype, "isSupported", {
  309. get: function () {
  310. return this._compilationError === "";
  311. },
  312. enumerable: true,
  313. configurable: true
  314. });
  315. Effect.prototype._bindTexture = function (channel, texture) {
  316. this._engine._bindTexture(this._samplers.indexOf(channel), texture);
  317. };
  318. Effect.prototype.setTexture = function (channel, texture) {
  319. this._engine.setTexture(this._samplers.indexOf(channel), texture);
  320. };
  321. Effect.prototype.setTextureFromPostProcess = function (channel, postProcess) {
  322. this._engine.setTextureFromPostProcess(this._samplers.indexOf(channel), postProcess);
  323. };
  324. Effect.prototype._cacheMatrix = function (uniformName, matrix) {
  325. if (!this._valueCache[uniformName]) {
  326. this._valueCache[uniformName] = new BABYLON.Matrix();
  327. }
  328. for (var index = 0; index < 16; index++) {
  329. this._valueCache[uniformName].m[index] = matrix.m[index];
  330. }
  331. };
  332. Effect.prototype._cacheFloat2 = function (uniformName, x, y) {
  333. if (!this._valueCache[uniformName]) {
  334. this._valueCache[uniformName] = [x, y];
  335. return;
  336. }
  337. this._valueCache[uniformName][0] = x;
  338. this._valueCache[uniformName][1] = y;
  339. };
  340. Effect.prototype._cacheFloat3 = function (uniformName, x, y, z) {
  341. if (!this._valueCache[uniformName]) {
  342. this._valueCache[uniformName] = [x, y, z];
  343. return;
  344. }
  345. this._valueCache[uniformName][0] = x;
  346. this._valueCache[uniformName][1] = y;
  347. this._valueCache[uniformName][2] = z;
  348. };
  349. Effect.prototype._cacheFloat4 = function (uniformName, x, y, z, w) {
  350. if (!this._valueCache[uniformName]) {
  351. this._valueCache[uniformName] = [x, y, z, w];
  352. return;
  353. }
  354. this._valueCache[uniformName][0] = x;
  355. this._valueCache[uniformName][1] = y;
  356. this._valueCache[uniformName][2] = z;
  357. this._valueCache[uniformName][3] = w;
  358. };
  359. Effect.prototype.setArray = function (uniformName, array) {
  360. this._engine.setArray(this.getUniform(uniformName), array);
  361. return this;
  362. };
  363. Effect.prototype.setArray2 = function (uniformName, array) {
  364. this._engine.setArray2(this.getUniform(uniformName), array);
  365. return this;
  366. };
  367. Effect.prototype.setArray3 = function (uniformName, array) {
  368. this._engine.setArray3(this.getUniform(uniformName), array);
  369. return this;
  370. };
  371. Effect.prototype.setArray4 = function (uniformName, array) {
  372. this._engine.setArray4(this.getUniform(uniformName), array);
  373. return this;
  374. };
  375. Effect.prototype.setMatrices = function (uniformName, matrices) {
  376. this._engine.setMatrices(this.getUniform(uniformName), matrices);
  377. return this;
  378. };
  379. Effect.prototype.setMatrix = function (uniformName, matrix) {
  380. //if (this._valueCache[uniformName] && this._valueCache[uniformName].equals(matrix))
  381. // return this;
  382. // this._cacheMatrix(uniformName, matrix);
  383. this._engine.setMatrix(this.getUniform(uniformName), matrix);
  384. return this;
  385. };
  386. Effect.prototype.setMatrix3x3 = function (uniformName, matrix) {
  387. this._engine.setMatrix3x3(this.getUniform(uniformName), matrix);
  388. return this;
  389. };
  390. Effect.prototype.setMatrix2x2 = function (uniformname, matrix) {
  391. this._engine.setMatrix2x2(this.getUniform(uniformname), matrix);
  392. return this;
  393. };
  394. Effect.prototype.setFloat = function (uniformName, value) {
  395. if (this._valueCache[uniformName] && this._valueCache[uniformName] === value)
  396. return this;
  397. this._valueCache[uniformName] = value;
  398. this._engine.setFloat(this.getUniform(uniformName), value);
  399. return this;
  400. };
  401. Effect.prototype.setBool = function (uniformName, bool) {
  402. if (this._valueCache[uniformName] && this._valueCache[uniformName] === bool)
  403. return this;
  404. this._valueCache[uniformName] = bool;
  405. this._engine.setBool(this.getUniform(uniformName), bool ? 1 : 0);
  406. return this;
  407. };
  408. Effect.prototype.setVector2 = function (uniformName, vector2) {
  409. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] === vector2.x && this._valueCache[uniformName][1] === vector2.y)
  410. return this;
  411. this._cacheFloat2(uniformName, vector2.x, vector2.y);
  412. this._engine.setFloat2(this.getUniform(uniformName), vector2.x, vector2.y);
  413. return this;
  414. };
  415. Effect.prototype.setFloat2 = function (uniformName, x, y) {
  416. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] === x && this._valueCache[uniformName][1] === y)
  417. return this;
  418. this._cacheFloat2(uniformName, x, y);
  419. this._engine.setFloat2(this.getUniform(uniformName), x, y);
  420. return this;
  421. };
  422. Effect.prototype.setVector3 = function (uniformName, vector3) {
  423. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] === vector3.x && this._valueCache[uniformName][1] === vector3.y && this._valueCache[uniformName][2] === vector3.z)
  424. return this;
  425. this._cacheFloat3(uniformName, vector3.x, vector3.y, vector3.z);
  426. this._engine.setFloat3(this.getUniform(uniformName), vector3.x, vector3.y, vector3.z);
  427. return this;
  428. };
  429. Effect.prototype.setFloat3 = function (uniformName, x, y, z) {
  430. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] === x && this._valueCache[uniformName][1] === y && this._valueCache[uniformName][2] === z)
  431. return this;
  432. this._cacheFloat3(uniformName, x, y, z);
  433. this._engine.setFloat3(this.getUniform(uniformName), x, y, z);
  434. return this;
  435. };
  436. Effect.prototype.setVector4 = function (uniformName, vector4) {
  437. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] === vector4.x && this._valueCache[uniformName][1] === vector4.y && this._valueCache[uniformName][2] === vector4.z && this._valueCache[uniformName][3] === vector4.w)
  438. return this;
  439. this._cacheFloat4(uniformName, vector4.x, vector4.y, vector4.z, vector4.w);
  440. this._engine.setFloat4(this.getUniform(uniformName), vector4.x, vector4.y, vector4.z, vector4.w);
  441. return this;
  442. };
  443. Effect.prototype.setFloat4 = function (uniformName, x, y, z, w) {
  444. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] === x && this._valueCache[uniformName][1] === y && this._valueCache[uniformName][2] === z && this._valueCache[uniformName][3] === w)
  445. return this;
  446. this._cacheFloat4(uniformName, x, y, z, w);
  447. this._engine.setFloat4(this.getUniform(uniformName), x, y, z, w);
  448. return this;
  449. };
  450. Effect.prototype.setColor3 = function (uniformName, color3) {
  451. if (this._valueCache[uniformName] && this._valueCache[uniformName][0] === color3.r && this._valueCache[uniformName][1] === color3.g && this._valueCache[uniformName][2] === color3.b)
  452. return this;
  453. this._cacheFloat3(uniformName, color3.r, color3.g, color3.b);
  454. this._engine.setColor3(this.getUniform(uniformName), color3);
  455. return this;
  456. };
  457. Effect.prototype.setColor4 = function (uniformName, color3, alpha) {
  458. 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)
  459. return this;
  460. this._cacheFloat4(uniformName, color3.r, color3.g, color3.b, alpha);
  461. this._engine.setColor4(this.getUniform(uniformName), color3, alpha);
  462. return this;
  463. };
  464. // Statics
  465. Effect.ShadersStore = {};
  466. Effect.IncludesShadersStore = {};
  467. return Effect;
  468. }());
  469. BABYLON.Effect = Effect;
  470. })(BABYLON || (BABYLON = {}));