Fibonacci Wave Sliders pattern for Fibonacci256 & Pixelblaze

Fibonacci-Wave-Sliders.js

export var hOffset = 0
export var vOffset = 1

export var hSpeed = 0.01
export var vSpeed = 0.01

export function sliderHSpeed(v) { hSpeed = v }
export function sliderVSpeed(v) { vSpeed = v }

export function beforeRender(delta) {
  hOffset += hSpeed * .02
  vOffset += vSpeed * .02
}

export function render2D(index, x, y) {
  f = physicalToFibonacci[index] / pixelCount
  
  h = wave((f - hOffset) * .1)
  s = 1
  v = wave(f * vOffset) // make pixels smoothly "blink", inner pixels slower, outer pixels faster
  
  v = v * v // increase contrast
  
  hsv(h, s, v)
}

// map from the pixels' physical index to fibonacci index: (radius * pixelCount), 0 in the center, 255 for the last, outermost pixel
var physicalToFibonacci = [ 0, 21, 42, 63, 84, 105, 126, 147, 168, 189, 210, 231, 252, 239, 218, 197, 176, 155, 134, 113, 92, 71, 50, 29, 8, 16, 37, 58, 79, 100, 121, 142, 163, 184, 205, 226, 247, 255, 234, 213, 192, 171, 150, 129, 108, 87, 66, 45, 24, 3, 11, 32, 53, 74, 95, 116, 137, 158, 179, 200, 221, 242, 250, 229, 208, 187, 166, 145, 124, 103, 82, 61, 40, 19, 6, 27, 48, 69, 90, 111, 132, 153, 174, 195, 216, 237, 245, 224, 203, 182, 161, 140, 119, 98, 77, 56, 35, 14, 1, 22, 43, 64, 85, 106, 127, 148, 169, 190, 211, 232, 253, 240, 219, 198, 177, 156, 135, 114, 93, 72, 51, 30, 9, 17, 38, 59, 80, 101, 122, 143, 164, 185, 206, 227, 248, 235, 214, 193, 172, 151, 130, 109, 88, 67, 46, 25, 4, 12, 33, 54, 75, 96, 117, 138, 159, 180, 201, 222, 243, 251, 230, 209, 188, 167, 146, 125, 104, 83, 62, 41, 20, 7, 28, 49, 70, 91, 112, 133, 154, 175, 196, 217, 238, 246, 225, 204, 183, 162, 141, 120, 99, 78, 57, 36, 15, 2, 23, 44, 65, 86, 107, 128, 149, 170, 191, 212, 233, 254, 241, 220, 199, 178, 157, 136, 115, 94, 73, 52, 31, 10, 18, 39, 60, 81, 102, 123, 144, 165, 186, 207, 228, 249, 236, 215, 194, 173, 152, 131, 110, 89, 68, 47, 26, 5, 13, 34, 55, 76, 97, 118, 139, 160, 181, 202, 223, 244 ];