<jupyter_start><jupyter_text>This notebook gives a simple example of how to use the ShaderMaterial to write custom shaders from the Python side. For further information about the shaders, consult the three.js docs.<jupyter_code>from pythreejs import *
import ipywidgets as widgets
from IPython.display import display
ShaderMaterial?
vertex_shader = """
uniform float time;
uniform vec2 resolution;

void main() {
    vec3 pos = vec3(position.x + time * resolution.x, position.y + time * resolution.y, position.z);
    gl_Position = projectionMatrix * modelViewMatrix * vec4( pos, 1.0 );
}
"""
fragment_shader = """
uniform vec3 user_color;

void main() {
    #ifdef FIX_COLOR
    gl_FragColor = vec4(0.5, 0, 0, 1.0);
    #else
    gl_FragColor = vec4(user_color, 1.0);
    #endif
}
"""
material = ShaderMaterial(
    uniforms=dict(
        time=dict(value=0.0),
        resolution=dict(value=(1, 1)),
        user_color=dict(value='green'),
        **UniformsLib['common']
    ),
    defines=dict(
        FIX_COLOR=1,
    ),
    vertexShader=vertex_shader,
    fragmentShader=fragment_shader,
)
material
# Disable fixed color from defines:
material.defines = dict()
material.needsUpdate = True
# Uniform editors:
picker = widgets.ColorPicker(value=material.uniforms['user_color']['value'])
time_slider = widgets.FloatSlider(value=material.uniforms['time']['value'], min=-15, max=15)

# Interactive code:
def update_uniforms(change):
    uniforms = dict(**material.uniforms)
    uniforms.update(
        time=dict(value=time_slider.value),
        user_color=dict(value=picker.value),
    )
    material.uniforms = uniforms
    material.needsUpdate = True

picker.observe(update_uniforms)
time_slider.observe(update_uniforms)

# Present "dashboard" in VBox:
widgets.VBox([
    Preview(material),
    picker,
    time_slider,
])<jupyter_output><empty_output>
{'fraction_non_alphanumeric': 0.11847065158858373, 'fraction_numerical': 0.014001077005923533, 'mean_word_length': 4.308571428571429, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'chain_length': '1', 'dir': 'jupyter-structured-clean-dedup', 'id': '571433', 'license': 'BSD-3-Clause', 'n_tokens_mistral': 607, 'n_tokens_neox': 593, 'n_words': 137, 'path': 'examples/Shaders.ipynb', 'repo_name': 'mariobuikhuizen/pythreejs', 'size': '1857'}