diff --git a/examples/webgpu_tsl_editor.html b/examples/webgpu_tsl_editor.html index 91565a7cadf77d..6c02dec2dc5ac3 100644 --- a/examples/webgpu_tsl_editor.html +++ b/examples/webgpu_tsl_editor.html @@ -126,15 +126,21 @@ const editorDOM = document.getElementById( 'source' ); const resultDOM = document.getElementById( 'result' ); - const tslCode = `// Simple example + const tslCode = `// Simple uv.x animation -const { texture, uniform, vec4 } = TSL; +const { texture, uniform, vec2, vec4, uv, oscSine, timerLocal } = TSL; //const samplerTexture = new THREE.Texture(); const samplerTexture = new THREE.TextureLoader().load( './textures/uv_grid_opengl.jpg' ); +samplerTexture.wrapS = THREE.RepeatWrapping; +//samplerTexture.wrapT = THREE.RepeatWrapping; + +const timer = timerLocal( .5 ); // .5 is speed +const uv0 = uv(); +const animateUv = vec2( uv0.x.add( oscSine( timer ) ), uv0.y ); // label is optional -const myMap = texture( samplerTexture ).rgb.label( 'myTexture' ); +const myMap = texture( samplerTexture, animateUv ).rgb.label( 'myTexture' ); const myColor = uniform( new THREE.Color( 0x0066ff ) ).label( 'myColor' ); const opacity = .7;