@bigmistqke/view.gl 0.1.13 → 0.1.15

package/dev/dist/assets/game_of_life-D7qHdFcv.js

@@ -1,202 +0,0 @@
-import { b as createFramebuffer, a as attribute, g as glsl, u as uniform, c as compile, v as view } from './tag-C_bg62fD.js';
-
-let playing = false;
-const canvas = document.createElement("canvas");
-const gl = canvas.getContext("webgl", { antialias: false });
-if (!gl) {
-  throw new Error("WebGL not supported");
-}
-document.body.append(canvas);
-function spray() {
-  return Math.floor(Math.random() * 8) * (Math.random() < 0.5 ? 1 : -1);
-}
-canvas.addEventListener("mousedown", (event) => {
-  const rect = canvas.getBoundingClientRect();
-  const controller = new AbortController();
-  playing = false;
-  window.addEventListener(
-    "mousemove",
-    (event2) => {
-      const x = Math.floor((event2.clientX - rect.left - spray()) * (canvas.width / rect.width));
-      const y = Math.floor((rect.bottom - event2.clientY - spray()) * (canvas.height / rect.height));
-      const dimensions = [2, 2];
-      const data = new Uint8Array(
-        function* () {
-          for (let i = 0; i < dimensions[0] * dimensions[1]; i++) {
-            yield 255;
-            yield 0;
-            yield 0;
-            yield 255;
-          }
-        }()
-      );
-      gl.bindTexture(gl.TEXTURE_2D, read.texture);
-      gl.texSubImage2D(
-        gl.TEXTURE_2D,
-        0,
-        x,
-        y,
-        dimensions[0],
-        dimensions[1],
-        gl.RGBA,
-        gl.UNSIGNED_BYTE,
-        data
-      );
-      gl.bindTexture(gl.TEXTURE_2D, write.texture);
-      gl.texSubImage2D(
-        gl.TEXTURE_2D,
-        0,
-        x,
-        y,
-        dimensions[0],
-        dimensions[1],
-        gl.RGBA,
-        gl.UNSIGNED_BYTE,
-        data
-      );
-      render();
-    },
-    controller
-  );
-  window.addEventListener(
-    "mouseup",
-    () => {
-      controller.abort();
-      playing = true;
-      animate();
-    },
-    controller
-  );
-});
-canvas.width = 256 * 2;
-canvas.height = 256 * 2;
-const WIDTH = canvas.width;
-const HEIGHT = canvas.height;
-const vertex = glsl`
-  ${attribute.vec2("a_vertex")}
-  varying vec2 v_uv;
-  void main() {
-    v_uv = a_vertex * 0.5 + 0.5;
-    gl_Position = vec4(a_vertex, 0, 1);
-  }
-`;
-const stepFragment = glsl`
-  precision mediump float;
-  varying vec2 v_uv;
-  ${uniform.sampler2D("u_texture")}
-  ${uniform.vec2("u_texelSize")}
-
-  int getCell(vec2 uv) {
-    // Wrap around (toroidal)
-    uv = mod(uv, 1.0);
-    float val = texture2D(u_texture, uv).r;
-    return int(step(0.5, val));
-  }
-
-  void main() {
-    int sum = 0;
-    // Iterate neighbors -1,0,1
-    for (int y = -1; y <= 1; y++) {
-      for (int x = -1; x <= 1; x++) {
-        if (x == 0 && y == 0) continue;
-        sum += getCell(v_uv + vec2(float(x), float(y)) * u_texelSize);
-      }
-    }
-    int current = getCell(v_uv);
-
-    int nextState = 0;
-    if (current == 1) {
-      if (sum == 2 || sum == 3) nextState = 1;
-      else nextState = 0;
-    } else {
-      if (sum == 3) nextState = 1;
-      else nextState = 0;
-    }
-
-    gl_FragColor = vec4(float(nextState), 0.0, 0.0, 1.0);
-  }`;
-const renderFragment = glsl`
-  precision mediump float;
-  varying vec2 v_uv;
-  ${uniform.sampler2D("u_texture")}
-  
-  void main() {
-    float cell = texture2D(u_texture, v_uv).r;
-    gl_FragColor = vec4(vec3(cell), 1.0);
-  }`;
-const { program: stepProgram, schema: stepSchema } = compile(gl, vertex, stepFragment);
-const stepView = view(gl, stepProgram, stepSchema);
-const { program: renderProgram, schema: renderSchema } = compile(gl, vertex, renderFragment);
-const renderView = view(gl, renderProgram, {
-  ...renderSchema,
-  attributes: {
-    ...renderSchema.attributes,
-    a_vertex: {
-      ...renderSchema.attributes.a_vertex,
-      buffer: stepView.attributes.a_vertex.buffer
-    }
-  }
-});
-stepView.attributes.a_vertex.set(new Float32Array([-1, -1, 1, -1, -1, 1, -1, 1, 1, -1, 1, 1]));
-const framebufferOptions = {
-  attachment: "color",
-  width: WIDTH,
-  height: HEIGHT,
-  type: "UNSIGNED_BYTE",
-  magFilter: "NEAREST",
-  minFilter: "NEAREST"
-};
-let read = createFramebuffer(gl, framebufferOptions);
-let write = createFramebuffer(gl, framebufferOptions);
-gl.bindTexture(gl.TEXTURE_2D, read.texture);
-gl.texSubImage2D(
-  gl.TEXTURE_2D,
-  0,
-  0,
-  0,
-  WIDTH,
-  HEIGHT,
-  gl.RGBA,
-  gl.UNSIGNED_BYTE,
-  new Uint8Array(
-    function* () {
-      for (let i = 0; i < WIDTH * HEIGHT; i++) {
-        yield 0;
-        yield 0;
-        yield 0;
-        yield 255;
-      }
-    }()
-  )
-);
-function step() {
-  gl.bindFramebuffer(gl.FRAMEBUFFER, write.framebuffer);
-  gl.viewport(0, 0, WIDTH, HEIGHT);
-  gl.useProgram(stepProgram);
-  gl.activeTexture(gl.TEXTURE0);
-  gl.bindTexture(gl.TEXTURE_2D, read.texture);
-  stepView.uniforms.u_texture.set(0);
-  stepView.uniforms.u_texelSize.set(1 / WIDTH, 1 / HEIGHT);
-  stepView.attributes.a_vertex.bind();
-  gl.drawArrays(gl.TRIANGLES, 0, 6);
-}
-function render() {
-  gl.bindFramebuffer(gl.FRAMEBUFFER, null);
-  gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);
-  gl.useProgram(renderProgram);
-  gl.activeTexture(gl.TEXTURE0);
-  gl.bindTexture(gl.TEXTURE_2D, write.texture);
-  renderView.uniforms.u_texture.set(0);
-  renderView.attributes.a_vertex.bind();
-  gl.drawArrays(gl.TRIANGLES, 0, 6);
-}
-function animate() {
-  if (playing) {
-    step();
-    render();
-    [read, write] = [write, read];
-    requestAnimationFrame(animate);
-  }
-}
-playing = true;
-animate();

package/dev/dist/assets/grid-Ie22U_9K.js

@@ -1,173 +0,0 @@
-import { a as attribute, u as uniform, g as glsl, c as compile, v as view } from './tag-C_bg62fD.js';
-import { c as createElement, a as cursor } from './utils-CvCgsM08.js';
-
-const canvas = createElement("canvas", { width: window.innerWidth, height: window.innerHeight });
-const gl = canvas.getContext("webgl2", { antialias: false });
-if (!gl) {
-  throw new Error("WebGL not supported");
-}
-const state = {
-  position: { x: 0, y: 0 },
-  scale: 1,
-  elements: []
-};
-const container = createElement("div");
-state.elements.push(createGridElement({ x: 100, y: 100 }));
-function createGridElement(position = { x: 0, y: 0 }) {
-  position = {
-    x: (position.x - state.position.x) / state.scale,
-    y: (position.y - state.position.y) / state.scale
-  };
-  const element = createElement("div", {
-    innerText: "HALLO WORLD",
-    style: `position: fixed; 
-z-index: 10; 
-left: 0px; 
-top: 0px; 
-transform-origin: top left; 
-background: white; 
-padding: 2px; 
-border-radius: 2px;`,
-    parentElement: container
-  });
-  function update() {
-    element.style.transform = `translate3d(${state.position.x + position.x * state.scale}px,${state.position.y + position.y * state.scale}px,0) scale(${state.scale})`;
-  }
-  update();
-  return {
-    element,
-    position,
-    update
-  };
-}
-canvas.addEventListener("pointerdown", (event) => {
-  cursor(event, (event2) => {
-    state.position.x -= event2.deltaX;
-    state.position.y -= event2.deltaY;
-    render();
-  });
-});
-canvas.addEventListener("dblclick", (event) => {
-  state.elements.push(
-    createGridElement({
-      x: event.clientX,
-      y: event.clientY
-    })
-  );
-});
-window.addEventListener(
-  "wheel",
-  (event) => {
-    const rect = canvas.getBoundingClientRect();
-    const mouseX = event.clientX - rect.left;
-    const mouseY = event.clientY - rect.top;
-    const scaleFactor = event.deltaY > 0 ? 0.95 : 1.05;
-    const oldScale = state.scale;
-    const newScale = Math.max(0.1, Math.min(10, oldScale * scaleFactor));
-    const gridX = (mouseX - state.position.x) / oldScale;
-    const gridY = (mouseY - state.position.y) / oldScale;
-    state.scale = newScale;
-    state.position.x = mouseX - gridX * newScale;
-    state.position.y = mouseY - gridY * newScale;
-    render();
-  },
-  { passive: true }
-);
-window.addEventListener("resize", render);
-const vertex = glsl`#version 300 es
-${attribute.vec2("a_vertex")}
-${uniform.vec2("u_screenSize")}
-${uniform.vec2("u_pos")}
-${uniform.float("u_scale")}
-out vec2 v_gridCoord;
-
-// Direct mapping: (-1,-1) is bottom-left, (1,1) is top-right in clip space
-// We want (0,0) to be top-left in pixel space
-vec2 project(vec2 pos, vec2 size){
-  return vec2(
-    (pos.x + 1.0),
-    (1.0 - pos.y)
-  ) * size * 0.5;
-}
-
-void main() {
-  vec2 pixelPos = project(a_vertex, u_screenSize);
-  
-  // Apply offset and scale to get grid coordinates
-  v_gridCoord = (pixelPos - u_pos) / u_scale;
-  
-  gl_Position = vec4(a_vertex, 0, 1);
-}`;
-const renderFragment = glsl`#version 300 es
-precision highp float;
-in vec2 v_gridCoord;
-out vec4 fragColor;
-${uniform.float("u_thickness")}
-
-float grid(vec2 coord, float thickness) {
-  vec2 cell = mod(coord, 100.0);
-  vec2 derivative = fwidth(coord);
-  
-  // Convert thickness from screen pixels to grid space
-  vec2 screenThickness = derivative * thickness;
-  
-  // Ensure minimum thickness to prevent lines from disappearing
-  vec2 minThickness = max(screenThickness, derivative * 0.5);
-  
-  // Create hard edges by checking if we're within thickness of a grid line
-  float lineX = step(cell.x, minThickness.x) + step(100.0 - minThickness.x, cell.x);
-  float lineY = step(cell.y, minThickness.y) + step(100.0 - minThickness.y, cell.y);
-  
-  // Clamp to 0-1 range and return maximum (union of lines)
-  return max(min(lineX, 1.0), min(lineY, 1.0));
-}
-
-void main() {
-  // Create grid pattern with adjustable thickness
-  float gridPattern = grid(v_gridCoord, u_thickness);
-  
-  // Grid colors
-  vec3 backgroundColor = vec3(0.1, 0.1, 0.15);
-  vec3 gridColor = vec3(0.3, 0.3, 0.4);
-  vec3 color = mix(backgroundColor, gridColor, gridPattern);
-  
-  fragColor = vec4(color, 1.0);
-}`;
-const { program, schema } = compile(gl, vertex, renderFragment);
-const { attributes, uniforms } = view(gl, program, schema);
-attributes.a_vertex.set(new Float32Array([
-  -1,
-  -1,
-  // bottom-left
-  1,
-  -1,
-  // bottom-right
-  -1,
-  1,
-  // top-left
-  -1,
-  1,
-  // top-left
-  1,
-  -1,
-  // bottom-right
-  1,
-  1
-  // top-right
-]));
-function render() {
-  gl.useProgram(program);
-  canvas.width = window.innerWidth;
-  canvas.height = window.innerHeight;
-  gl.viewport(0, 0, canvas.width, canvas.height);
-  gl.clearColor(0, 0, 0, 1);
-  gl.clear(gl.COLOR_BUFFER_BIT);
-  attributes.a_vertex.bind();
-  uniforms.u_screenSize.set(canvas.width, canvas.height);
-  uniforms.u_pos.set(state.position.x, state.position.y);
-  uniforms.u_scale.set(state.scale);
-  uniforms.u_thickness.set(1);
-  state.elements.forEach((element) => element.update());
-  gl.drawArrays(gl.TRIANGLES, 0, 6);
-}
-render();

package/dev/dist/assets/index-0qrXMlfv.js

@@ -1,109 +0,0 @@
-const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/bezier-DuLTb2d1.js","assets/tag-C_bg62fD.js","assets/utils-CvCgsM08.js","assets/game_of_life-D7qHdFcv.js","assets/grid-Ie22U_9K.js","assets/overview-DAxtMIw5.js","assets/pix_sim-DIhzM_vu.js","assets/symbol-BouRL-Ni.js","assets/tetris-IMnkSi9p.js"])))=>i.map(i=>d[i]);
-import { c as createElement } from './utils-CvCgsM08.js';
-
-const scriptRel = 'modulepreload';const assetsURL = function(dep) { return "/"+dep };const seen = {};const __vitePreload = function preload(baseModule, deps, importerUrl) {
-	let promise = Promise.resolve();
-	if (true               && deps && deps.length > 0) {
-		document.getElementsByTagName("link");
-		const cspNonceMeta = document.querySelector("meta[property=csp-nonce]");
-		const cspNonce = cspNonceMeta?.nonce || cspNonceMeta?.getAttribute("nonce");
-		function allSettled(promises$2) {
-			return Promise.all(promises$2.map((p$1) => Promise.resolve(p$1).then((value$1) => ({
-				status: "fulfilled",
-				value: value$1
-			}), (reason) => ({
-				status: "rejected",
-				reason
-			}))));
-		}
-		promise = allSettled(deps.map((dep) => {
-			dep = assetsURL(dep);
-			if (dep in seen) return;
-			seen[dep] = true;
-			const isCss = dep.endsWith(".css");
-			const cssSelector = isCss ? "[rel=\"stylesheet\"]" : "";
-			if (document.querySelector(`link[href="${dep}"]${cssSelector}`)) return;
-			const link = document.createElement("link");
-			link.rel = isCss ? "stylesheet" : scriptRel;
-			if (!isCss) link.as = "script";
-			link.crossOrigin = "";
-			link.href = dep;
-			if (cspNonce) link.setAttribute("nonce", cspNonce);
-			document.head.appendChild(link);
-			if (isCss) return new Promise((res, rej) => {
-				link.addEventListener("load", res);
-				link.addEventListener("error", () => rej(/* @__PURE__ */ new Error(`Unable to preload CSS for ${dep}`)));
-			});
-		}));
-	}
-	function handlePreloadError(err$2) {
-		const e$1 = new Event("vite:preloadError", { cancelable: true });
-		e$1.payload = err$2;
-		window.dispatchEvent(e$1);
-		if (!e$1.defaultPrevented) throw err$2;
-	}
-	return promise.then((res) => {
-		for (const item of res || []) {
-			if (item.status !== "rejected") continue;
-			handlePreloadError(item.reason);
-		}
-		return baseModule().catch(handlePreloadError);
-	});
-};
-
-const css = "/assets/index-C2N3u8wj.css";
-
-const iframe = document.querySelector("iframe");
-const nav = document.querySelector("nav");
-createElement("h3", { innerText: "Examples", parentElement: nav });
-const urls = Object.fromEntries(
-  Object.entries(/* #__PURE__ */ Object.assign({"./examples/bezier.ts": () => __vitePreload(() => import('./bezier-DuLTb2d1.js'),true              ?__vite__mapDeps([0,1,2]):void 0),"./examples/game_of_life.ts": () => __vitePreload(() => import('./game_of_life-D7qHdFcv.js'),true              ?__vite__mapDeps([3,1]):void 0),"./examples/grid.ts": () => __vitePreload(() => import('./grid-Ie22U_9K.js'),true              ?__vite__mapDeps([4,1,2]):void 0),"./examples/overview.ts": () => __vitePreload(() => import('./overview-DAxtMIw5.js'),true              ?__vite__mapDeps([5,1]):void 0),"./examples/pix_sim.ts": () => __vitePreload(() => import('./pix_sim-DIhzM_vu.js'),true              ?__vite__mapDeps([6,1,2]):void 0),"./examples/symbol.ts": () => __vitePreload(() => import('./symbol-BouRL-Ni.js'),true              ?__vite__mapDeps([7,1,2]):void 0),"./examples/tetris.ts": () => __vitePreload(() => import('./tetris-IMnkSi9p.js'),true              ?__vite__mapDeps([8,1]):void 0)})).map(([key, entry]) => {
-    const name = key.split("/").pop().replace(".ts", "");
-    const chunk = entry.toString().match(/import\(['"]([^'"]+)['"]/)[1];
-    return [name, chunk];
-  })
-);
-Object.entries(urls).forEach(([name, localUrl]) => {
-  createElement("button", {
-    onclick(event) {
-      event.preventDefault();
-      load(name, localUrl);
-    },
-    innerHTML: name,
-    parentElement: nav,
-    "data-route": name
-  });
-});
-function load(name, url) {
-  window.location.hash = name;
-  URL.revokeObjectURL(iframe.src);
-  nav.querySelectorAll("button").forEach((button) => {
-    if (button.getAttribute("data-route") === name) {
-      button.classList.add("active");
-    } else {
-      button.classList.remove("active");
-    }
-  });
-  iframe.src = URL.createObjectURL(
-    new Blob(
-      [
-        `<head>
-<link rel="stylesheet" href="${new URL(css, import.meta.url).href}"></link>
-<script type="module" src="${new URL(url, import.meta.url).href}"><\/script></head>`
-      ],
-      {
-        type: "text/html"
-      }
-    )
-  );
-}
-const hash = window.location.hash.slice(1);
-if (hash && hash in urls) {
-  load(hash, urls[hash]);
-}
-window.addEventListener("hashchange", () => {
-  const hash2 = window.location.hash.slice(1);
-  if (hash2 && hash2 in urls) {
-    load(hash2, urls[hash2]);
-  }
-});

package/dev/dist/assets/index-C2N3u8wj.css

@@ -1,12 +0,0 @@
-body {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  margin: 0px;
-  height: 100%;
-  overscroll-behavior-y: none;
-}
-canvas {
-  margin: auto;
-  image-rendering: pixelated;
-}

package/dev/dist/assets/main-BZ1N6pp6.js

@@ -1,32 +0,0 @@
-import './index-0qrXMlfv.js';
-import './utils-CvCgsM08.js';
-
-true              &&(function polyfill() {
-	const relList = document.createElement("link").relList;
-	if (relList && relList.supports && relList.supports("modulepreload")) return;
-	for (const link of document.querySelectorAll("link[rel=\"modulepreload\"]")) processPreload(link);
-	new MutationObserver((mutations) => {
-		for (const mutation of mutations) {
-			if (mutation.type !== "childList") continue;
-			for (const node of mutation.addedNodes) if (node.tagName === "LINK" && node.rel === "modulepreload") processPreload(node);
-		}
-	}).observe(document, {
-		childList: true,
-		subtree: true
-	});
-	function getFetchOpts(link) {
-		const fetchOpts = {};
-		if (link.integrity) fetchOpts.integrity = link.integrity;
-		if (link.referrerPolicy) fetchOpts.referrerPolicy = link.referrerPolicy;
-		if (link.crossOrigin === "use-credentials") fetchOpts.credentials = "include";
-		else if (link.crossOrigin === "anonymous") fetchOpts.credentials = "omit";
-		else fetchOpts.credentials = "same-origin";
-		return fetchOpts;
-	}
-	function processPreload(link) {
-		if (link.ep) return;
-		link.ep = true;
-		const fetchOpts = getFetchOpts(link);
-		fetch(link.href, fetchOpts);
-	}
-}());

package/dev/dist/assets/overview-DAxtMIw5.js

@@ -1,78 +0,0 @@
-import { i as interleave, a as attribute, u as uniform, g as glsl, c as compile, v as view } from './tag-C_bg62fD.js';
-
-const canvas = document.createElement("canvas");
-canvas.width = 800;
-canvas.height = 600;
-document.body.append(canvas);
-const gl = canvas.getContext("webgl2");
-gl.viewport(0, 0, canvas.width, canvas.height);
-const vertex = glsl`
-precision mediump float;
-
-${interleave("instancedData", [attribute.vec2("a_pos"), attribute.vec3("a_color")], {
-  instanced: true
-})}
-${attribute.vec2("a_vertex")}
-${uniform.float("u_time")}
-
-varying vec3 v_color;
-
-void main() {
-  float s = sin(u_time);
-  float c = cos(u_time);
-  mat2 rotation = mat2(
-    c, -s,
-    s,  c
-  );
-  vec2 position = a_pos + a_vertex * rotation;
-  gl_Position = vec4(position, 0.0,  1.0);
-
-  v_color = a_color;
-}`;
-const fragment = glsl`
-precision mediump float;
-
-varying vec3 v_color;
-
-void main() {
-  gl_FragColor = vec4(v_color, 1.0);
-}`;
-const { program, schema } = compile(gl, vertex, fragment);
-const {
-  attributes: { a_vertex },
-  uniforms: { u_time },
-  interleavedAttributes: { instancedData }
-} = view(gl, program, schema);
-instancedData.set(
-  new Float32Array(
-    function* () {
-      for (let i = 0; i < 100; i++) {
-        yield (Math.random() - 0.5) * 2;
-        yield (Math.random() - 0.5) * 2;
-        yield Math.random();
-        yield Math.random();
-        yield Math.random();
-      }
-    }()
-  )
-);
-instancedData.bind();
-a_vertex.set(
-  new Float32Array([
-    // top
-    0,
-    1,
-    // bottom left
-    -1,
-    -1,
-    // bottom right
-    1,
-    -1
-  ])
-).bind();
-gl.useProgram(program);
-requestAnimationFrame(function draw(delta) {
-  requestAnimationFrame(draw);
-  u_time.set(delta / 1e3);
-  gl.drawArraysInstanced(gl.TRIANGLES, 0, 3, 100);
-});