---

function setup() {
  createCanvas(500, 500, WEBGL);
}

function draw() {
  background(30); // Темный фон, чтобы пончики смотрелись круче
  orbitControl(); // Всё еще можно крутить всю сцену мышкой
  
  // Включаем свет и красивый материал
  lights();
  normalMaterial();
  
  // --- 1. РИСУЕМ БОЛЬШОЙ ВЕРТИКАЛЬНЫЙ ПОНЧИК ---
  push(); // Запоминаем начальную точку (центр экрана)
    // По умолчанию пончик лежит горизонтально. 
    // Поворачиваем его по оси X на 90 градусов (HALF_PI), чтобы он встал вертикально
    rotateX(HALF_PI); 
    // torus(радиус всего пончика, толщина самой колбаски)
    torus(120, 20); 
  pop(); // Сбрасываем поворот, возвращаемся в центр холста

  // --- 2. РИСУЕМ МАЛЕНЬКИЙ ПОНЧИК, КОТОРЫЙ КРУТИТСЯ ---
  push(); // Снова берем чистую точку отсчета в центре
    
    // Заставляем маленький пончик бегать по кругу большого пончика.
    // frameCount — это счетчик кадров, он постоянно растет и создает движение.
    // Умножаем на 0.02, чтобы движение было плавным, а не безумно быстрым.
    let angle = frameCount * 0.02; 
    
    // Вращаем саму ось координат, чтобы следующий translate сдвинул пончик по кругу
    rotateZ(angle); 
    
    // Сдвигаем маленький пончик на расстояние радиуса большого пончика (120 пикселей)
    translate(120, 0, 0); 
    
    // Делаем так, чтобы сам маленький пончик лежал горизонтально
    // (для этого вращаем его по его собственной оси X)
    rotateX(HALF_PI);
    
    // Рисуем маленький пончик (радиус 35, толщина 10)
    torus(35, 10);
  pop(); // Всё сбрасываем для следующего кадра
}