[Feature Request] Implement Custom Shader Support for OverlayVideo Component

[FusionFont]

Hi @midori-profile,

I've been using the overlay-video component in my recent projects and it's been working great for high-performance web animations. However, I've encountered a need to further customize the animations with custom shaders for more complex visual effects.

Proposed Feature:

• Custom Shader Support: Allow users to define and inject custom vertex and fragment shaders into the OverlayVideo component. This would enable advanced animations and effects beyond the current capabilities.

Use Case:

• Currently, the component uses a fixed shader pair for rendering the video onto a canvas. The ability to use custom shaders would open up possibilities for users to manipulate the video frames in creative ways, such as applying post-processing effects, color adjustments, or even integrating with other WebGL content.

Implementation Suggestion:

• Add two new props to the OverlayVideo component: vertexShader and fragmentShader. These would be strings containing the GLSL code for the respective shaders.
• Update the initializeWebGL function to accept these new props and compile the provided shaders if they are present.
• Ensure that the component's API documentation is updated to include these new props and their usage.

Impact:

• This feature would significantly enhance the flexibility and power of the overlay-video component, making it more appealing to developers looking to implement advanced web animations.

Code Snippet Example:

<OverlayVideo
  path={video}
  vertexShader={customVertexShader}
  fragmentShader={customFragmentShader}
  // ...other props
/>

I believe this feature would be a valuable addition to the project and would love to collaborate on its implementation if possible.