Joost Kiens JoostKiens

Senior Creative Front-end Developer ✌️

JoostKiens / autoplayVideoSupported.js

Last active October 18, 2018 13:35

Check if browser allows autoplaying of videos, https://webkit.org/blog/6784/new-video-policies-for-ios/

	function autoplayVideoSupported(muted = true, playsinline = true) {
	const v = document.createElement('video')
	v.muted = muted
	playsinline && v.setAttribute('playsinline', 'playsinline')
	v.setAttribute('width', 0)
	v.setAttribute('height', 0)
	v.style.opacity = 0
	document.querySelector('body').appendChild(v)
	return new Promise((resolve, reject) => {
	v.play()

JoostKiens / createUVWGrid.js

Created January 17, 2019 08:47

Create a 3D grid in uvw coordinates for THREE.js (pure function, no loops)

	const createUVWGrid = ([cx, cy, cz]) => {
	return times(cx).map(x => times(cy).map((y) => times(cz).map(z =>
	new THREE.Vector3(
	cx <= 1 ? 0.5 : x / (cx - 1),
	cy <= 1 ? 0.5 : y / (cy - 1),
	cz <= 1 ? 0.5 : z / (cz - 1)
	)
	))).flat(2)
	}

JoostKiens / useCookies.jsx

Created June 13, 2019 16:12

React useCookies hook with context provider

	import React from 'react'
	import Cookies from 'js-cookie'

	const CookiesContext = React.createContext(null)

	export function useCookies() {
	const cookies = React.useContext(CookiesContext)
	if (!cookies)
	throw new Error('Please make sure CookiesContextProvider is available')
	return cookies

JoostKiens / useScroll.jsx

Created June 13, 2019 16:14

React useScroll hook (window scrolling) returns scrollX & scrollY, with context provider

	import React from 'react'

	const ScrollContext = React.createContext(null)

	export function useScroll() {
	const scroll = React.useContext(ScrollContext)

	if (!scroll)
	throw new Error('Please make sure ScrollContextProvider is available')
	return scroll

JoostKiens / test2.json

Last active October 10, 2023 17:45

Flypath of Black-tailed godwit, last 2 years, from https://www.globalflywaynetwork.org/