|
;(function() { |
|
// recursively runs through Kaprekar Routine until |
|
// we hit a duplicate value (.: end of cycle) |
|
function step (cur, prev, i) { |
|
if (prev[cur]) return i - 1; |
|
else prev[cur] = true; |
|
var lo = String(cur).split('').sort(); |
|
var hi = lo.slice().reverse(); |
|
lo = +(lo.join('')); hi = +(hi.join('')); |
|
return step(hi - lo, prev, i + 1); |
|
} |
|
|
|
// initialization for the first step |
|
function kaprekar (num) { |
|
return step(num, {}, 0); |
|
} |
|
|
|
function download () { |
|
var img = canvas.toDataURL('image/png'); |
|
var imgLink = document.createElement('a'); |
|
imgLink.href = img; |
|
imgLink.download = 'kaprekar'; |
|
imgLink.click(); |
|
} |
|
|
|
var i, depth = 19; // max depth [0, 1M) = 19 |
|
var button = document.getElementById('go'); |
|
var canvas = document.createElement('canvas'); |
|
canvas.width = canvas.height = 1000; |
|
var ctx = canvas.getContext('2d'); |
|
|
|
// initialize a color array with evenly spaced values |
|
var c1 = [48, 213, 200], c2 = [44, 62, 80], delta = [], color = []; |
|
|
|
// calculate color deltas between depths |
|
for (i = 0; i < 3; i++) { |
|
delta.push((c2[i] - c1[i]) / depth); |
|
} |
|
|
|
// populate the color array |
|
for (i = 0; i < depth; i++) { |
|
color.push([ |
|
Math.round(c1[0] + delta[0] * i), |
|
Math.round(c1[1] + delta[1] * i), |
|
Math.round(c1[2] + delta[2] * i) |
|
]); |
|
} |
|
color.push(c2); |
|
// end color initialization |
|
|
|
button.addEventListener('click', function populate1M () { |
|
button.textContent = '0%'; |
|
|
|
// start timer & main loop |
|
var t1 = window.performance.now(), i = 0; |
|
|
|
setTimeout(function drawChunk () { // draws 1% of the canvas |
|
for (var c = 10000; c--; i++) { |
|
ctx.fillStyle = 'rgb(' + color[kaprekar(i)] + ')'; |
|
ctx.fillRect(i % 1000, Math.floor(i / 1000), 1, 1); |
|
} |
|
if (i < 1000000) { |
|
button.textContent = i / 10000 + '%'; |
|
setTimeout(drawChunk, 1); |
|
} else loopDone(); |
|
}, 1); |
|
|
|
function loopDone () { |
|
var t2 = window.performance.now(); |
|
download(); |
|
// log execution time in seconds |
|
console.log('Main loop execution took ' + |
|
((t2 - t1) / 1000).toFixed(2) + 's'); |
|
button.textContent = 'Regenerate'; |
|
} |
|
}, false); |
|
})(); |