"use strict";
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var canvas = document.getElementById("canva");
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
var ctx = canvas.getContext("2d");
var makeRandom = function makeRandom(to) {
return Math.random() * to;
};
var speedRandom = function speedRandom(x) {
return (Math.random() - 0.5) * x;
};
var mouse = { x: null, y: null };
var colors = ["#BA2D27", "#C45C43", "#1B8F9C", "#33090E", "#0C5963"];
var circles = [];
window.addEventListener("resize", function () {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
init();
});
window.addEventListener("mousemove", function (evt) {
mouse.x = evt.x;
mouse.y = evt.y;
});
var Circle = function () {
function Circle(x, y, radius, vx, vy, color) {
_classCallCheck(this, Circle);
this.x = x;
this.y = y;
this.radius = radius;
this.vx = vx;
this.vy = vy;
this.color = color;
}
_createClass(Circle, [{
key: "draw",
value: function draw() {
ctx.beginPath();
ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, false);
ctx.fillStyle = this.color;
ctx.strokeStyle = this.color;
ctx.fill();
ctx.stroke();
}
}, {
key: "updateMove",
value: function updateMove() {
if (this.x > window.innerWidth + this.radius && this.vx > 0) {
this.x = 0 - this.radius;
}
if (this.x < 0 - this.radius && this.vx < 0) {
this.x = window.innerWidth + this.radius;
}
if (this.y > window.innerHeight + this.radius && this.vy > 0) {
this.y = 0 - this.radius;
}
if (this.y < 0 - this.radius && this.vy < 0) {
this.y = window.innerHeight + this.radius;
}
this.x += this.vx;
this.y += this.vy;
this.makeSpecialCircle();
this.draw();
}
}, {
key: "makeSpecialCircle",
value: function makeSpecialCircle() {
var _this = this;
circles.forEach(function (circle, index) {
if (_this.x - circle.x < 150 && _this.x - circle.x > -150 && _this.y - circle.y < 150 && _this.y - circle.y > -150 && _this.radius !== circle.radius && _this.color === circle.color) {
ctx.beginPath();
ctx.moveTo(_this.x, _this.y);
ctx.lineTo(circle.x, circle.y);
ctx.strokeStyle = circle.color;
ctx.stroke();
}
});
}
}]);
return Circle;
}();
var makeCircles = function makeCircles(count, circle) {
var result = [];
for (var i = 0; i < count; i++) {
result.push(new Circle(makeRandom(circle.rdmX - circle.rdmR * 2) + circle.rdmR, makeRandom(circle.rdmY - circle.rdmR * 2) + circle.rdmR, makeRandom(circle.rdmR), speedRandom(circle.vx), speedRandom(circle.vy), colors[Math.floor(makeRandom(5))]));
}
return result;
};
var init = function init() {
circles = makeCircles(100, {
rdmX: window.innerWidth,
rdmY: window.innerHeight,
rdmR: 20,
vx: 2,
vy: 2
});
circles.forEach(function (circle) {
return circle.draw();
});
};
function animate() {
requestAnimationFrame(animate);
ctx.clearRect(0, 0, window.innerWidth, window.innerHeight);
circles.forEach(function (circle, i) {
circle.updateMove();
});
}
init();
animate();Travelled to 12 computer(s): aoiabmzegqzx, bhatertpkbcr, cbybwowwnfue, gwrvuhgaqvyk, ishqpsrjomds, lpdgvwnxivlt, mqqgnosmbjvj, pyentgdyhuwx, pzhvpgtvlbxg, tslmcundralx, tvejysmllsmz, vouqrxazstgt
No comments. add comment
| Snippet ID: | #1014798 |
| Snippet name: | circles.js |
| Eternal ID of this version: | #1014798/1 |
| Text MD5: | c62874ac13b4f022ad56d617da608722 |
| Author: | stefan |
| Category: | |
| Type: | Document |
| Public (visible to everyone): | Yes |
| Archived (hidden from active list): | No |
| Created/modified: | 2018-05-02 15:05:14 |
| Source code size: | 4071 bytes / 128 lines |
| Pitched / IR pitched: | No / No |
| Views / Downloads: | 563 / 428 |
| Referenced in: | [show references] |