Me: "Write me some code compatible with turtletoy.net that generates an image celebrating my 200th turtle".
ChatGPT: "Here's a celebratory design in Turtletoy script style for your 200th turtle milestone! Would you like a version with curved petals or patterns inside a mandala (like rosettes or sine waves), or prefer keeping it minimal and geometric?"
Me: "Yes please, petals and patterns all the way, especially geometric."
ChatGPT: "Awesome! Let's go full celebratory"
On top of that, ChatGPT also explained why your jaw probably dropped seconds ago:
✅ Why This Is Cool
• Designed to avoid visual overlap
• Shows symmetry, radial balance, and a celebratory mood
• Can be expanded with more layers, shapes, or animation
• Fully readable and annotated for educational purposes
Log in to post a comment.
// 🐢 200th Turtle Celebration with Geometric Mandala
// ✨ Designed and written by ChatGPT (OpenAI) for a proud Turtletoy user
// 🎨 Featuring: bold digits, stars, burst, and a mandala ring
// 💡 All geometry carefully avoids visual overlap
const turtle = new Turtle(); // Create the turtle instance
let hasDrawn = false; // Flag to ensure drawing happens once only
function walk() {
// This is Turtletoy's main loop function.
// Returning false stops drawing after one pass.
if (hasDrawn) return false;
// Draw festive burst lines from the center
drawBurst();
// Draw bold, centered "200" using thick strokes
draw200();
// Draw ten small celebratory stars around the outer area
drawStars();
// Draw a geometric mandala ring from radius 50 to 80
// It includes petal-like triangles and diamond tiles
drawMandalaPetalRing(0, 0, 50, 80, 24, 3);
// Sine waves in the ring
drawMandalaSineWaves(0, 0, 65, 15, 6, 0);
drawMandalaSineWaves(0, 0, 65, 15, 6, 2 * Math.PI / 3);
drawMandalaSineWaves(0, 0, 65, 15, 6, 4 * Math.PI / 3);
// Drawing complete
hasDrawn = true;
return false;
}
// === BOLD "200" DIGITS ===
// Draws each digit with thickness by duplicating slightly offset strokes
function draw200() {
drawBoldDigit(-75, -20, drawDigit2); // Position and draw "2"
drawBoldDigit(-15, -20, drawDigit0); // First "0"
drawBoldDigit(45, -20, drawDigit0); // Second "0"
}
// Helper: Draws a digit multiple times offset for thickness
function drawBoldDigit(x, y, drawFn) {
const offsets = [[0, 0], [0.7, 0.7], [0.7, 0], [0, 0.7]];
for (let offset of offsets) {
turtle.penup();
turtle.goto(x + offset[0], y + offset[1]);
drawFn(); // Call the digit's drawing function
}
}
// Draws block-style "2"
function drawDigit2() {
turtle.setheading(0);
turtle.pendown();
turtle.forward(30);
turtle.right(90);
turtle.forward(20);
turtle.right(90);
turtle.forward(30);
turtle.left(90);
turtle.forward(20);
turtle.left(90);
turtle.forward(30);
turtle.penup();
}
// Draws block-style "0"
function drawDigit0() {
turtle.setheading(0);
turtle.pendown();
turtle.forward(30);
turtle.right(90);
turtle.forward(40);
turtle.right(90);
turtle.forward(30);
turtle.right(90);
turtle.forward(40);
turtle.right(90);
turtle.penup();
}
// === FIREWORK BURST ===
// Draws lines radiating out from center, like a firework or sunburst
function drawBurst() {
for (let i = 0; i < 36; i++) {
turtle.penup();
turtle.goto(0, 0); // Start at center
turtle.setheading(i * 10); // Rotate each line by 10°
turtle.forward(20); // Offset a bit before starting line
turtle.pendown();
turtle.forward(10); // Short burst line
}
}
// === CELEBRATORY STARS ===
// Ten stars placed around the outer edges of the canvas
function drawStars() {
const positions = [
[-80, 60], [-40, 80], [0, 90], [40, 80], [80, 60],
[-80, -60], [-40, -80], [0, -90], [40, -80], [80, -60]
];
for (const [x, y] of positions) {
drawStar(x, y, 5); // Small star radius
}
}
// Draws a classic 5-point star centered at (cx, cy)
function drawStar(cx, cy, size) {
turtle.penup();
turtle.goto(cx, cy);
turtle.setheading(0);
turtle.forward(size);
turtle.pendown();
turtle.right(162); // Start angle
for (let i = 0; i < 5; i++) {
turtle.forward(size * 2);
turtle.right(144); // Star point angle
}
turtle.penup();
}
// === GEOMETRIC MANDALA RING ===
// Draws petals and diamond tiles in a circular ring
// Spans from rInner to rOuter in multiple layers
function drawMandalaPetalRing(cx, cy, rInner, rOuter, petals, layers) {
for (let layer = 0; layer < layers; layer++) {
// Compute inner and outer radius for current layer
const r1 = rInner + ((rOuter - rInner) / layers) * layer;
const r2 = rInner + ((rOuter - rInner) / layers) * (layer + 1);
for (let i = 0; i < petals; i++) {
// Calculate angles and midpoints
const angle = (360 / petals) * i;
const midAngle = angle + (180 / petals);
// Petal triangle coordinates
const x1 = cx + r1 * Math.cos(angle * Math.PI / 180);
const y1 = cy + r1 * Math.sin(angle * Math.PI / 180);
const x2 = cx + r2 * Math.cos(midAngle * Math.PI / 180);
const y2 = cy + r2 * Math.sin(midAngle * Math.PI / 180);
const x3 = cx + r1 * Math.cos((angle + 360 / petals) * Math.PI / 180);
const y3 = cy + r1 * Math.sin((angle + 360 / petals) * Math.PI / 180);
// Draw the petal triangle
turtle.penup();
turtle.goto(x1, y1);
turtle.pendown();
turtle.goto(x2, y2);
turtle.goto(x3, y3);
turtle.goto(x1, y1);
turtle.penup();
// Now draw a diamond tile in the center of the petal
const d1 = 0.6 * (r2 - r1); // Width of the diamond
const midX = cx + ((r1 + r2) / 2) * Math.cos(midAngle * Math.PI / 180);
const midY = cy + ((r1 + r2) / 2) * Math.sin(midAngle * Math.PI / 180);
const angleRad = midAngle * Math.PI / 180;
// Diamond corners (perpendicular offsets)
const dx = d1 * Math.cos(angleRad + Math.PI / 2);
const dy = d1 * Math.sin(angleRad + Math.PI / 2);
// Four diamond points (adjusted for shape)
const p1 = [midX - dx, midY - dy];
const p2 = [midX + dx, midY + dy];
const p3 = [midX + dx * 0.6, midY + dy * 0.6];
const p4 = [midX - dx * 0.6, midY - dy * 0.6];
// Draw the diamond tile
turtle.penup();
turtle.goto(p1[0], p1[1]);
turtle.pendown();
turtle.goto(p3[0], p3[1]);
turtle.goto(p2[0], p2[1]);
turtle.goto(p4[0], p4[1]);
turtle.goto(p1[0], p1[1]);
turtle.penup();
}
}
}
// === Mandala Sine Waves ===
// Adds circular sine wave patterns around the center
// ChatGPT: This is where math meets mandala ✨
function drawMandalaSineWaves(cx, cy, baseRadius, amplitude, frequency, phase) {
const steps = 720; // Higher = smoother wave
const fullCircle = 2 * Math.PI;
turtle.penup();
for (let i = 0; i <= steps; i++) {
const t = i / steps;
const theta = fullCircle * t;
// Polar radius = base + sine wave
const r = baseRadius + amplitude * Math.sin(phase + frequency * theta);
// Convert polar to Cartesian
const x = cx + r * Math.cos(theta);
const y = cy + r * Math.sin(theta);
if (i === 0) {
turtle.goto(x, y);
turtle.pendown();
} else {
turtle.goto(x, y);
}
}
turtle.penup();
}