BlurNode.js 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168
  1. /**
  2. * @author sunag / http://www.sunag.com.br/
  3. */
  4. import { TempNode } from '../core/TempNode.js';
  5. import { FunctionNode } from '../core/FunctionNode.js';
  6. import { FloatNode } from '../inputs/FloatNode.js';
  7. import { Vector2Node } from '../inputs/Vector2Node.js';
  8. import { UVNode } from '../accessors/UVNode.js';
  9. function BlurNode( value, coord, radius, size ) {
  10. TempNode.call( this, 'v4' );
  11. this.value = value;
  12. this.coord = coord || new UVNode();
  13. this.radius = new Vector2Node( 1, 1 );
  14. this.size = size;
  15. this.blurX = true;
  16. this.blurY = true;
  17. this.horizontal = new FloatNode( 1 / 64 );
  18. this.vertical = new FloatNode( 1 / 64 );
  19. };
  20. BlurNode.Nodes = (function() {
  21. var blurX = new FunctionNode( [
  22. "vec4 blurX( sampler2D texture, vec2 uv, float s ) {",
  23. " vec4 sum = vec4( 0.0 );",
  24. " sum += texture2D( texture, vec2( uv.x - 4.0 * s, uv.y ) ) * 0.051;",
  25. " sum += texture2D( texture, vec2( uv.x - 3.0 * s, uv.y ) ) * 0.0918;",
  26. " sum += texture2D( texture, vec2( uv.x - 2.0 * s, uv.y ) ) * 0.12245;",
  27. " sum += texture2D( texture, vec2( uv.x - 1.0 * s, uv.y ) ) * 0.1531;",
  28. " sum += texture2D( texture, vec2( uv.x, uv.y ) ) * 0.1633;",
  29. " sum += texture2D( texture, vec2( uv.x + 1.0 * s, uv.y ) ) * 0.1531;",
  30. " sum += texture2D( texture, vec2( uv.x + 2.0 * s, uv.y ) ) * 0.12245;",
  31. " sum += texture2D( texture, vec2( uv.x + 3.0 * s, uv.y ) ) * 0.0918;",
  32. " sum += texture2D( texture, vec2( uv.x + 4.0 * s, uv.y ) ) * 0.051;",
  33. " return sum;",
  34. "}"
  35. ].join( "\n" ) );
  36. var blurY = new FunctionNode( [
  37. "vec4 blurY( sampler2D texture, vec2 uv, float s ) {",
  38. " vec4 sum = vec4( 0.0 );",
  39. " sum += texture2D( texture, vec2( uv.x, uv.y - 4.0 * s ) ) * 0.051;",
  40. " sum += texture2D( texture, vec2( uv.x, uv.y - 3.0 * s ) ) * 0.0918;",
  41. " sum += texture2D( texture, vec2( uv.x, uv.y - 2.0 * s ) ) * 0.12245;",
  42. " sum += texture2D( texture, vec2( uv.x, uv.y - 1.0 * s ) ) * 0.1531;",
  43. " sum += texture2D( texture, vec2( uv.x, uv.y ) ) * 0.1633;",
  44. " sum += texture2D( texture, vec2( uv.x, uv.y + 1.0 * s ) ) * 0.1531;",
  45. " sum += texture2D( texture, vec2( uv.x, uv.y + 2.0 * s ) ) * 0.12245;",
  46. " sum += texture2D( texture, vec2( uv.x, uv.y + 3.0 * s ) ) * 0.0918;",
  47. " sum += texture2D( texture, vec2( uv.x, uv.y + 4.0 * s ) ) * 0.051;",
  48. " return sum;",
  49. "}"
  50. ].join( "\n" ) );
  51. return {
  52. blurX: blurX,
  53. blurY: blurY
  54. };
  55. })();
  56. BlurNode.prototype = Object.create( TempNode.prototype );
  57. BlurNode.prototype.constructor = BlurNode;
  58. BlurNode.prototype.nodeType = "Blur";
  59. BlurNode.prototype.updateFrame = function ( frame ) {
  60. if ( this.size ) {
  61. this.horizontal.value = this.radius.x / this.size.x;
  62. this.vertical.value = this.radius.y / this.size.y;
  63. } else if ( this.value.value && this.value.value.image ) {
  64. var image = this.value.value.image;
  65. this.horizontal.value = this.radius.x / image.width;
  66. this.vertical.value = this.radius.y / image.height;
  67. }
  68. };
  69. BlurNode.prototype.generate = function ( builder, output ) {
  70. if ( builder.isShader( 'fragment' ) ) {
  71. var blurCode = [], code;
  72. var blurX = builder.include( BlurNode.Nodes.blurX ),
  73. blurY = builder.include( BlurNode.Nodes.blurY );
  74. if ( this.blurX ) {
  75. blurCode.push( blurX + '( ' + this.value.build( builder, 'sampler2D' ) + ', ' + this.coord.build( builder, 'v2' ) + ', ' + this.horizontal.build( builder, 'fv1' ) + ' )' );
  76. }
  77. if ( this.blurY ) {
  78. blurCode.push( blurY + '( ' + this.value.build( builder, 'sampler2D' ) + ', ' + this.coord.build( builder, 'v2' ) + ', ' + this.vertical.build( builder, 'fv1' ) + ' )' );
  79. }
  80. if ( blurCode.length == 2 ) code = '( ' + blurCode.join( ' + ' ) + '/ 2.0 )';
  81. else if ( blurCode.length ) code = '( ' + blurCode[ 0 ] + ' )';
  82. else code = 'vec4( 0.0 )';
  83. return builder.format( code, this.getType( builder ), output );
  84. } else {
  85. console.warn( "THREE.BlurNode is not compatible with " + builder.shader + " shader." );
  86. return builder.format( 'vec4( 0.0 )', this.getType( builder ), output );
  87. }
  88. };
  89. BlurNode.prototype.copy = function ( source ) {
  90. TempNode.prototype.copy.call( this, source );
  91. this.value = source.value;
  92. this.coord = source.coord;
  93. this.radius = source.radius;
  94. if ( source.size !== undefined ) this.size = new THREE.Vector2( source.size.x, source.size.y );
  95. this.blurX = source.blurX;
  96. this.blurY = source.blurY;
  97. };
  98. BlurNode.prototype.toJSON = function ( meta ) {
  99. var data = this.getJSONNode( meta );
  100. if ( ! data ) {
  101. data = this.createJSONNode( meta );
  102. data.value = this.value.toJSON( meta ).uuid;
  103. data.coord = this.coord.toJSON( meta ).uuid;
  104. data.radius = this.radius.toJSON( meta ).uuid;
  105. if ( this.size ) data.size = { x: this.size.x, y: this.size.y };
  106. data.blurX = this.blurX;
  107. data.blurY = this.blurY;
  108. }
  109. return data;
  110. };
  111. export { BlurNode };