aesthetic.computer
Monorepo for Aesthetic.Computer
aesthetic.computer
1// Complex test piece for real-time sixel rendering
2// Features: animations, gradients, shapes, text, and geometric patterns
3
4let frame = 0;
5
6export function paint(api) {
7 frame++;
8
9 // Clear with animated background color
10 const bgHue = (frame * 2) % 360;
11 api.wipe(`hsl(${bgHue}, 20%, 10%)`);
12
13 // Animated spiral pattern
14 const centerX = 64;
15 const centerY = 64;
16 const maxRadius = 40;
17
18 for (let i = 0; i < 20; i++) {
19 const angle = (frame * 0.1 + i * 0.3) % (Math.PI * 2);
20 const radius = (i / 20) * maxRadius;
21 const x = centerX + Math.cos(angle) * radius;
22 const y = centerY + Math.sin(angle) * radius;
23
24 // Rainbow colors
25 const hue = (i * 18 + frame * 5) % 360;
26 api.ink(`hsl(${hue}, 80%, 60%)`);
27 api.circle(x, y, 3 + Math.sin(frame * 0.2 + i) * 2);
28 }
29
30 // Animated border rectangles
31 for (let i = 0; i < 5; i++) {
32 const size = 10 + i * 20;
33 const offset = Math.sin(frame * 0.15 + i) * 5;
34 const hue = (frame * 3 + i * 60) % 360;
35
36 api.ink(`hsl(${hue}, 70%, 50%)`);
37 api.rect(
38 centerX - size/2 + offset,
39 centerY - size/2 + offset,
40 size,
41 size
42 );
43 }
44
45 // Animated waves at the top
46 api.ink('cyan');
47 for (let x = 0; x < 128; x += 2) {
48 const y = 20 + Math.sin(x * 0.1 + frame * 0.2) * 10;
49 api.point(x, y);
50 }
51
52 // Animated waves at the bottom
53 api.ink('yellow');
54 for (let x = 0; x < 128; x += 2) {
55 const y = 108 + Math.sin(x * 0.15 + frame * 0.3) * 8;
56 api.point(x, y);
57 }
58
59 // Moving text
60 const textX = 20 + Math.sin(frame * 0.1) * 15;
61 const textY = 15;
62 api.ink('white');
63 api.write(`Frame ${frame}`, textX, textY);
64
65 // Corner indicators
66 api.ink('red');
67 api.circle(5, 5, 3);
68 api.ink('green');
69 api.circle(123, 5, 3);
70 api.ink('blue');
71 api.circle(5, 123, 3);
72 api.ink('magenta');
73 api.circle(123, 123, 3);
74
75 // Geometric pattern in center
76 const time = frame * 0.1;
77 for (let i = 0; i < 8; i++) {
78 const angle = (i * Math.PI / 4) + time;
79 const x1 = centerX + Math.cos(angle) * 15;
80 const y1 = centerY + Math.sin(angle) * 15;
81 const x2 = centerX + Math.cos(angle + Math.PI) * 15;
82 const y2 = centerY + Math.sin(angle + Math.PI) * 15;
83
84 const hue = (i * 45 + frame * 2) % 360;
85 api.ink(`hsl(${hue}, 90%, 70%)`);
86 api.line(x1, y1, x2, y2);
87 }
88}
89
90export const meta = {
91 title: "Complex Real-time Test",
92 description: "Complex animated graphics for testing real-time sixel rendering"
93};