Skip to content

Instantly share code, notes, and snippets.

Avatar
👋

Matt DesLauriers mattdesl

👋
View GitHub Profile
View query.txt
{
tokens(where: { owner: "... wallet address ..." }) {
id
project {
name
artistName
}
}
}
View fetch-tokens.js
const SUBGRAPH = "https://api.thegraph.com/subgraphs/name/artblocks/art-blocks";
// Utility to query from subgraph
async function query(url, query) {
const response = await fetch(url, {
method: "post",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ query }),
View lch-color.js
import { LCh } from './color.js';
const isScreenprint = style === SCREENPRINT;
const L = isScreenprint ? 50 : 92;
const C = isScreenprint ? random.range(5, 20) : 5;
const h = random.range(0, 360);
const background = LCh(L, C, h);
const foreground = isScreenprint ? 'white' : 'black';
View geometricNormal.js
import { vec3 } from 'gl-matrix';
/*
Construct a [ position, normal ] from parametric function and (u, v) coordinate.
Reference: ThreeJS.
*/
export function geometricNormal(fn, u, v) {
const EPS = 0.00001;
const pu = [];
View diffuse-lighting.js
const light = /* a unit normal for light direction */;
// Determine the 3D position and normal from surface point
const [ u, v ] = penStart;
const [ position, normal ] = geometricNormal(parametricTerrain, u, v);
// Get lambertian diffuse
const diffuse = Math.max(0, vec3.dot(normal, light));
View flow-field.js
// A 2D polyline of samples along a flow field
let path = [ penStart ];
let [ x, y ] = penStart;
for (let i = 0; i < steps; i++) {
// Get new angle of rotation
const angle = noise(x, y) * angleAmplitude;
// Offset the point by this angle
x += Math.cos(angle) * stepSize;
y += Math.sin(angle) * stepSize;
View create-geometry.js
// Number of horizontal and vertical slices
const subdivisions = 20;
// Calculate vertices at each grid point and gather the triangle indices of the mesh
// We pass our 'parametricTerrain' function in as an input to the generator
const [ vertices, cells ] = generateGeometry(parametricTerrain, subdivisions);
// vertices are 3D positions on the surface
// [ [ x0, y0, z0 ], [ x1, y1, z1 ], ... ]
View draw-geometry.js
// Project 3D points to 2D
const vertices2D = vertices.map(p => project(p));
// Draw each cell
for (let cell of cells) {
// Get the 2D points that define this triangle or quad
const points2D = cell.map(idx => vertices2D[idx]);
// Draw this polygon
context.beginPath();
View parametric-terrain.js
function parametricTerrain ([ u, v ]) {
// Turn 0..1 to -1..1
const x = u * 2 - 1;
const z = v * 2 - 1;
// Find height at this 2D coordinate
const y = calculateTerrainHeight(x, z);
// Return the 3D surface point
return [ x, y, z ];
View project-3d-to-2d.js
// List of 3D coordinates
const vertices = [
[-0.5, 0, -0.5],
[0.5, 0, -0.5],
...
];
// A utility that projects 3D points to 2D screen-space
// Using a virtual 'camera' that has a 3D position and target
// And viewport width and height