babylon.marbleProceduralTexture.js 5.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. /// <reference path="../../../dist/preview release/babylon.d.ts"/>
  2. var BABYLON;
  3. (function (BABYLON) {
  4. var MarbleProceduralTexture = (function (_super) {
  5. __extends(MarbleProceduralTexture, _super);
  6. function MarbleProceduralTexture(name, size, scene, fallbackTexture, generateMipMaps) {
  7. _super.call(this, name, size, "marbleProceduralTexture", scene, fallbackTexture, generateMipMaps);
  8. this._numberOfTilesHeight = 3;
  9. this._numberOfTilesWidth = 3;
  10. this._amplitude = 9.0;
  11. this._marbleColor = new BABYLON.Color3(0.77, 0.47, 0.40);
  12. this._jointColor = new BABYLON.Color3(0.72, 0.72, 0.72);
  13. this.updateShaderUniforms();
  14. }
  15. MarbleProceduralTexture.prototype.updateShaderUniforms = function () {
  16. this.setFloat("numberOfTilesHeight", this._numberOfTilesHeight);
  17. this.setFloat("numberOfTilesWidth", this._numberOfTilesWidth);
  18. this.setFloat("amplitude", this._amplitude);
  19. this.setColor3("marbleColor", this._marbleColor);
  20. this.setColor3("jointColor", this._jointColor);
  21. };
  22. Object.defineProperty(MarbleProceduralTexture.prototype, "numberOfTilesHeight", {
  23. get: function () {
  24. return this._numberOfTilesHeight;
  25. },
  26. set: function (value) {
  27. this._numberOfTilesHeight = value;
  28. this.updateShaderUniforms();
  29. },
  30. enumerable: true,
  31. configurable: true
  32. });
  33. Object.defineProperty(MarbleProceduralTexture.prototype, "amplitude", {
  34. get: function () {
  35. return this._amplitude;
  36. },
  37. set: function (value) {
  38. this._amplitude = value;
  39. this.updateShaderUniforms();
  40. },
  41. enumerable: true,
  42. configurable: true
  43. });
  44. Object.defineProperty(MarbleProceduralTexture.prototype, "numberOfTilesWidth", {
  45. get: function () {
  46. return this._numberOfTilesWidth;
  47. },
  48. set: function (value) {
  49. this._numberOfTilesWidth = value;
  50. this.updateShaderUniforms();
  51. },
  52. enumerable: true,
  53. configurable: true
  54. });
  55. Object.defineProperty(MarbleProceduralTexture.prototype, "jointColor", {
  56. get: function () {
  57. return this._jointColor;
  58. },
  59. set: function (value) {
  60. this._jointColor = value;
  61. this.updateShaderUniforms();
  62. },
  63. enumerable: true,
  64. configurable: true
  65. });
  66. Object.defineProperty(MarbleProceduralTexture.prototype, "marbleColor", {
  67. get: function () {
  68. return this._marbleColor;
  69. },
  70. set: function (value) {
  71. this._marbleColor = value;
  72. this.updateShaderUniforms();
  73. },
  74. enumerable: true,
  75. configurable: true
  76. });
  77. return MarbleProceduralTexture;
  78. })(BABYLON.ProceduralTexture);
  79. BABYLON.MarbleProceduralTexture = MarbleProceduralTexture;
  80. })(BABYLON || (BABYLON = {}));
  81. BABYLON.Effect.ShadersStore['marbleProceduralTexturePixelShader'] = "precision highp float;\r\n\r\nvarying vec2 vPosition;\r\nvarying vec2 vUV;\r\n\r\nuniform float numberOfTilesHeight;\r\nuniform float numberOfTilesWidth;\r\nuniform float amplitude;\r\nuniform vec3 brickColor;\r\nuniform vec3 jointColor;\r\n\r\nconst vec3 tileSize = vec3(1.1, 1.0, 1.1);\r\nconst vec3 tilePct = vec3(0.98, 1.0, 0.98);\r\n\r\nfloat rand(vec2 n) {\r\n\treturn fract(cos(dot(n, vec2(12.9898, 4.1414))) * 43758.5453);\r\n}\r\n\r\nfloat noise(vec2 n) {\r\n\tconst vec2 d = vec2(0.0, 1.0);\r\n\tvec2 b = floor(n), f = smoothstep(vec2(0.0), vec2(1.0), fract(n));\r\n\treturn mix(mix(rand(b), rand(b + d.yx), f.x), mix(rand(b + d.xy), rand(b + d.yy), f.x), f.y);\r\n}\r\n\r\nfloat turbulence(vec2 P)\r\n{\r\n\tfloat val = 0.0;\r\n\tfloat freq = 1.0;\r\n\tfor (int i = 0; i < 4; i++)\r\n\t{\r\n\t\tval += abs(noise(P*freq) / freq);\r\n\t\tfreq *= 2.07;\r\n\t}\r\n\treturn val;\r\n}\r\n\r\nfloat round(float number){\r\n\treturn sign(number)*floor(abs(number) + 0.5);\r\n}\r\n\r\nvec3 marble_color(float x)\r\n{\r\n\tvec3 col;\r\n\tx = 0.5*(x + 1.);\r\n\tx = sqrt(x); \r\n\tx = sqrt(x);\r\n\tx = sqrt(x);\r\n\tcol = vec3(.2 + .75*x); \r\n\tcol.b *= 0.95; \r\n\treturn col;\r\n}\r\n\r\nvoid main()\r\n{\r\n\tfloat brickW = 1.0 / numberOfTilesWidth;\r\n\tfloat brickH = 1.0 / numberOfTilesHeight;\r\n\tfloat jointWPercentage = 0.01;\r\n\tfloat jointHPercentage = 0.01;\r\n\tvec3 color = brickColor;\r\n\tfloat yi = vUV.y / brickH;\r\n\tfloat nyi = round(yi);\r\n\tfloat xi = vUV.x / brickW;\r\n\r\n\tif (mod(floor(yi), 2.0) == 0.0){\r\n\t\txi = xi - 0.5;\r\n\t}\r\n\r\n\tfloat nxi = round(xi);\r\n\tvec2 brickvUV = vec2((xi - floor(xi)) / brickH, (yi - floor(yi)) / brickW);\r\n\r\n\tif (yi < nyi + jointHPercentage && yi > nyi - jointHPercentage){\r\n\t\tcolor = mix(jointColor, vec3(0.37, 0.25, 0.25), (yi - nyi) / jointHPercentage + 0.2);\r\n\t}\r\n\telse if (xi < nxi + jointWPercentage && xi > nxi - jointWPercentage){\r\n\t\tcolor = mix(jointColor, vec3(0.44, 0.44, 0.44), (xi - nxi) / jointWPercentage + 0.2);\r\n\t}\r\n\telse {\r\n\t\tfloat t = 6.28 * brickvUV.x / (tileSize.x + noise(vec2(vUV)*6.0));\r\n\t\tt += amplitude * turbulence(brickvUV.xy);\r\n\t\tt = sin(t);\r\n\t\tcolor = marble_color(t);\r\n\t}\r\n\r\n\tgl_FragColor = vec4(color, 0.0);\r\n}";