This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Sobel Edge Detection Filter | |
// GLSL Fragment Shader | |
// Implementation by Patrick Hebron | |
uniform sampler2D texture; | |
uniform float width; | |
uniform float height; | |
void make_kernel(inout vec4 n[9], sampler2D tex, vec2 coord) | |
{ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#version 300 es | |
#ifdef GL_FRAGMENT_PRECISION_HIGH | |
precision highp float; | |
#else | |
precision mediump float; | |
#endif | |
out vec4 outColor; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"env": { | |
"browser": true, | |
"node": true, | |
}, | |
"parserOptions": { | |
"ecmaVersion": 2020 | |
}, | |
"extends": [ | |
"airbnb", |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React, { useEffect } from 'react' | |
import gsap from 'gsap' | |
import { useFrame } from '@react-three/fiber' | |
// sync gsap raf to r3f raf | |
gsap.ticker.remove(gsap.updateRoot) | |
export const GsapTicker = () => { | |
const pg = React.useRef(0) | |
gsap.ticker.remove(gsap.updateRoot) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
this.geometry = new BufferGeometry() | |
const vertices = new Float32Array([ | |
-1.0, -1.0, | |
3.0, -1.0, | |
-1.0, 3.0, | |
]) | |
const uvs = new Float32Array([0, 0, 2, 0, 0, 2]) | |
this.geometry.setAttribute('uv', new BufferAttribute(uvs, 2)) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// inspired by https://github.com/jamieowen/three-material-modifier | |
// Kudos jam3 | |
// typescript, need to convert to js soon | |
import { UniformsUtils, IUniform } from 'three'; | |
export type Shader = { | |
// eslint-disable-next-line @typescript-eslint/no-explicit-any | |
uniforms: { [uniform: string]: IUniform<any> }; | |
vertexShader: string; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import * as THREE from "three" | |
// credits for the box-projecting shader code go to codercat (https://codercat.tk) | |
const worldposReplace = /* glsl */` | |
#if defined( USE_ENVMAP ) || defined( DISTANCE ) || defined ( USE_SHADOWMAP ) | |
vec4 worldPosition = modelMatrix * vec4( transformed, 1.0 ); | |
#ifdef BOX_PROJECTED_ENV_MAP | |
vWorldPosition = worldPosition.xyz; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
checkPerf() { | |
// performance test based on cpu performance | |
// higher score means worse performance | |
// based on Baptiste Briel's work: http://awams.bbriel.me/27 | |
// Copied from: https://gist.github.com/martinlaxenaire/27cf27f043ec5ce423ce165e283fc19a | |
let perf = 0; | |
const start = (performance || Date).now(); | |
let array = []; | |
for(let i = 0; i < 20000; i++) { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// An implementation of CSS `background-size: cover` | |
// using http://stackoverflow.com/a/6565988 | |
vec2 s = uScreenSize; // Screen | |
vec2 i = uBGSize; // Image | |
float rs = s.x / s.y; | |
float ri = i.x / i.y; | |
vec2 new = rs < ri ? vec2(i.x * s.y / i.y, s.y) : vec2(s.x, i.y * s.x / i.x); | |
vec2 offset = (rs < ri ? vec2((new.x - s.x) / 2.0, 0.0) : vec2(0.0, (new.y - s.y) / 2.0)) / new; | |
vec2 uv = vTexCoord * s / new + offset; | |
gl_FragColor = texture2D(uBGTex, uv); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import RN from 'random-number'; | |
let rand = RN.generator(); | |
let randInt = (min, max) => { | |
return rand(min, max, true); | |
}; | |
let randFloat = (min, max) => { | |
return rand(min, max, false); |
NewerOlder