Wgs

wgs is a binary format that represents pixel shader programs. Inspired by Shadertoy but uses WGSL instead. It can now runs on native platforms and Web as well thanks to wgpu-rs.

File strcuture

A wgs file mainly consists of three parts:

• meta which contains the meta info of the file, including:
  • name project name.
  • texture_count the count of the texture used by the file.
  • version the wgs version used in the file.
• frag the shader program in WGSL format.
• textures the textures used by the file. Each texture consists of it's width and height and color data in 8bit RGBA format.

Version

The latest version of wgs is wgs 1.

How to write wgs

WgShadertoy is a cross-platform program helps you read and write your wgs files.

Maybe Web-based editors in the future.

Uniforms

A wgs program receives six parameters passed from the runtime as a uniform variable:

• cursor: vec2
  • The mouse position in pixels.
• mouse_down: u32
  • Whether the left button of the mouse is down.
  • 0: left button is up.
  • 1: left button is down.
• mouse_press: vec2
  • The mouse position in pixels when the left button is pressed.
• mouse_release: vec2
  • The mouse position in pixels when the left button is released.
• resolution: vec2
  • The resolution of the canvas in pixels (width * height).
• time: f32
  • The elapsed time since the shader first ran, in seconds.

You can use the above uniform like the following:

wgsl fn main_image(frag_color: vec4<f32>, frag_coord: vec2<f32>) -> vec4<f32> { let uv = frag_coord / u.resolution; let color = 0.5 + 0.5 * cos(u.time + uv.xyx + vec3(0.0, 2.0, 4.0)); return vec4(color, 1.0); }

Built-in functions

wgs currently provides one built-in function:

• image helps you play with textures:

  wgsl fn image(t: texture_2d<f32>, spl: sampler, uv: vec2<f32>) -> vec4<f32>

  Check this example for usage.

How to run wgs

Native

wgsruntimewgpu is all you need to run wgs file on a native platform.

Here's an example about how to integrate wgs with winit.

You can write your own runtime implementation as long as it implements RuntimeExt.

Web

wgs_runtime_wgpu also compiles for Wasm32 architecture.

You can install it from npm or use a high-level library wgs-player.