From 057d245f655ab82bf45bbabc1f1a91133468d03c Mon Sep 17 00:00:00 2001 From: Kevin Levron Date: Wed, 30 Sep 2020 23:03:29 +0200 Subject: [PATCH] add noisy sphere --- src/components/noisy/NoisySphere.js | 66 +++++++++++++++++++++++++++++ 1 file changed, 66 insertions(+) create mode 100644 src/components/noisy/NoisySphere.js diff --git a/src/components/noisy/NoisySphere.js b/src/components/noisy/NoisySphere.js new file mode 100644 index 0000000..00c5b5e --- /dev/null +++ b/src/components/noisy/NoisySphere.js @@ -0,0 +1,66 @@ +import { MeshPhysicalMaterial } from 'three'; +import { watch } from 'vue'; +import Sphere from '../../meshes/Sphere.js'; +import snoise4 from '../../glsl/snoise4.glsl.js'; + +export default { + extends: Sphere, + props: { + widthSegments: { type: Number, default: 128 }, + heightSegments: { type: Number, default: 128 }, + timeCoef: { type: Number, default: 0.001 }, + noiseCoef: { type: Number, default: 0.05 }, + dispCoef: { type: Number, default: 5 }, + }, + setup(props) { + // uniforms + const uTime = { value: 0 }; + const uNoiseCoef = { value: props.noiseCoef }; + watch(() => props.noiseCoef, (value) => { uNoiseCoef.value = value; }); + const uDispCoef = { value: props.dispCoef }; + watch(() => props.dispCoef, (value) => { uDispCoef.value = value; }); + + return { + uTime, uNoiseCoef, uDispCoef, + }; + }, + created() { + this.createGeometry(); + this.createMaterial(); + + const startTime = Date.now(); + this.three.onBeforeRender(() => { + this.uTime.value = (Date.now() - startTime) * this.timeCoef; + }); + }, + methods: { + createMaterial() { + this.material = new MeshPhysicalMaterial(); + this.material.onBeforeCompile = (shader) => { + shader.uniforms.uTime = this.uTime; + shader.uniforms.uNoiseCoef = this.uNoiseCoef; + shader.uniforms.uDispCoef = this.uDispCoef; + shader.vertexShader = ` + uniform float uTime; + uniform float uNoiseCoef; + uniform float uDispCoef; + varying float vNoise; + ${snoise4} + ` + shader.vertexShader; + + shader.vertexShader = shader.vertexShader.replace( + '#include ', + ` + vec4 p = vec4(vec3(position * uNoiseCoef), uTime); + vNoise = snoise(p); + vec3 transformed = vec3(position); + transformed += normalize(position) * vNoise * uDispCoef; + ` + ); + + this.materialShader = shader; + }; + }, + }, + __hmrId: 'NoisySphere', +};