)
}
}
)
(
}
{
)
)
(
)
(
(
{
}
)
(
)
}
)
)
{
(
(
)
)
}
)
(
} ### Super Simple Seeded Random

1. `let _seed = 1234567;`
2. ` `
3. `// Deterministic pseudo-random float in the interval [ 0, 1 ]`
4. `function seededRandom( s ) {`
5. `  if ( s !== undefined ) _seed = s % 2147483647;`
6. ` `
7. `  // Park-Miller algorithm`
8. `  _seed = _seed * 16807 % 2147483647;`
9. `  return ( _seed - 1 ) / 2147483646;`
10. `}`

Straight from the THREE.js source code – a fun and simple seeded random. The best libraries are always filled with gems like this…

If I were going to use this I would do a couple things out of pure preference:

1. `let seed = 1234567;`
2. ` `
3. `const setSeed = newSeed => seed = newSeed`
4. `function seededRand() {`
5. `  // Park-Miller algorithm`
6. `  seed *= 16807 % 0x7fffffff;`
7. `  return (seed - 1) / 0x7fffffff;`
8. `}`
9. ` `
10. `// try it out:`
11. ` `
12. `console.log('one', seededRand());`
13. `console.log('two', seededRand());`
14. `console.log('three', seededRand());`
15. ` `
16. `seed = 9999`
17. `console.log('one new seed', seededRand());`
18. `console.log('one new seed', seededRand());`
19. ` `
20. `seed = 1234567;`
21. `console.log('one old seed', seededRand());` ### Easy Hex Color Invert

1. `let color = 0xFFFF00;`
2. ` `
3. `function toHexString(col) { `
4. `  return '#' + ('000000' + col.toString(16)).substr(-6);`
5. `}`
6. ` `
7. `function onClick() {`
8. `  // invert the color`
9. `  color ^= 0xFFFFFF;`
10. `  document.body.style.background = toHexString(color);`
11. `}`
12. ` `
13. `onClick();`
14. ` `
15. `document.addEventListener('click', onClick);`
16. ` `
17. `console.log('try a different initial color');`
18. `console.log('click anywhere to invert background...');`

Easily invert a hex color. Expanding on yesterdays post – just one of many reasons you may want to work with colors in their integer form.

// color // hex // javascript // math // tricks ### Integers to Colors

1. `function toHexString(col) { `
2. `  return '#' + ('000000' + col.toString(16)).substr(-6);`
3. `}`
4. ` `
5. `document.body.style.background = toHexString(0x275ba1);`
6. ` `
7. `console.log("#275ba1 as an integer:", 0x275ba1);`
8. `console.log("#ff0000 as an integer:", 0xff0000);`

Convert an integer in hex (like `0xff0000`) to a usable hex string `"#ff0000"`. ### Canvas ImageData

1. `const canvas = document.body.appendChild(`
2. `  document.createElement('canvas')`
3. `);`
4. `const width = 200;`
5. `canvas.width = canvas.height = width;`
6. ` `
7. `const c = canvas.getContext('2d');`
8. `const pixels = c.createImageData(canvas.width, canvas.height);`
9. `const size = canvas.width * canvas.height;`
10. ` `
11. `let index = 0, x, y;`
12. ` `
13. `for (var i = 0; i < size; i++){`
14. `  x = i % width;`
15. `  y = Math.floor(i / width);`
16. ` `
17. `  pixels.data[index++] = x;`
18. `  pixels.data[index++] = y;`
19. `  pixels.data[index++] = width - x;`
20. `  pixels.data[index++] = 255;`
21. `}`
22. `c.putImageData(pixels, 0, 0);`

This shows how to set pixel data on an html5 canvas.

// canvas // color // graphics // hex // javascript // math ### toString Hack Obfuscated

1. `x=''+self `
2. `j=''`
3. `'d1d7a1712345691a7512d427b1da7d9ab7519a4b721a961721d694'`
4. `.split```
5. `.map(_=>j+=`x[0x\${_}]+`)`
6. `console.log(eval(j+'""'))`

Yesterday’s snippet saying something else…

It’s simpler than it looks:

1. `x=''+self `
2. `// becomes "[object Window]"`
3. ` `
4. `j='' `
5. `// initialize `j` which will be javascript to pass to `eval``
6. ` `
7. `'d1d7a17123456...' `
8. `// this is a list of index values to `
9. `// look up in `x` in hexidecimal so that each `
10. `// index is a single character`
11. ` `
12. `.split```
13. `// split the index values into an array `[0xe, 0x2 ...``
14. ` `
15. `.map(_=>j+=`x[0x\${_}]+`)`
16. `// map over the index values and write a string like`
17. `// this `x[0xe]+x[0x2]+...` into `j``
18. ` `
19. `console.log(eval(j+'""'))`
20. `// evaluate `j` with an empty string at the end`
21. `// `x[0xe]+x[0x2]+""` and log it out`
` snippet.zone ~ 2021-22 /// {s/z}