JavaScript
语言:
JaveScriptBabelCoffeeScript
确定
'use strict';
function _slicedToArray(arr, i) {
if (Array.isArray(arr)) {
return arr;
} else if (Symbol.iterator in Object(arr)) {
var _arr = [];
var _n = true;
var _d = false;
var _e = undefined;
try {
for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
_arr.push(_s.value);
if (i && _arr.length === i) break;
}
} catch (err) {
_d = true;
_e = err;
} finally {
try {
if (!_n && _i['return']) _i['return']();
} finally {
if (_d) throw _e;
}
}
return _arr;
} else {
throw new TypeError('Invalid attempt to destructure non-iterable instance');
}
}
{
var t;
var raf;
(function() {
'use strict';
var loop = function() {
calc();
raf = window.requestAnimationFrame(loop);
};
var calc = function() {
for (var r = 0; r < 30000 / pix / pix / i; r++) {
p = pr.next();
if (p.done) {
window.cancelAnimationFrame(raf);
return;
}
var _p$value = _slicedToArray(p.value, 2);
j = _p$value[0];
i = _p$value[1];
draw();
}
};
var draw = function() {
var x = j % w;
var y = (j - x) / w;
ctx.fillStyle = 'hsla(' + Math.floor(i * 33) + ',100%,50%,.3)';
ctx.fillRect(x * pix, y * pix, pix, pix);
};
var preums = regeneratorRuntime.mark(function callee$1$0(max) {
var _i, _j;
return regeneratorRuntime.wrap(function callee$1$0$(context$2$0) {
while (1) switch (context$2$0.prev = context$2$0.next) {
case 0:
_i = 2;
case 1:
if (!(_i < max / 2)) {
context$2$0.next = 12;
break;
}
_j = _i * 2;
case 3:
if (!(_j < max)) {
context$2$0.next = 9;
break;
}
context$2$0.next = 6;
return [_j, _i];
case 6:
_j += _i;
context$2$0.next = 3;
break;
case 9:
_i++;
context$2$0.next = 1;
break;
case 12:
case 'end':
return context$2$0.stop();
}
}, callee$1$0, this);
});
var resize = function() {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
w = Math.floor(window.innerWidth / pix);
h = Math.floor(window.innerHeight / pix);
max = w * h;
ctx.globalCompositeOperation = 'screen';
pr = preums(max);
ctx.fillStyle = '#fff';
ctx.textBaseline = 'middle';
ctx.textAlign = 'center';
for (var _i2 = 0; _i2 < max; _i2++) {
var x = _i2 % w;
var y = (_i2 - x) / w;
ctx.fillText(_i2, (x + 0.5) * pix, (y + 0.5) * pix, pix - 4);
}
ctx.fillStyle = 'hsla(0,100%,100%,0.5)';
ctx.fillRect(0, 0, pix, pix);
ctx.fillRect(pix, 0, pix, pix);
calc();
};
var canvas = document.createElement('canvas'),
ctx = canvas.getContext('2d'),
w = undefined,
//wiewport width
h = undefined,
//wiewport height
max = undefined,
init = Date.now(),
lineWidth = undefined,
hue = undefined,
pr = undefined,
p = undefined,
j = undefined,
i = 1,
pix = 20;
t = 2;
window.addEventListener('resize', function() {
resize();
});
resize();
loop();
document.body.appendChild(canvas);
})();
}