new p5(p => {
let tData = {
hash: "00000000839a8e6886ab5951d76f411475428afc90947ee320161bbf18eb6048",
lastBlock: 0,
idVariability: 6442168329254700655333774564790058229716727912617541056095553257796124352664
};
let dotPos = 0;
const getGradient = (factor, inter) => {
let o = p.color(247, p.map(factor, 0, 255, 100, 255), 30),
b = p.color(30, 30, p.map(factor, 0, 255, 255, 100));
return p.lerpColor(o, b, inter);
};
p.setup = () => {
let s = p.min(p.windowWidth, p.windowHeight);
p.createCanvas(s, s);
p.colorMode(p.RGB);
p.rectMode(p.CENTER);
};
p.draw = () => {
p.background(0);
let lH = p.height / 200, dS = p.width / 60, bS = p.width / 25;
let hF = p.int('0x' + tData.hash.substring(0, 2)),
baseCol = getGradient(hF, 0.5);
p.stroke(baseCol);
p.strokeWeight(lH);
p.line(0, p.height / 2, p.width, p.height / 2);
p.strokeWeight(dS);
let diag = p.sqrt(p.sq(p.width) + p.sq(p.height)),
dSpeed = p.map(tData.lastBlock, 0, 3600, 0.05, 1) * diag / 2000;
dotPos = (dotPos + dSpeed) % p.width;
p.point(dotPos, p.height / 2);
let dist = p.abs(p.width / 2 - dotPos),
glow = p.max(125, 255 - p.pow((dist / bS), 2) * 255);
glow = p.constrain(glow, 125, 255);
let boxCol = p.lerpColor(p.color(255, 140, 0), baseCol, glow / 255);
p.noStroke();
p.fill(boxCol);
p.rect(p.width / 2, p.height / 2, bS, bS);
let gS = p.width / 16, xOff = (p.width - gS * 16) / 2, yOff = (p.height - gS * 16) / 2;
let cShift = p.map(p.log(tData.idVariability), 0, 80, 0.005, 0.05);
for (let i = 0; i < 16; i++) {
for (let j = 0; j < 16; j++) {
let hSeg = tData.hash.substring(i % 32, (i % 32) + 2),
hF = p.int('0x' + hSeg),
minBS = gS / 32, maxBS = gS / 6,
varFactor = (tData.idVariability % 1e15) / 1e15,
blockS = p.lerp(minBS, maxBS, varFactor),
inter = p.sin(p.frameCount * cShift + (i + j) * p.PI / 16) * 0.5 + 0.5,
col = getGradient(hF, inter);
p.fill(col);
p.rect(xOff + gS * i + gS / 2, yOff + gS * j + gS / 2, blockS, blockS);
}
}
};
p.windowResized = () => {
let s = p.min(p.windowWidth, p.windowHeight);
p.resizeCanvas(s, s);
};
}, 'artDisplay');