glslkit-webgl 0.1.0.pre

data/sample/shaders/common/sdf.glsl

@@ -0,0 +1,11 @@
+#pragma once
+
+mat2 rotate2d(float angle) {
+  float c = cos(angle), s = sin(angle);
+  return mat2(c, -s, s, c);
+}
+
+float sdTorus(vec3 p, vec2 t) {
+  vec2 q = vec2(length(p.xz) - t.x, p.y);
+  return length(q) - t.y;
+}

data/sample/shaders/cube.frag

@@ -0,0 +1,8 @@
+#version 300 es
+precision mediump float;
+in vec2 v_uv;
+uniform sampler2D u_texture;
+out vec4 frag_color;
+void main() {
+  frag_color = texture(u_texture, v_uv);
+}

data/sample/shaders/cube.vert

@@ -0,0 +1,9 @@
+#version 300 es
+layout(location = 0) in vec3 a_position;
+layout(location = 1) in vec2 a_uv;
+uniform mat4 u_mvp;
+out vec2 v_uv;
+void main() {
+  v_uv = a_uv;
+  gl_Position = u_mvp * vec4(a_position, 1.0);
+}

data/sample/shaders/neon.frag

@@ -0,0 +1,79 @@
+#version 300 es
+precision highp float;
+
+uniform float u_time;
+uniform vec2 u_resolution;
+out vec4 frag_color;
+
+#define PI 3.14159265359
+
+#include "common/sdf.glsl"
+#include "common/color.glsl"
+
+float scene(vec3 p) {
+  p.xz *= rotate2d(u_time * 0.32);
+  p.xy *= rotate2d(sin(u_time * 0.27) * 0.55);
+
+  float angle = atan(p.z, p.x);
+  float pulse = 0.10 * sin(angle * 7.0 + u_time * 2.4);
+  float portal = sdTorus(p, vec2(1.25, 0.17 + pulse));
+
+  vec3 orb = p;
+  orb.xz *= rotate2d(-u_time * 0.7);
+  orb -= vec3(1.25, sin(u_time * 1.8) * 0.22, 0.0);
+  float satellite = length(orb) - 0.11;
+  return min(portal, satellite);
+}
+
+vec3 normalAt(vec3 p) {
+  vec2 e = vec2(0.0015, 0.0);
+  float d = scene(p);
+  return normalize(vec3(
+    scene(p + e.xyy) - d,
+    scene(p + e.yxy) - d,
+    scene(p + e.yyx) - d
+  ));
+}
+
+float raymarch(vec3 origin, vec3 direction, out vec3 point) {
+  float distanceTravelled = 0.0;
+  for (int i = 0; i < 96; i++) {
+    point = origin + direction * distanceTravelled;
+    float distanceToScene = scene(point);
+    if (distanceToScene < 0.001 || distanceTravelled > 12.0) break;
+    distanceTravelled += distanceToScene * 0.72;
+  }
+  return distanceTravelled;
+}
+
+void main() {
+  vec2 uv = (gl_FragCoord.xy * 2.0 - u_resolution) / u_resolution.y;
+  float vignette = max(0.0, 1.0 - dot(uv, uv) * 0.28);
+
+  vec3 origin = vec3(0.0, 0.0, 4.2);
+  vec3 direction = normalize(vec3(uv, -1.8));
+  vec3 point;
+  float travelled = raymarch(origin, direction, point);
+
+  vec3 color = vec3(0.006, 0.008, 0.025);
+  float rays = pow(max(0.0, 1.0 - length(uv)), 5.0);
+  color += vec3(0.12, 0.03, 0.30) * rays;
+
+  if (travelled < 12.0) {
+    vec3 normal = normalAt(point);
+    vec3 light = normalize(vec3(0.7, 1.2, 2.0));
+    float diffuse = max(dot(normal, light), 0.0);
+    float rim = pow(1.0 - max(dot(normal, -direction), 0.0), 2.4);
+    float bands = 0.5 + 0.5 * sin(atan(point.z, point.x) * 9.0 - u_time * 3.0);
+    vec3 neon = palette(bands + u_time * 0.06);
+    color += neon * (0.18 + diffuse * 0.65 + rim * 2.4);
+    color += pow(max(dot(reflect(-light, normal), -direction), 0.0), 32.0);
+  }
+
+  float glowDistance = abs(length(uv) - 0.47 - sin(atan(uv.y, uv.x) * 7.0 + u_time) * 0.018);
+  color += palette(u_time * 0.07 + length(uv)) * 0.012 / max(glowDistance, 0.008);
+
+  color *= vignette;
+  color = pow(color, vec3(0.82));
+  frag_color = vec4(color, 1.0);
+}

data/sample/shaders/neon.vert

@@ -0,0 +1,5 @@
+#version 300 es
+layout(location = 0) in vec2 a_position;
+void main() {
+  gl_Position = vec4(a_position, 0.0, 1.0);
+}

data/sample/shaders-broken/common/color.glsl

@@ -0,0 +1,5 @@
+#pragma once
+
+vec3 palette(float t) {
+  return 0.55 + 0.45 * cos(6.28318 * (vec3(0.02, 0.18, 0.38) * t + vec3(0.0, 0.18, 0.42)));
+}

data/sample/shaders-broken/common/sdf.glsl

@@ -0,0 +1,11 @@
+#pragma once
+
+mat2 rotate2d(float angle) {
+  float c = cos(angle), s = sin(angle)
+  return mat2(c, -s, s, c);
+}
+
+float sdTorus(vec3 p, vec2 t) {
+  vec2 q = vec2(length(p.xz) - t.x, p.y);
+  return length(q) - t.y;
+}

data/sample/shaders-broken/neon-broken.frag

@@ -0,0 +1,79 @@
+#version 300 es
+precision highp float;
+
+uniform float u_time;
+uniform vec2 u_resolution;
+out vec4 frag_color;
+
+#define PI 3.14159265359
+
+#include "common/sdf.glsl"
+#include "common/color.glsl"
+
+float scene(vec3 p) {
+  p.xz *= rotate2d(u_time * 0.32);
+  p.xy *= rotate2d(sin(u_time * 0.27) * 0.55);
+
+  float angle = atan(p.z, p.x);
+  float pulse = 0.10 * sin(angle * 7.0 + u_time * 2.4);
+  float portal = sdTorus(p, vec2(1.25, 0.17 + pulse));
+
+  vec3 orb = p;
+  orb.xz *= rotate2d(-u_time * 0.7);
+  orb -= vec3(1.25, sin(u_time * 1.8) * 0.22, 0.0);
+  float satellite = length(orb) - 0.11;
+  return min(portal, satellite);
+}
+
+vec3 normalAt(vec3 p) {
+  vec2 e = vec2(0.0015, 0.0);
+  float d = scene(p);
+  return normalize(vec3(
+    scene(p + e.xyy) - d,
+    scene(p + e.yxy) - d,
+    scene(p + e.yyx) - d
+  ));
+}
+
+float raymarch(vec3 origin, vec3 direction, out vec3 point) {
+  float distanceTravelled = 0.0;
+  for (int i = 0; i < 96; i++) {
+    point = origin + direction * distanceTravelled;
+    float distanceToScene = scene(point);
+    if (distanceToScene < 0.001 || distanceTravelled > 12.0) break;
+    distanceTravelled += distanceToScene * 0.72;
+  }
+  return distanceTravelled;
+}
+
+void main() {
+  vec2 uv = (gl_FragCoord.xy * 2.0 - u_resolution) / u_resolution.y;
+  float vignette = max(0.0, 1.0 - dot(uv, uv) * 0.28);
+
+  vec3 origin = vec3(0.0, 0.0, 4.2);
+  vec3 direction = normalize(vec3(uv, -1.8));
+  vec3 point;
+  float travelled = raymarch(origin, direction, point);
+
+  vec3 color = vec3(0.006, 0.008, 0.025);
+  float rays = pow(max(0.0, 1.0 - length(uv)), 5.0);
+  color += vec3(0.12, 0.03, 0.30) * rays;
+
+  if (travelled < 12.0) {
+    vec3 normal = normalAt(point);
+    vec3 light = normalize(vec3(0.7, 1.2, 2.0));
+    float diffuse = max(dot(normal, light), 0.0);
+    float rim = pow(1.0 - max(dot(normal, -direction), 0.0), 2.4);
+    float bands = 0.5 + 0.5 * sin(atan(point.z, point.x) * 9.0 - u_time * 3.0);
+    vec3 neon = palette(bands + u_time * 0.06);
+    color += neon * (0.18 + diffuse * 0.65 + rim * 2.4);
+    color += pow(max(dot(reflect(-light, normal), -direction), 0.0), 32.0);
+  }
+
+  float glowDistance = abs(length(uv) - 0.47 - sin(atan(uv.y, uv.x) * 7.0 + u_time) * 0.018);
+  color += palette(u_time * 0.07 + length(uv)) * 0.012 / max(glowDistance, 0.008);
+
+  color *= vignette;
+  color = pow(color, vec3(0.82));
+  frag_color = vec4(color, 1.0);
+}

data/sample/shaders-broken/neon-broken.vert

@@ -0,0 +1,5 @@
+#version 300 es
+layout(location = 0) in vec2 a_position;
+void main() {
+  gl_Position = vec4(a_position, 0.0, 1.0);
+}

data/shim/glslkit-webgl.js

@@ -0,0 +1,49 @@
+(function () {
+  "use strict";
+
+  const script = document.currentScript;
+  const entry = script && script.dataset.entry;
+  const rubyVersion = (script && script.dataset.rubyVersion) || "4.0";
+  const wasmWasiVersion = (script && script.dataset.wasmWasiVersion) || "2.10.1";
+
+  if (!entry) {
+    throw new Error("glslkit-webgl: data-entry must name the Ruby entry file");
+  }
+
+  const packageName = `@ruby/${rubyVersion}-wasm-wasi`;
+  const packageRoot = `https://cdn.jsdelivr.net/npm/${packageName}@${wasmWasiVersion}/dist`;
+  const wasmUrl = `${packageRoot}/ruby+stdlib.wasm`;
+  const vmUrl = `https://cdn.jsdelivr.net/npm/@ruby/wasm-wasi@${wasmWasiVersion}/dist/browser/+esm`;
+
+  async function compile(response) {
+    if (!response.ok) {
+      throw new Error(`glslkit-webgl: failed to fetch ruby.wasm (${response.status})`);
+    }
+
+    try {
+      return await WebAssembly.compileStreaming(response.clone());
+    } catch (_error) {
+      return WebAssembly.compile(await response.arrayBuffer());
+    }
+  }
+
+  async function boot() {
+    const [{ DefaultRubyVM }, response] = await Promise.all([
+      import(vmUrl),
+      fetch(wasmUrl),
+    ]);
+    const module = await compile(response);
+    const { vm } = await DefaultRubyVM(module);
+    const baseUrl = new URL(".", new URL(entry, document.baseURI)).href;
+    const feature = new URL(entry, document.baseURI).pathname.split("/").pop().replace(/\.rb$/, "");
+    const ruby = [
+      'require "js/require_remote/relative_shim"',
+      `JS::RequireRemote.instance.base_url = ${JSON.stringify(baseUrl)}`,
+      `JS::RequireRemote.instance.load(${JSON.stringify(feature)})`,
+    ].join("\n");
+
+    await vm.evalAsync(ruby);
+  }
+
+  window.glslkitWebGLReady = boot();
+})();

metadata

@@ -0,0 +1,105 @@
+--- !ruby/object:Gem::Specification
+name: glslkit-webgl
+version: !ruby/object:Gem::Version
+  version: 0.1.0.pre
+platform: ruby
+authors:
+- kyubey1228
+bindir: bin
+cert_chain: []
+date: 2026-08-24 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: glslkit
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 0.1.0.pre
+    - - "<"
+      - !ruby/object:Gem::Version
+        version: 0.2.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 0.1.0.pre
+    - - "<"
+      - !ruby/object:Gem::Version
+        version: 0.2.0
+description: Lets you write WebGL2 rendering code entirely in Ruby, running under
+  ruby.wasm in the browser. Resolves uniform/attribute locations from a glslkit reflection
+  manifest instead of calling getActiveUniform, and surfaces shader compile errors
+  as Ruby exceptions pointing at the original file and line. REQUIRES a ruby.wasm
+  runtime (the `js` gem) to run — it installs under a normal CRuby/JRuby/TruffleRuby,
+  but raises a clear LoadError instead of working there. This gem is meant to be bundled
+  into a ruby.wasm build (see README), not required from a regular Ruby process.
+email:
+- kyuuka1228@gmail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- CHANGELOG.md
+- LICENSE.txt
+- README.md
+- glslkit-webgl.gemspec
+- lib/glslkit/webgl.rb
+- lib/glslkit/webgl/context.rb
+- lib/glslkit/webgl/embed.rb
+- lib/glslkit/webgl/errors.rb
+- lib/glslkit/webgl/geometry.rb
+- lib/glslkit/webgl/live_reload.rb
+- lib/glslkit/webgl/matrix.rb
+- lib/glslkit/webgl/program.rb
+- lib/glslkit/webgl/reload_result.rb
+- lib/glslkit/webgl/texture.rb
+- lib/glslkit/webgl/version.rb
+- sample/app.rb
+- sample/error_panel.rb
+- sample/generated-broken/neon-broken_shaders.rb
+- sample/generated/cube_shaders.rb
+- sample/generated/neon_shaders.rb
+- sample/index.html
+- sample/neon-error.html
+- sample/neon-error.rb
+- sample/neon.html
+- sample/neon.rb
+- sample/shaders-broken/common/color.glsl
+- sample/shaders-broken/common/sdf.glsl
+- sample/shaders-broken/neon-broken.frag
+- sample/shaders-broken/neon-broken.vert
+- sample/shaders/common/color.glsl
+- sample/shaders/common/sdf.glsl
+- sample/shaders/cube.frag
+- sample/shaders/cube.vert
+- sample/shaders/neon.frag
+- sample/shaders/neon.vert
+- shim/glslkit-webgl.js
+homepage: https://github.com/kyubey1228/glslkit
+licenses:
+- MIT
+metadata:
+  homepage_uri: https://github.com/kyubey1228/glslkit
+  source_code_uri: https://github.com/kyubey1228/glslkit/tree/main/webgl
+  changelog_uri: https://github.com/kyubey1228/glslkit/blob/main/webgl/CHANGELOG.md
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '3.1'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.6.2
+specification_version: 4
+summary: ruby.wasm WebGL2 binding that consumes glslkit reflection manifests
+test_files: []