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