]>
Commit | Line | Data |
---|---|---|
21b1c71d RBR |
1 | (function () { |
2 | ||
3c30503b | 3 | var K = document.querySelector('canvas'), |
94949070 | 4 | { random: R, PI, cos: C, sin: S, floor, atan2: A } = Math, |
06f7a18a RBR |
5 | id = p => p, |
6 | spn = rad => p => ({ | |
7 | x: p.x + rad * C(l), | |
8 | y: p.y + rad * S(l) | |
9 | }), | |
cbf5b3fc | 10 | x = K.getContext('2d'), |
94949070 RBR |
11 | f = 24, |
12 | l = 0, | |
ae9ee3d8 | 13 | spd = 1, |
a1bf86e5 RBR |
14 | siz = 5 + r(10), |
15 | clr = R() > 0.5, | |
16 | ccl = R() > 0.5, | |
0d1072c6 | 17 | I = Array(r(10) + 6).fill().map(() => ({ |
a1bf86e5 RBR |
18 | x: r(64), |
19 | y: r(64), | |
20 | a: R() * 2 * PI, | |
21 | c: Array(3).fill(r(256)) | |
83c0fa69 | 22 | })), |
ad84fcff | 23 | H = [sqr, crc, hrt, chs, lch], |
0d1072c6 | 24 | P = [id, spn(5), spn(15)], |
ad84fcff | 25 | draw = H[r(H.length)], |
98bec09c | 26 | pos = P[r(P.length)] |
00bc4991 | 27 | |
55ca9087 RBR |
28 | function r(x) { |
29 | return floor(R() * x) | |
30 | } | |
31 | ||
32 | function sqr(i) { | |
33 | ||
34 | var p = pos(i) | |
35 | x.fillRect(p.x, p.y, siz, siz) | |
36 | } | |
37 | ||
38 | function crc(i) { | |
39 | ||
40 | var p = pos(i) | |
41 | x.beginPath() | |
42 | x.arc(p.x, p.y, siz / 2, 0, 2 * PI) | |
43 | x.fill() | |
44 | } | |
45 | ||
46 | function chs(i) { | |
47 | ||
48 | var p = pos(i) | |
49 | x.beginPath() | |
50 | x.moveTo(p.x, p.y) | |
51 | x.lineTo(p.x * 10 * C(i.a), p.y * 10 * S(i.a)) | |
52 | x.lineTo(r(64), r(64)) | |
53 | x.fill() | |
54 | } | |
55 | ||
56 | function lch(i) { | |
57 | ||
58 | var p = pos(i) | |
59 | x.beginPath() | |
60 | x.lineWidth = 5 | |
61 | x.strokeStyle = `rgb(${i.c.join(',')})` | |
62 | x.moveTo(p.x, p.y) | |
63 | x.lineTo(p.x * 10 * C(i.a), p.y * 10 * S(i.a)) | |
64 | x.stroke() | |
65 | } | |
66 | ||
67 | function hrt(i) { | |
68 | ||
69 | var p = pos(i) | |
70 | x.fillRect(p.x, p.y, siz, siz) | |
71 | ||
72 | x.beginPath() | |
73 | x.arc(p.x + siz / 2, p.y, siz / 2, 0, 2 * PI, false) | |
74 | x.fill() | |
75 | x.closePath() | |
76 | ||
77 | x.beginPath() | |
78 | x.arc(p.x + siz, p.y + siz / 2, siz / 2, 0, 2 * PI, false) | |
79 | x.fill() | |
80 | x.closePath() | |
81 | } | |
82 | ||
83 | function mov(i) { | |
84 | ||
85 | i.x = i.x + spd * C(i.a) | |
86 | i.y = i.y + spd * S(i.a) | |
87 | ||
88 | if (i.x < 0 || i.x > 64) { | |
89 | i.a = A(S(i.a), -C(i.a)) | |
90 | } | |
91 | if (i.y < 0 || i.y > 64) { | |
92 | i.a = A(-S(i.a), C(i.a)) | |
93 | } | |
94 | } | |
95 | ||
96 | function ucl(i) { | |
97 | i.c = i.c.map(c => (c + 5) % 256) | |
98 | } | |
99 | ||
100 | function frm(t) { | |
101 | ||
102 | window.requestAnimationFrame(frm) | |
103 | ||
104 | var dt = t - l | |
105 | ||
106 | if (dt > 1000 / f) { | |
107 | clr && x.clearRect(0, 0, 64, 64) | |
108 | for (var i of I) { | |
109 | x.fillStyle = `rgb(${i.c.join(',')})` | |
110 | draw(i) | |
111 | ccl && ucl(i) | |
112 | mov(i) | |
113 | } | |
114 | ||
115 | l = t | |
116 | } | |
117 | } | |
21b1c71d | 118 | |
98bec09c | 119 | frm() |
21b1c71d | 120 | } |
98bec09c | 121 | )() |