Skip to content

Instantly share code, notes, and snippets.

Avatar

Tom Hicks tomhicks

View GitHub Profile
@tomhicks
tomhicks / spoingyHeaders.ts
Created Jun 20, 2019
Bouncy header helper functions
View spoingyHeaders.ts
import {Animated} from "react-native"
export function getSpoingyTransform(
scrollY: Animated.Value,
headerHeight: number,
) {
return [
{
translateY: scrollY.interpolate({
inputRange: [-headerHeight, 0, 1],
View SpoingyScrollView.tsx
import * as React from "react"
import {captureScroll, getSpoingyTransform} from "spoingyHelpers"
import {Animated} from "react-native"
const headerHeight = 300
export default () => {
// use an instance variable if using component classes
const scrollY = React.useRef(new Animated.Value(0)).current
@tomhicks
tomhicks / plink-plonk.js
Last active Sep 5, 2021
Listen to your web pages
View plink-plonk.js
@tomhicks
tomhicks / sweep-swoop.js
Last active Apr 17, 2020
Listen to your web pages
View sweep-swoop.js
const audioCtx = new window.AudioContext();
const oscillator = audioCtx.createOscillator();
oscillator.connect(audioCtx.destination);
oscillator.type = "sine";
let numItems = 0
oscillator.frequency.setValueAtTime(
1,
audioCtx.currentTime
@tomhicks
tomhicks / node-svm.cc
Created Feb 20, 2020
Node 12 node-svm fix
View node-svm.cc
#include "node-svm.h"
#include "training-worker.h"
#include "prediction-worker.h"
#include "probability-prediction-worker.h"
using v8::FunctionTemplate;
using v8::Object;
using v8::String;
using v8::Array;
@tomhicks
tomhicks / InternalLink.tsx
Created Jul 24, 2020
Strongly-typed NextJS internal links
View InternalLink.tsx
@tomhicks
tomhicks / useTaskQueue.ts
Created Jan 11, 2021
React Hook for queueing and processing async tasks sequentially
View useTaskQueue.ts
function useTaskQueue(params: {
shouldProcess: boolean
}): {
tasks: ReadonlyArray<Task>
isProcessing: boolean
addTask: (task: Task) => void
} {
const [queue, setQueue] = React.useState<{
isProcessing: boolean
tasks: Array<Task>
@tomhicks
tomhicks / useScreenShare.ts
Created Mar 17, 2021
How splitting useEffect calls simplifies code, and reduces bugs
View useScreenShare.ts
// ATTEMPT 1 - everything in one useEffect
React.useEffect(() => {
if (screenVideoTrack) {
createScreenShareOffer()
} else {
// 🐞 called before share, on mount
revokeScreenShareOffer()
}
// 🐞 called even if screen was never shared