diff --git a/utils/dith.frag b/utils/dith.frag new file mode 100644 index 0000000..32131d8 --- /dev/null +++ b/utils/dith.frag @@ -0,0 +1,10 @@ +#include + +// vec2 st = vec2(vDistance,vDistance)/vec2(u_resolution); +vec2 st = gl_FragCoord.xy / vec2(u_resolution); + +vec3 pos = vec3(st * 5.0, 1.0 * 0.5); + +vec3 color = vec3(noise(pos)); + +// gl_FragColor = vec4(normal, 1.0); \ No newline at end of file diff --git a/utils/main.frag b/utils/main.frag new file mode 100644 index 0000000..9cb5569 --- /dev/null +++ b/utils/main.frag @@ -0,0 +1,25 @@ +uniform vec2 u_resolution; +uniform vec2 u_mouse; +uniform float u_time; +varying float vDistance; +float random(in float x) { + return fract(sin(x) * 1e4); +} + + // Based on Morgan McGuire @morgan3d + // https://www.shadertoy.com/view/4dS3Wd +float noise(in vec3 p) { + const vec3 step = vec3(110.0, 241.0, 171.0); + + vec3 i = floor(p); + vec3 f = fract(p); + + // For performance, compute the base input to a + // 1D random from the integer part of the + // argument and the incremental change to the + // 1D based on the 3D -> 1D wrapping + float n = dot(i, step); + + vec3 u = f * f * (3.0 - 2.0 * f); + return mix(mix(mix(random(n + dot(step, vec3(0, 0, 0))), random(n + dot(step, vec3(1, 0, 0))), u.x), mix(random(n + dot(step, vec3(0, 1, 0))), random(n + dot(step, vec3(1, 1, 0))), u.x), u.y), mix(mix(random(n + dot(step, vec3(0, 0, 1))), random(n + dot(step, vec3(1, 0, 1))), u.x), mix(random(n + dot(step, vec3(0, 1, 1))), random(n + dot(step, vec3(1, 1, 1))), u.x), u.y), u.z); +} \ No newline at end of file diff --git a/utils/material.ts b/utils/material.ts index dd46b84..e259c9e 100644 --- a/utils/material.ts +++ b/utils/material.ts @@ -3,6 +3,10 @@ import { Color, DataTexture, DoubleSide, MeshBasicMaterial, MeshStandardMaterial import { useLoader, } from '@tresjs/core' import { NodeToyMaterial } from '@nodetoy/three-nodetoy'; import { data } from './shaderData.ts'; +import vertexShader from './vertex.vert?raw' +import mainShader from './main.frag?raw' +import normalShader from './normal.frag?raw' +import dithShader from './dith.frag?raw' import { getFilename, patterns, } from "~/components/pattern" @@ -48,6 +52,7 @@ function generateNoiseTexture(width: number, height: number) { texture.needsUpdate = true; return texture; } +console.log(vertexShader) const m_onBeforeCompile = (shader) => { // Добавляем uniform переменную shader.uniforms.u_resolution = { value: new Vector2(20.0, 20.0) }; @@ -58,79 +63,27 @@ const m_onBeforeCompile = (shader) => { ${shader.vertexShader} `.replace( `#include `, - `#include - vDistance = length(position + `#include + ${vertexShader} ` ); - // Изменяем фрагментный шейдер + // // Изменяем фрагментный шейдер shader.fragmentShader = ` - uniform vec2 u_resolution; - uniform vec2 u_mouse; - uniform float u_time; - varying float vDistance; - float random (in float x) { - return fract(sin(x)*1e4); - } - - // Based on Morgan McGuire @morgan3d - // https://www.shadertoy.com/view/4dS3Wd - float noise (in vec3 p) { - const vec3 step = vec3(110.0, 241.0, 171.0); - - vec3 i = floor(p); - vec3 f = fract(p); - - // For performance, compute the base input to a - // 1D random from the integer part of the - // argument and the incremental change to the - // 1D based on the 3D -> 1D wrapping - float n = dot(i, step); - - vec3 u = f * f * (3.0 - 2.0 * f); - return mix( mix(mix(random(n + dot(step, vec3(0,0,0))), - random(n + dot(step, vec3(1,0,0))), - u.x), - mix(random(n + dot(step, vec3(0,1,0))), - random(n + dot(step, vec3(1,1,0))), - u.x), - u.y), - mix(mix(random(n + dot(step, vec3(0,0,1))), - random(n + dot(step, vec3(1,0,1))), - u.x), - mix(random(n + dot(step, vec3(0,1,1))), - random(n + dot(step, vec3(1,1,1))), - u.x), - u.y), - u.z); - } + ${mainShader} ${shader.fragmentShader}` .replace( '#include ', ` #include - - // vec2 normal_st = gl_FragCoord.xy/vec2(u_resolution); - vec2 normal_st = vec2(vDistance, vDistance)/vec2(u_resolution); - vec3 normal_pos = vec3(normal_st*5.0,1.0*0.5); - vec3 normal_noise = vec3(noise(normal_pos)); - - vec3 modifiedNormal = normalize(normal + normal_noise); - normal = modifiedNormal; + ${normalShader} ` ) .replace( `#include `, `#include - - vec2 st = vDistance/vec2(u_resolution); - - vec3 pos = vec3(st*5.0,1.0*0.5); - - vec3 color = vec3(noise(pos)); - - gl_FragColor = vec4(normal,1.0); - ` + ${dithShader} + ` ); }; const m = new MeshStandardMaterial({ diff --git a/utils/normal.frag b/utils/normal.frag new file mode 100644 index 0000000..5facf50 --- /dev/null +++ b/utils/normal.frag @@ -0,0 +1,7 @@ +vec2 normal_st = gl_FragCoord.xy / vec2(u_resolution); + // vec2 normal_st = vec2(random(vDistance), random(vDistance))/vec2(u_resolution); +vec3 normal_pos = vec3(normal_st * 5.0, 1.0 * 0.5); +vec3 normal_noise = vec3(noise(normal_pos)); + +vec3 modifiedNormal = normalize(normal + normal_noise); +normal = modifiedNormal; \ No newline at end of file diff --git a/utils/vertex.vert b/utils/vertex.vert new file mode 100644 index 0000000..0edda29 --- /dev/null +++ b/utils/vertex.vert @@ -0,0 +1 @@ +vDistance = length(position); \ No newline at end of file