X-Git-Url: https://git.r.bdr.sh/rbdr/r.bdr.sh/blobdiff_plain/0d1072c6a737ec8d7b7cd456791eeb6e52f0e2b3..cbf5b3fca32814c8ec5179b15768b9c2edc018a0:/js/animation.js?ds=sidebyside diff --git a/js/animation.js b/js/animation.js index 3269500..4c005d6 100644 --- a/js/animation.js +++ b/js/animation.js @@ -2,7 +2,7 @@ var K = document.querySelector('canvas'), { random: R, PI, cos: c, sin: s, floor, atan2 } = Math, - ctx = K.getContext('2d'), + x = K.getContext('2d'), fps = 24, lst = 0, spd = 1, @@ -27,52 +27,52 @@ function sqr(i) { var p = pos(i); - ctx.fillRect(p.x, p.y, siz, siz); + x.fillRect(p.x, p.y, siz, siz); } function crc(i) { var p = pos(i); - ctx.beginPath(); - ctx.arc(p.x, p.y, siz / 2, 0, 2 * PI); - ctx.fill(); + x.beginPath(); + x.arc(p.x, p.y, siz / 2, 0, 2 * PI); + x.fill(); } function chs(i) { var p = pos(i); - ctx.beginPath(); - ctx.moveTo(p.x, p.y); - ctx.lineTo(p.x * 10 * c(i.a), p.y * 10 * s(i.a)); - ctx.lineTo(r(64), r(64)); - ctx.fill(); + x.beginPath(); + x.moveTo(p.x, p.y); + x.lineTo(p.x * 10 * c(i.a), p.y * 10 * s(i.a)); + x.lineTo(r(64), r(64)); + x.fill(); } function lch(i) { var p = pos(i); - ctx.beginPath(); - ctx.lineWidth = 5; - ctx.strokeStyle = `rgb(${i.c.join(',')})`; - ctx.moveTo(p.x, p.y); - ctx.lineTo(p.x * 10 * c(i.a), p.y * 10 * s(i.a)); - ctx.stroke(); + x.beginPath(); + x.lineWidth = 5; + x.strokeStyle = `rgb(${i.c.join(',')})`; + x.moveTo(p.x, p.y); + x.lineTo(p.x * 10 * c(i.a), p.y * 10 * s(i.a)); + x.stroke(); } function hrt(i) { var p = pos(i); - ctx.fillRect(p.x, p.y, siz, siz); + x.fillRect(p.x, p.y, siz, siz); - ctx.beginPath(); - ctx.arc(p.x + siz / 2, p.y, siz / 2, 0, 2 * PI, false); - ctx.fill(); - ctx.closePath(); + x.beginPath(); + x.arc(p.x + siz / 2, p.y, siz / 2, 0, 2 * PI, false); + x.fill(); + x.closePath(); - ctx.beginPath(); - ctx.arc(p.x + siz, p.y + siz / 2, siz / 2, 0, 2 * PI, false); - ctx.fill(); - ctx.closePath(); + x.beginPath(); + x.arc(p.x + siz, p.y + siz / 2, siz / 2, 0, 2 * PI, false); + x.fill(); + x.closePath(); } function id(p) { @@ -116,9 +116,9 @@ var dt = t - lst; if (dt > 1000 / fps) { - clr && ctx.clearRect(0, 0, 64, 64); + clr && x.clearRect(0, 0, 64, 64); for (var i of I) { - ctx.fillStyle = `rgb(${i.c.join(',')})`; + x.fillStyle = `rgb(${i.c.join(',')})`; draw(i); ccl && ucl(i); mov(i);