Re:Show HN: HN Avatars in 357 bytes
by romellem on Monday March 14, 2022 @12:29PM
(#30674449)
This is fun, and can easily be added as a userscript. I might look to do that a little later.
[ Parent
| on HN ]
// ==UserScript==
// @name HN icons
// @namespace https://news.ycombinator.com/*
// @version 0.1
// @description try to take over the world!
// @author some people on HN
// @match https://news.ycombinator.com/*
// @icon data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant none
// ==/UserScript==
(function() { // Initial concept is from: https://news.ycombinator.com/item?id=30668137 (tomxor) // The script we are using is from: https://news.ycombinator.com/item?id=30670079 (onion2k) 'use strict'; let observer = new IntersectionObserver( (entries) => { entries.forEach((entry, i) => { if (entry.isIntersecting) { const p = 2; const c = document.createElement('canvas'); const x = c.getContext('2d'); c.width = 18; c.height = 14; const s = entry.target.innerText; const r = 1;
if (s) {
for (
let s = entry.target.innerText, r = 1, i = 28 + s.length;
i--;
) {
// xorshift32
(r ^= r << 13), (r ^= r >>> 17), (r ^= r << 5);
const X = i & 3,
Y = i >> 2;
if (i >= 28) {
// seed state
r += s.charCodeAt(i - 28);
x.fillStyle =
'#' + ((r >> 8) & 0xffffff).toString(16).padStart(0, 6);
} else {
// draw pixel
if (r >>> 29 > (X * X) / 3 + Y / 2)
x.fillRect(p * 3 + p * X, p * Y, p, p),
x.fillRect(p * 3 - p * X, p * Y, p, p);
}
}
}
entry.target.prepend(c);
} else {
if (entry.target.firstChild.tagName === 'CANVAS')
entry.target.firstChild.remove();
}
});
},
{ rootMargin: '0px 0px 0px 0px' }
);
document.querySelectorAll('.hnuser').forEach((user) => {
observer.observe(user);
});the header formatting is broken. You should make a think on pastebin instead