typescript/shaderview
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

allow to update uniforms

Browse source
This commit is contained in:
Michaël Lemaire 2024-12-17 17:45:13 +01:00
parent 850304b6f7
commit 5f2144f38e
2 changed files with 18 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/shaderview.ts
View file

@ -40,6 +40,13 @@ export class ShaderView {
this.finalShader = this.preprocessShaderCode(shaderString);
const all_uniforms = this.listUniforms();
for (const uniform_name of Object.keys(all_uniforms)) {
if (!this.uniforms[uniform_name]) {
this.uniforms[uniform_name] = all_uniforms[uniform_name];
}
}
if (!options?.noRender) {
this.render = new ShaderViewRender(this.finalShader, this.uniforms);
}
@ -96,7 +103,7 @@ export class ShaderView {
}
setUniform(name: string, value: any): void {
this.uniforms[name];
this.uniforms[name].value = value;
}
setParent(parent: HTMLElement): void {

12
web/index.html
View file

@ -3,24 +3,32 @@
<meta charset="utf-8">
<script type="module">
import { ShaderView } from "./mod.js";
var speed = document.getElementById("speed");
speed.onchange = () => view.setUniform("speed", speed.value);
const shader = `
uniform float speed;
void main()
{
vec2 uv = (gl_FragCoord.xy * 2. - iResolution.xy) / iResolution.y;
float d = length(uv);
d = abs(sin(d * 10. + iTime)) / 10.;
d = abs(sin(d * 10. + iTime * speed)) / 10.;
d = smoothstep(0.95, 1., 1. - d);
vec3 color = d * vec3(1., 2., 3.);
gl_FragColor = vec4(color, 1.0);
}`.trim();
new ShaderView(shader, {
const view = new ShaderView(shader, {
parent: document.getElementById("container"),
size: { width: 512, height: 512 },
});
view.setUniform("speed", speed.value);
console.log(view.uniforms);
</script>
</head>
<body>
<input id="speed" type="number" value="1" />
<div id="container"></div>
</body>
</html>