(function () {
var canvas = document.querySelector('canvas'),
+ r = Math.random,
+ pi = Math.PI,
+ cos = Math.cos,
+ sin = Math.sin,
context = canvas.getContext('2d'),
fps = 30,
lastFrame = 0,
speed = 1,
- size = 5 + rand(10),
- r = Math.random,
- pi = Math.PI;
+ size = 5 + rand(10);
var clear = !!(r() > 0.5);
var changeColor = !!(r() > 0.5);
var p = position(item);
context.beginPath();
context.moveTo(p.x, p.y);
- context.lineTo(p.x * 10 * Math.cos(item.angle), p.y * 10 * Math.sin(item.angle));
+ context.lineTo(p.x * 10 * cos(item.angle), p.y * 10 * sin(item.angle));
context.lineTo(rand(64), rand(64));
context.fill();
}
context.lineWidth = 5;
context.strokeStyle = `rgb(${item.color.join(',')})`;
context.moveTo(p.x, p.y);
- context.lineTo(p.x * 10 * Math.cos(item.angle), p.y * 10 * Math.sin(item.angle));
+ context.lineTo(p.x * 10 * cos(item.angle), p.y * 10 * sin(item.angle));
context.stroke();
}
return function (position) {
return {
- x: position.x + radius * Math.cos(lastFrame),
- y: position.y + radius * Math.sin(lastFrame)
+ x: position.x + radius * cos(lastFrame),
+ y: position.y + radius * sin(lastFrame)
}
}
}
function move(item) {
- item.x = item.x + speed * Math.cos(item.angle);
- item.y = item.y + speed * Math.sin(item.angle);
+ item.x = item.x + speed * cos(item.angle);
+ item.y = item.y + speed * sin(item.angle);
if (item.x < 0 || item.x > 64) {
- item.angle = Math.atan2(Math.sin(item.angle), -Math.cos(item.angle))
+ item.angle = Math.atan2(sin(item.angle), -cos(item.angle))
}
if (item.y < 0 || item.y > 64) {
- item.angle = Math.atan2(-Math.sin(item.angle), Math.cos(item.angle))
+ item.angle = Math.atan2(-sin(item.angle), cos(item.angle))
}
}