Skip to content

Instantly share code, notes, and snippets.

View sketchpunk's full-sized avatar
🏠
Working from home

Pedro sketchpunk

🏠
Working from home
View GitHub Profile
@sketchpunk
sketchpunk / CustomMaterial.js
Created April 9, 2025 16:29
Raw Shader Template for Threejs
import * as THREE from 'three';
class CustomMaterial extends THREE.RawShaderMaterial {
constructor( props={} ){
super();
// Merge custom props with default options
const opts = Object.assign(
{
offset : [ 0, 1, 0 ],
@sketchpunk
sketchpunk / clone_and_dispatch_events.js
Created April 2, 2025 20:14
Clone and Dispatch Events
// Clone an event then dispatch it to an HTML Element
function dispatchClonedEvent( e: Event, elm:HTMLElement ){
if( e.type.startsWith( 'pointer' ) ){
const evt = e as PointerEvent;
elm.dispatchEvent( new PointerEvent( evt.type, {
bubbles : evt.bubbles,
cancelable : evt.cancelable,
clientX : evt.clientX,
clientY : evt.clientY,
button : evt.button,
@sketchpunk
sketchpunk / NOAAColorRamp.ts
Created February 25, 2025 13:00 — forked from kenjinp/NOAAColorRamp.ts
This is the color schema I use in https://geomancer.kenny.wtf/
export const noaaRamp = [
{ color: "#ffffff", elevation: 8000 },
{ color: "#E0D7D0", elevation: 4000 },
{ color: "#CDB99C", elevation: 2000 },
{ color: "#BA9468", elevation: 1000 },
{ color: "#9B7E43", elevation: 500 },
{ color: "#75752D", elevation: 250 },
{ color: "#456C18", elevation: 50 },
{ color: "#175515", elevation: 10 },
{ color: "#004023", elevation: 0.1 },
@sketchpunk
sketchpunk / settings.json
Created February 17, 2025 21:18
VSCODE SETTINGS.JSON
{
// Disable copilot
"github.copilot.enable": {
"*": false,
"plaintext": false,
"markdown": false,
"scminput": false
},
// Fix NPM excution issues
@sketchpunk
sketchpunk / matrix_exp.py
Created January 20, 2025 14:59 — forked from N8python/matrix_exp.py
MLX matrix_exp.
import mlx.core as mx
@mx.compile
def _compute_T1(A):
"""I + A"""
return mx.eye(A.shape[-1]) + A
@mx.compile
def _compute_T2(A):
"""I + A + A^2/2"""
A2 = A @ A
return mx.eye(A.shape[-1]) + A + A2/2
@sketchpunk
sketchpunk / _main.js
Created November 14, 2024 23:08
Basic Template for using ThreeJS's TSL Compute with WebGL / GSLS Backend
<!DOCTYPE html><html lang="en"><head><title></title></head>
<style>canvas{ display:block; } body, html { padding:0px; margin:0px; width:100%; height:100%; }</style>
<body><script type="module">
// #region IMPORTS
import useForcedWebGL, { THREE, useDarkScene } from '../lib/useForcedWebGL.js';
// #endregion
// #region MAIN
let App = useDarkScene( useForcedWebGL() );
let Debug = {};
@sketchpunk
sketchpunk / GpuPrinter.cginc
Created August 12, 2024 14:05 — forked from FreyaHolmer/GpuPrinter.cginc
A unity shader .cginc to draw numbers in the fragment shader - see the first comment below for example usage!
///////////////////////////////////////////////////////////////////////////////
// ABOUT: A unity Shader .cginc to draw numbers in the fragment shader
// AUTHOR: Freya Holmér
// LICENSE: Use for whatever, commercial or otherwise!
// Don't hold me liable for issues though
// But pls credit me if it works super well <3
// LIMITATIONS: There's some precision loss beyond 3 decimal places
// CONTRIBUTORS: yes please! if you know a more precise way to get
// decimal digits then pls lemme know!
// GetDecimalSymbolAt() could use some more love/precision
@sketchpunk
sketchpunk / maths_resources.txt
Last active July 18, 2024 16:59
Math Resources
https://gdcvault.com/play/1020787/Math-for-Game-Programmers-Introduction
https://marctenbosch.com/quaternions/ // About Rotor instead of Quats
https://jacquesheunis.com/post/rotors/
https://www.youtube.com/watch?v=htYh-Tq7ZBI // Freya about vectors
https://math.okstate.edu/people/lebl/osu4013-f19/diffforms.pdf
https://www.youtube.com/watch?v=_pKxbNyjNe8&list=PLRlVmXqzHjUQARA37r4Qw3SHPqVXgqO6c // what is a tensors plus more
// OcTree with Morton Order
// based on http://marupeke296.com/COL_3D_No15_Octree.html
//
// +------+------+
// |\ 2 \ 3 \
// | +------+------+
// + |\ \ \
// |\| +------+------+
// | + | | |
// +0|\| 6 | 7 |
audioContainer: {
height: '30px',
overflow: 'hidden',
backgroundColor: '#26476F',
boxShadow: '0px 0px 5px 2px rgba( 0,0,0,0.55 )',
borderRadius: '4px',
color: '#ffffff',
},
audio: {