4 ms·

None taken. Thank you for your feedback and the time you put in to show a different approach to the problem!

tomxor 5y ago
I'm glad :) and you're welcome.
tomxor 5y ago
I'm glad. Also, thank you, I actually had some fun hacking on this problem a bit more. Following is a script to annotate HN comments with deterministic avatars :) feel free to do with it as you please. Fixed one silly oversight: the original example just summed the unicode points of the username, but this has trivial collisions with other names (even on this thread), ideally the string should be hashed, so i've done a very simple made up hash by adding a nonlinear operation to xorshift to combine each code point (if you really care about collisions, use a proper hash like SHA256). Also added some colour and tweaked the sprite probability distribution. If you want a more sophisticated pattern, the part to play with is `if (r>>>29 > X**X/3+Y/2)`, the left hand side is the high 3 bits of the PRNG state (i.e random integer between 0 and 8), the right hand side is an arbitrary probability distribution, the current one just biases it towards the top center (squared on the horizontal). If you want a unit interval (a float between 0 and 1) rather than a 31bit uint for the random variable, you can get one with `(r>>>0)*2**-32`, but with a bit more computational cost. for (const u of document.querySelectorAll('.hnuser')) { const p=2; // seed state let s=u.innerText, r=1; for (let i=s.length; i--;) { // xorshift32 r^=r<<13, r^=r>>>17, r^=r<<5; // seed r+=s.charCodeAt(i); } // init canvas const c=document.createElement('canvas'); c.width=p*8, c.height=p*8; u.parentElement.prepend(c); const x=c.getContext('2d'); x.fillStyle='#'+(r>>8&0xFFFFFF) .toString(16).padStart(0, 6) // draw pixels for (let i=28; i--;) { // xorshift32 r^=r<<13, r^=r>>>17, r^=r<<5; // pixels const X=i&3, Y=i>>2; if (r>>>29 > X*X/3+Y/2) x.fillRect(p*3.5+p*X, p*0.5+p*Y, p, p), x.fillRect(p*3.5-p*X, p*0.5+p*Y, p, p); } } If you paste above in the console of any HN page you will get annotated usernames.
- vohu43 5y ago
  Nice job!

I'm glad :) and you're welcome.

I'm glad. Also, thank you, I actually had some fun hacking on this problem a bit more. Following is a script to annotate HN comments with deterministic avatars :) feel free to do with it as you please. Fixed one silly oversight: the original example just summed the unicode points of the username, but this has trivial collisions with other names (even on this thread), ideally the string should be hashed, so i've done a very simple made up hash by adding a nonlinear operation to xorshift to combine each code point (if you really care about collisions, use a proper hash like SHA256). Also added some colour and tweaked the sprite probability distribution. If you want a more sophisticated pattern, the part to play with is `if (r>>>29 > X**X/3+Y/2)`, the left hand side is the high 3 bits of the PRNG state (i.e random integer between 0 and 8), the right hand side is an arbitrary probability distribution, the current one just biases it towards the top center (squared on the horizontal). If you want a unit interval (a float between 0 and 1) rather than a 31bit uint for the random variable, you can get one with `(r>>>0)*2**-32`, but with a bit more computational cost. for (const u of document.querySelectorAll('.hnuser')) { const p=2; // seed state let s=u.innerText, r=1; for (let i=s.length; i--;) { // xorshift32 r^=r<<13, r^=r>>>17, r^=r<<5; // seed r+=s.charCodeAt(i); } // init canvas const c=document.createElement('canvas'); c.width=p*8, c.height=p*8; u.parentElement.prepend(c); const x=c.getContext('2d'); x.fillStyle='#'+(r>>8&0xFFFFFF) .toString(16).padStart(0, 6) // draw pixels for (let i=28; i--;) { // xorshift32 r^=r<<13, r^=r>>>17, r^=r<<5; // pixels const X=i&3, Y=i>>2; if (r>>>29 > X*X/3+Y/2) x.fillRect(p*3.5+p*X, p*0.5+p*Y, p, p), x.fillRect(p*3.5-p*X, p*0.5+p*Y, p, p); } } If you paste above in the console of any HN page you will get annotated usernames.

vohu43 5y ago
Nice job!