Skip to content

Instantly share code, notes, and snippets.

View robksawyer's full-sized avatar
🎯
Focusing

Rob Sawyer robksawyer

🎯
Focusing
View GitHub Profile
@robksawyer
robksawyer / soap-bubble-frag.glsl
Created August 17, 2022 17:04
Soap bubble shader from http://otosatram.com/bubble.html (Bubbles on still soap (Blu blu))
precision highp float;
precision highp int;
#define SHADER_NAME ShaderMaterial
#define GAMMA_FACTOR 2
#define DOUBLE_SIDED
#define NUM_CLIPPING_PLANES 0
uniform mat4 viewMatrix;
uniform vec3 cameraPosition;
#define TONE_MAPPING
#define saturate(a) clamp( a, 0.0, 1.0 )
@robksawyer
robksawyer / rotation-example-slerp.js
Last active August 15, 2022 11:16
An example of how to convert Euler to Quaternions and use slerp for rotation.
// Rotations
const step = 'q1';
const cameraRotations = {
q1: {
x: 0.75,
y: 0,
z: 0,
},
q2A: {
x: -0,
@robksawyer
robksawyer / audioLoading.jsx
Created August 13, 2022 19:07
This snippet shows how to load audio with Three JS
const [sound, setSound] = useState()
const [listener, setListener] = useState()
const [analyser, setAnalyser] = useState()
const [data, setData] = useState(1)
// load a sound and set it as the Audio object's buffer
useEffect(() => {
const listener = new THREE.AudioListener()
setListener(listener)
const sound = new THREE.PositionalAudio(listener)
setSound(sound)
@robksawyer
robksawyer / shader-noise.glsl
Created August 1, 2022 14:07
A bunch of noise functions
//
// Description : Array and textureless GLSL 2D/3D/4D simplex
// noise functions.
// Author : Ian McEwan, Ashima Arts.
// Maintainer : stegu
// Lastmod : 20110822 (ijm)
// License : Copyright (C) 2011 Ashima Arts. All rights reserved.
// Distributed under the MIT License. See LICENSE file.
// https://github.com/ashima/webgl-noise
// https://github.com/stegu/webgl-noise
@robksawyer
robksawyer / CustomEffect.js
Last active July 29, 2022 04:00
Example template for a custom postprocessing effect.
import * as React from 'react';
import { Uniform } from 'three';
import { Effect } from 'postprocessing';
const fragmentShader = `
void mainImage(const in vec4 inputColor, const in vec2 uv, out vec4 outputColor) {
if (uv.y < .5) discard;
outputColor = vec4(vec3(average(inputColor.rgb)), inputColor.a);
}`;
let Web3 = require("web3");
// Replace value of rpc with https://rpc-mumbai.matic.today for Mumbai
let rpc = "https://rpc-mainnet.matic.network";
const provider = new Web3.providers.HttpProvider(rpc);
const web3 = new Web3(provider);
// Add your private key
web3.eth.accounts.wallet.add("pvt-key");
var _ = require('lodash');
...
Post
.findOne(req.param('id'))
.populate('user')
.populate('comments')
.then(function(post) {
var commentUsers = User.find({
@robksawyer
robksawyer / File.js
Created April 14, 2017 06:50
Example of a KeystoneJS File model using S3 for file uploads (with the original file name).
var keystone = require('keystone');
var Types = keystone.Field.Types;
var randToken = require('rand-token');
/**
* File Model
* ==========
*/
var File = new keystone.List('File', {
#define SHADER_NAME PolyhedronMaterial
precision highp float;
uniform sampler2D map;
uniform vec2 uvDisp;
uniform float time;
varying float smoothShading;
// varying vec3 viewPos;
varying vec2 vUV;
@robksawyer
robksawyer / effects.jsx
Last active November 30, 2020 15:18
react-three-fiber post-processing trial & errors
import React, { useEffect, useMemo } from 'react'
import { useFrame, useThree, extend, useLoader } from 'react-three-fiber'
import * as THREE from 'three'
import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer'
import { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass'
import { ShaderPass } from 'three/examples/jsm/postprocessing/ShaderPass'
// import { UnrealBloomPass } from 'three/examples/jsm/postprocessing/UnrealBloomPass'
import { FXAAShader } from 'three/examples/jsm/shaders/FXAAShader'