@pixel-normal-edit/mcp 2.0.10 → 2.2.0

package/domains/art-tree/lessons/ellipses/ellipse-orientations.js

@@ -0,0 +1,28 @@
+/**
+ * Auto-extracted from ellipse_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: Ellipse Orientations (Horizontal, Vertical, Tilted)
+ */
+function lessonEllipseOrientations(canvasSize = 32, color = '#2196f3') {
+  const commands = [];
+  const midY = Math.floor(canvasSize / 2);
+  const qX = Math.floor(canvasSize / 4);
+  const rLong = Math.floor(canvasSize * 0.2);
+  const rShort = Math.floor(canvasSize * 0.1);
+
+  // Horizontal (Left)
+  commands.push(shapes.drawEllipse(qX, midY, rLong, rShort, color, false));
+  
+  // Vertical (Middle)
+  commands.push(shapes.drawEllipse(qX * 2, midY, rShort, rLong, '#e91e63', false));
+  
+  // Tilted (Right) - 45 degrees
+  commands.push(...ellipseShapes.drawRotatedEllipse(qX * 3, midY, rLong, rShort, Math.PI / 4, '#4caf50'));
+
+  return commands;
+}
+
+module.exports = { lessonEllipseOrientations };

package/domains/art-tree/lessons/ellipses/ellipse-proportions.js

@@ -0,0 +1,27 @@
+/**
+ * Auto-extracted from ellipse_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: Ellipse Proportions (Wide vs Narrow)
+ */
+function lessonEllipseProportions(canvasSize = 32, color = '#ff9800') {
+  const commands = [];
+  const midY = Math.floor(canvasSize / 2);
+  const qX = Math.floor(canvasSize / 4);
+  const rx = Math.floor(canvasSize * 0.2);
+
+  // Wide Ellipse (Closer to a circle)
+  commands.push(shapes.drawEllipse(qX, midY, rx, Math.floor(rx * 0.8), color, false));
+  
+  // Medium Ellipse
+  commands.push(shapes.drawEllipse(qX * 2, midY, rx, Math.floor(rx * 0.4), '#9c27b0', false));
+  
+  // Narrow Ellipse (Almost a line)
+  commands.push(shapes.drawEllipse(qX * 3, midY, rx, Math.floor(rx * 0.1), '#f44336', false));
+
+  return commands;
+}
+
+module.exports = { lessonEllipseProportions };

package/domains/art-tree/lessons/hidden/hidden-box.js

@@ -0,0 +1,20 @@
+/**
+ * Auto-extracted from hidden_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: Hidden Box (6-sided box)
+ * You see 3 faces, but you must understand all 6.
+ */
+function lessonHiddenBox(canvasSize = 32, visibleColor = '#2196f3', hiddenColor = '#e0e0e0') {
+  const cx = Math.floor(canvasSize / 2);
+  const cy = Math.floor(canvasSize / 2);
+  const w = Math.floor(canvasSize * 0.4);
+  const h = Math.floor(canvasSize * 0.4);
+  const d = Math.floor(canvasSize * 0.4);
+
+  return hiddenShapes.drawXRayBox(cx, cy, w, h, d, visibleColor, hiddenColor);
+}
+
+module.exports = { lessonHiddenBox };

package/domains/art-tree/lessons/hidden/hidden-cup.js

@@ -0,0 +1,19 @@
+/**
+ * Auto-extracted from hidden_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: Hidden Cup (Cup and inner bottom)
+ * You don't see the full inside bottom, but must understand how the wall goes down.
+ */
+function lessonHiddenCup(canvasSize = 32, visibleColor = '#4caf50', hiddenColor = '#e0e0e0') {
+  const cx = Math.floor(canvasSize / 2);
+  const cy = Math.floor(canvasSize / 2);
+  const r = Math.floor(canvasSize * 0.25);
+  const h = Math.floor(canvasSize * 0.5);
+
+  return hiddenShapes.drawXRayCup(cx, cy, r, h, visibleColor, hiddenColor);
+}
+
+module.exports = { lessonHiddenCup };

package/domains/art-tree/lessons/hidden/hidden-head.js

@@ -0,0 +1,18 @@
+/**
+ * Auto-extracted from hidden_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: Hidden Head (Human head and skull)
+ * You don't see the whole skull, but must understand the structure behind it.
+ */
+function lessonHiddenHead(canvasSize = 32, visibleColor = '#ff5722', hiddenColor = '#e0e0e0') {
+  const cx = Math.floor(canvasSize / 2);
+  const cy = Math.floor(canvasSize * 0.4);
+  const r = Math.floor(canvasSize * 0.25);
+
+  return hiddenShapes.drawXRayHead(cx, cy, r, visibleColor, hiddenColor);
+}
+
+module.exports = { lessonHiddenHead };

package/domains/art-tree/lessons/index.js

@@ -0,0 +1,42 @@
+#!/usr/bin/env node
+/**
+ * lessons/index.js — Art Tree: Lessons Index
+ *
+ * Exports all lesson functions and catalog getters organized by category.
+ */
+
+const basic = require('./basic');
+const advanced = require('./advanced');
+const curves = require('./curves');
+const ellipses = require('./ellipses');
+const forms3d = require('./3d');
+const structure = require('./structure');
+const crossSections = require('./cross-sections');
+const transforms = require('./transforms');
+const surfaces = require('./surfaces');
+const perspective = require('./perspective');
+const hidden = require('./hidden');
+const lighting = require('./lighting');
+const materials = require('./materials');
+const analysis = require('./analysis');
+const layers = require('./layers');
+const sky = require('./sky');
+
+module.exports = {
+  ...basic,
+  ...advanced,
+  ...curves,
+  ...ellipses,
+  ...forms3d,
+  ...structure,
+  ...crossSections,
+  ...transforms,
+  ...surfaces,
+  ...perspective,
+  ...hidden,
+  ...lighting,
+  ...materials,
+  ...analysis,
+  ...layers,
+  ...sky,
+};

package/domains/art-tree/{layer_lessons.js → lessons/layers/layer-step.js}

@@ -1,4 +1,7 @@
-const layerShapes = require('./layer_shapes');
+/**
+ * Auto-extracted from layer_lessons.js
+ */
+const shapes = require('../../shapes');
 
 /**
  * Lesson: Layer Structure (Tư duy Layer)
@@ -15,18 +18,4 @@ function lessonLayerStep(canvasSize = 32, layerIndex = 1) {
   return layerShapes.drawLayeredCup(cx, cy, canvasSize, validLayer);
 }
 
-function getLayerLessonCatalog() {
-  return [
-    { 
-      id: 'layer_step', 
-      name: '7-Layer Painting Structure', 
-      description: 'View the contents of a specific layer of a Cup (1=Ref, 2=Sketch, 3=Construction, 4=Lineart, 5=Color, 6=Shadow, 7=Light)', 
-      fn: lessonLayerStep 
-    }
-  ];
-}
-
-module.exports = {
-  lessonLayerStep,
-  getLayerLessonCatalog
-};
+module.exports = { lessonLayerStep };

package/domains/art-tree/lessons/lighting/contact-shadow.js

@@ -0,0 +1,33 @@
+/**
+ * Auto-extracted from light_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: Contact Shadow (Point of contact shadow)
+ * The darkest area where an object touches the ground.
+ */
+function lessonContactShadow(canvasSize = 32) {
+  const commands = [];
+  const cx = Math.floor(canvasSize / 2);
+  const cy = Math.floor(canvasSize / 2);
+  const r = Math.floor(canvasSize * 0.3);
+
+  // Ground line
+  commands.push(shapes.drawLine(0, cy + r, canvasSize, cy + r, '#9e9e9e'));
+
+  // Sphere outline
+  commands.push(shapes.drawCircle(cx, cy, r, '#bdbdbd', false));
+
+  // Cast shadow (faint)
+  commands.push(shapes.drawEllipse(cx + Math.floor(r*0.5), cy + r, Math.floor(r*1.2), Math.floor(r*0.2), '#757575', true));
+
+  // CONTACT SHADOW (Pitch black, right at the touching point)
+  // Draw a very small, very dark ellipse directly under the center
+  commands.push(shapes.drawEllipse(cx, cy + r, Math.floor(r * 0.4), 2, '#000000', true));
+  commands.push(shapes.drawEllipse(cx, cy + r, Math.floor(r * 0.2), 1, '#000000', true));
+
+  return commands;
+}
+
+module.exports = { lessonContactShadow };

package/domains/art-tree/lessons/lighting/light-direction.js

@@ -0,0 +1,30 @@
+/**
+ * Auto-extracted from light_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: Light Direction & Intensity (Light direction and plane values)
+ * Shows a box with planes facing/turning away from light.
+ */
+function lessonLightDirection(canvasSize = 32) {
+  const commands = [];
+  const cx = Math.floor(canvasSize / 2);
+  const cy = Math.floor(canvasSize / 2);
+  const w = Math.floor(canvasSize * 0.25);
+  const h = Math.floor(canvasSize * 0.25);
+
+  // Light from top-left
+  const lightAngle = -Math.PI * 0.8; 
+  
+  const lx = cx - Math.floor(canvasSize * 0.35);
+  const ly = cy - Math.floor(canvasSize * 0.35);
+  commands.push(...lightShapes.drawLightSource(lx, ly, Math.floor(canvasSize * 0.05)));
+
+  // Draw shaded box
+  commands.push(...lightShapes.drawShadedBox(cx, cy, w, h, lightAngle));
+
+  return commands;
+}
+
+module.exports = { lessonLightDirection };

package/domains/art-tree/lessons/lighting/light-zones.js

@@ -0,0 +1,30 @@
+/**
+ * Auto-extracted from light_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: 6 Zones of Light (Sphere)
+ * Highlight, Light, Halftone, Core shadow, Reflected light, Cast shadow.
+ */
+function lessonLightZones(canvasSize = 32) {
+  const commands = [];
+  const cx = Math.floor(canvasSize / 2);
+  const cy = Math.floor(canvasSize / 2);
+  const r = Math.floor(canvasSize * 0.25);
+  
+  // Light from top-left (approx -45 degrees or -135 degrees mathematically)
+  const lightAngle = -Math.PI * 0.75; 
+
+  // Draw light source
+  const lx = cx + Math.floor(r * 2 * Math.cos(lightAngle));
+  const ly = cy + Math.floor(r * 2 * Math.sin(lightAngle));
+  commands.push(...lightShapes.drawLightSource(lx, ly, Math.floor(canvasSize * 0.05)));
+
+  // Draw shaded sphere
+  commands.push(...lightShapes.drawShadedSphere(cx, cy, r, lightAngle));
+
+  return commands;
+}
+
+module.exports = { lessonLightZones };

package/domains/art-tree/lessons/materials/material-glass.js

@@ -0,0 +1,21 @@
+/**
+ * Auto-extracted from material_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: Transparent (Glass)
+ * Demonstrates Fresnel effect, sharp reflections, and light transmission.
+ */
+function lessonMaterialGlass(canvasSize = 32) {
+  const commands = [];
+  const cx = Math.floor(canvasSize / 2);
+  const cy = Math.floor(canvasSize / 2);
+  const r = Math.floor(canvasSize * 0.35);
+
+  commands.push(...materialShapes.drawGlassSphere(cx, cy, r));
+
+  return commands;
+}
+
+module.exports = { lessonMaterialGlass };

package/domains/art-tree/lessons/materials/material-shiny.js

@@ -0,0 +1,26 @@
+/**
+ * Auto-extracted from material_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: Shiny vs Matte (Metal vs Plastic/Rubber)
+ * Compares high contrast sharp highlights vs low contrast diffused highlights.
+ */
+function lessonMaterialShiny(canvasSize = 32) {
+  const commands = [];
+  const cx1 = Math.floor(canvasSize * 0.3);
+  const cx2 = Math.floor(canvasSize * 0.7);
+  const cy = Math.floor(canvasSize / 2);
+  const r = Math.floor(canvasSize * 0.2);
+
+  // 1. Metal Sphere (Left)
+  commands.push(...materialShapes.drawMetalSphere(cx1, cy, r));
+
+  // 2. Matte/Plastic Sphere (Right)
+  commands.push(...materialShapes.drawMatteSphere(cx2, cy, r, '#e65100'));
+
+  return commands;
+}
+
+module.exports = { lessonMaterialShiny };

package/domains/art-tree/lessons/materials/material-texture.js

@@ -0,0 +1,26 @@
+/**
+ * Auto-extracted from material_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: Texture (Wood vs Stone)
+ * Compares organic lines vs rough cracks.
+ */
+function lessonMaterialTexture(canvasSize = 32) {
+  const commands = [];
+  const cx1 = Math.floor(canvasSize * 0.3);
+  const cx2 = Math.floor(canvasSize * 0.7);
+  const cy = Math.floor(canvasSize / 2);
+  const r = Math.floor(canvasSize * 0.2);
+
+  // 1. Wood Sphere (Left)
+  commands.push(...materialShapes.drawTexturedSphere(cx1, cy, r, 'wood'));
+
+  // 2. Stone Sphere (Right)
+  commands.push(...materialShapes.drawTexturedSphere(cx2, cy, r, 'stone'));
+
+  return commands;
+}
+
+module.exports = { lessonMaterialTexture };

package/domains/art-tree/lessons/perspective/1point-perspective.js

@@ -0,0 +1,30 @@
+/**
+ * Auto-extracted from perspective_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: 1-Point Perspective
+ */
+function lesson1PointPerspective(canvasSize = 32, color = '#2196f3') {
+  const commands = [];
+  const horizonY = Math.floor(canvasSize * 0.4);
+  const vpX = Math.floor(canvasSize * 0.5);
+  const vpY = horizonY;
+
+  // Horizon & VP
+  commands.push(...perspShapes.drawHorizon(canvasSize, horizonY));
+  commands.push(...perspShapes.drawVP(vpX, vpY));
+
+  // Box below horizon (seeing top face)
+  const w = Math.floor(canvasSize * 0.2);
+  const h = Math.floor(canvasSize * 0.15);
+  commands.push(...perspShapes.draw1PointBox(vpX, vpY, Math.floor(canvasSize * 0.2), horizonY + Math.floor(canvasSize * 0.2), w, h, 0.4, color));
+  
+  // Box above horizon (seeing bottom face)
+  commands.push(...perspShapes.draw1PointBox(vpX, vpY, Math.floor(canvasSize * 0.6), horizonY - Math.floor(canvasSize * 0.3), w, h, 0.4, '#e91e63'));
+
+  return commands;
+}
+
+module.exports = { lesson1PointPerspective };

package/domains/art-tree/lessons/perspective/2point-perspective.js

@@ -0,0 +1,30 @@
+/**
+ * Auto-extracted from perspective_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: 2-Point Perspective
+ */
+function lesson2PointPerspective(canvasSize = 32, color = '#4caf50') {
+  const commands = [];
+  const horizonY = Math.floor(canvasSize * 0.5);
+  const vp1X = Math.floor(canvasSize * 0.1);
+  const vp2X = Math.floor(canvasSize * 0.9);
+  
+  // Horizon & VPs
+  commands.push(...perspShapes.drawHorizon(canvasSize, horizonY));
+  commands.push(...perspShapes.drawVP(vp1X, horizonY));
+  commands.push(...perspShapes.drawVP(vp2X, horizonY));
+
+  // 2-Point Box straddling the horizon
+  const startX = Math.floor(canvasSize * 0.4);
+  const startY = Math.floor(canvasSize * 0.3);
+  const h = Math.floor(canvasSize * 0.4);
+  
+  commands.push(...perspShapes.draw2PointBox(vp1X, horizonY, vp2X, horizonY, startX, startY, h, 0.3, 0.4, color));
+
+  return commands;
+}
+
+module.exports = { lesson2PointPerspective };

package/domains/art-tree/lessons/perspective/3point-perspective.js

@@ -0,0 +1,45 @@
+/**
+ * Auto-extracted from perspective_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: 3-Point Perspective (Bird's eye view)
+ */
+function lesson3PointPerspective(canvasSize = 32, color = '#ff9800') {
+  const commands = [];
+  const horizonY = Math.floor(canvasSize * 0.2);
+  const vp1X = Math.floor(canvasSize * 0.1);
+  const vp2X = Math.floor(canvasSize * 0.9);
+  const vp3X = Math.floor(canvasSize * 0.5);
+  const vp3Y = Math.floor(canvasSize * 1.5); // VP3 far below (Bird's eye)
+  
+  // Horizon & VPs
+  commands.push(...perspShapes.drawHorizon(canvasSize, horizonY));
+  commands.push(...perspShapes.drawVP(vp1X, horizonY));
+  commands.push(...perspShapes.drawVP(vp2X, horizonY));
+  // VP3 is usually off-canvas, but we draw a line to it to show direction
+  
+  // We approximate a 3-point box by drawing converging vertical lines to VP3
+  const topY = Math.floor(canvasSize * 0.4);
+  const h = Math.floor(canvasSize * 0.4);
+  
+  // Center edge converging to VP3
+  commands.push(shapes.drawLine(vp3X, topY, vp3X, topY+h, color)); // simplified
+  commands.push(shapes.drawLine(vp3X, topY+h, vp3X, vp3Y, '#e0e0e0')); // Guide to VP3
+  
+  // Left and Right top edges to VP1, VP2
+  commands.push(shapes.drawLine(vp3X, topY, vp1X, horizonY, '#e0e0e0'));
+  commands.push(shapes.drawLine(vp3X, topY, vp2X, horizonY, '#e0e0e0'));
+  
+  // Draw the rest of the box structure to simulate 3-point
+  const lX = vp3X - Math.floor(canvasSize * 0.15);
+  const rX = vp3X + Math.floor(canvasSize * 0.2);
+  // Vertical edges also converge to VP3 slightly (foreshortening)
+  commands.push(shapes.drawLine(lX, topY + Math.floor(canvasSize * 0.1), lX + 2, topY + h, color));
+  commands.push(shapes.drawLine(rX, topY + Math.floor(canvasSize * 0.15), rX - 3, topY + h - 5, color));
+
+  return commands;
+}
+
+module.exports = { lesson3PointPerspective };

package/domains/art-tree/lessons/perspective/foreshortening.js

@@ -0,0 +1,38 @@
+/**
+ * Auto-extracted from perspective_lessons.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson: Foreshortening (Depth foreshortening)
+ * Drawing a cylinder pointing directly at the viewer
+ */
+function lessonForeshortening(canvasSize = 32, color = '#9c27b0') {
+  const commands = [];
+  const cx = Math.floor(canvasSize / 2);
+  const cy = Math.floor(canvasSize / 2);
+  
+  // Draw overlapping circles getting larger (coming towards viewer)
+  const numCircles = 5;
+  const maxR = Math.floor(canvasSize * 0.4);
+  const minR = Math.floor(canvasSize * 0.15);
+  
+  for(let i=0; i<numCircles; i++) {
+    const t = i / (numCircles - 1); // 0 to 1
+    // Radius grows exponentially to simulate perspective
+    const r = minR + (maxR - minR) * (t * t); 
+    // Y position shifts slightly to show overlap
+    const y = cy - Math.floor(canvasSize * 0.2) + Math.floor(canvasSize * 0.4 * t);
+    
+    // Draw the circle
+    commands.push(shapes.drawCircle(cx, y, Math.floor(r), color, false));
+  }
+  
+  // Draw bounding lines converging
+  commands.push(shapes.drawLine(cx - minR, cy - Math.floor(canvasSize * 0.2), cx - maxR, cy + Math.floor(canvasSize * 0.2), '#bdbdbd'));
+  commands.push(shapes.drawLine(cx + minR, cy - Math.floor(canvasSize * 0.2), cx + maxR, cy + Math.floor(canvasSize * 0.2), '#bdbdbd'));
+
+  return commands;
+}
+
+module.exports = { lessonForeshortening };

package/domains/art-tree/lessons/sky/sun-shapes.js

@@ -0,0 +1,25 @@
+/**
+ * Auto-extracted from sky_lessons_1.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson 1: Sun Shapes (Hình dạng mặt trời)
+ * Compares Basic, Soft, and Rays
+ */
+function lessonSunShapes(canvasSize = 32) {
+  const commands = [];
+  const y = Math.floor(canvasSize / 2);
+  const r = Math.floor(canvasSize * 0.15);
+
+  // Left: Basic
+  commands.push(...skyShapes1.drawSunBasic(Math.floor(canvasSize * 0.2), y, r));
+  // Center: Soft
+  commands.push(...skyShapes1.drawSunSoft(Math.floor(canvasSize * 0.5), y, r));
+  // Right: Rays
+  commands.push(...skyShapes1.drawSunRays(Math.floor(canvasSize * 0.8), y, r));
+
+  return commands;
+}
+
+module.exports = { lessonSunShapes };

package/domains/art-tree/lessons/sky/sunset-colors.js

@@ -0,0 +1,27 @@
+/**
+ * Auto-extracted from sky_lessons_1.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson 2: Sunset Colors (Màu sắc buổi chiều)
+ * Shows the progression of colors from blue to yellow
+ */
+function lessonSunsetColors(canvasSize = 32) {
+  const commands = [];
+  
+  // The classic sunset gradient: Blue -> Purple -> Pink -> Orange -> Yellow (top to bottom)
+  const sunsetPalette = [
+    '#3f51b5', // Blue
+    '#9c27b0', // Purple
+    '#e91e63', // Pink
+    '#ff9800', // Orange
+    '#ffeb3b'  // Yellow
+  ];
+
+  commands.push(...skyShapes1.drawSkyGradient(0, 0, canvasSize, canvasSize, sunsetPalette));
+
+  return commands;
+}
+
+module.exports = { lessonSunsetColors };

package/domains/art-tree/lessons/sky/sunset-sky.js

@@ -0,0 +1,32 @@
+/**
+ * Auto-extracted from sky_lessons_1.js
+ */
+const shapes = require('../../shapes');
+
+/**
+ * Lesson 3: Sunset Sky (Bầu trời hoàng hôn)
+ * Combines the gradient sky with a soft sun setting at the bottom
+ */
+function lessonSunsetSky(canvasSize = 32) {
+  const commands = [];
+  
+  // 1. Draw the Sky
+  const sunsetPalette = [
+    '#1a237e', // Dark Blue
+    '#512da8', // Deep Purple
+    '#c2185b', // Magenta
+    '#ff5722', // Deep Orange
+    '#ffb300'  // Amber
+  ];
+  commands.push(...skyShapes1.drawSkyGradient(0, 0, canvasSize, canvasSize, sunsetPalette));
+
+  // 2. Draw the Sun (Soft glowing sun near the bottom)
+  const cx = Math.floor(canvasSize / 2);
+  const cy = Math.floor(canvasSize * 0.8);
+  const r = Math.floor(canvasSize * 0.15);
+  commands.push(...skyShapes1.drawSunSoft(cx, cy, r));
+
+  return commands;
+}
+
+module.exports = { lessonSunsetSky };

package/domains/art-tree/{structure_lessons.js → lessons/structure/axis-orientation.js}

@@ -1,44 +1,7 @@
-const shapes = require('./shapes');
-const structureShapes = require('./structure_shapes');
-const shapes3d = require('./3d_shapes');
-const ellipseShapes = require('./ellipse_shapes');
-
-/**
- * Lesson: XYZ Axes (Vertical, Horizontal, Depth)
- */
-function lessonXYZAxes(canvasSize = 32, color = '#2196f3') {
-  const commands = [];
-  const cx = Math.floor(canvasSize / 2);
-  const cy = Math.floor(canvasSize / 2);
-  const length = Math.floor(canvasSize * 0.4);
-
-  // Draw the axes
-  commands.push(...structureShapes.drawXYZAxes(cx, cy, length));
-  
-  // Draw a simple box aligned with these axes to show how objects follow them
-  const w = Math.floor(length * 0.5);
-  const h = Math.floor(length * 0.5);
-  const d = Math.floor(length * 0.5);
-  // Using a lighter color for the reference box
-  commands.push(...shapes3d.drawWireframeBox(cx + Math.floor(w/2), cy - Math.floor(h/2), w, h, d, '#e0e0e0'));
-
-  return commands;
-}
-
 /**
- * Lesson: Complex Structure Analysis (e.g. A Bottle)
+ * Auto-extracted from structure_lessons.js
  */
-function lessonComplexStructure(canvasSize = 32, color = '#9c27b0') {
-  const commands = [];
-  const cx = Math.floor(canvasSize / 2);
-  const cy = Math.floor(canvasSize / 2);
-  const totalHeight = Math.floor(canvasSize * 0.8);
-
-  // Draw bottle structure showing cross-sections and central axis
-  commands.push(...structureShapes.drawBottleAnatomy(cx, cy, totalHeight, color));
-
-  return commands;
-}
+const shapes = require('../../shapes');
 
 /**
  * Lesson: Axis Orientation (Object pointing along different axes)
@@ -86,17 +49,4 @@ function lessonAxisOrientation(canvasSize = 32, color = '#00bcd4') {
   return commands;
 }
 
-function getStructureLessonCatalog() {
-  return [
-    { id: 'structure_xyz', name: 'XYZ Axes', description: 'Understanding 3D space directions (Vertical, Horizontal, Depth)', fn: lessonXYZAxes },
-    { id: 'structure_bottle', name: 'Complex Structure (Bottle)', description: 'Analyzing an object using a central axis and multiple cross-sections', fn: lessonComplexStructure },
-    { id: 'structure_orientation', name: 'Axis Orientation', description: 'Identifying which axis an object is oriented along', fn: lessonAxisOrientation },
-  ];
-}
-
-module.exports = {
-  lessonXYZAxes,
-  lessonComplexStructure,
-  lessonAxisOrientation,
-  getStructureLessonCatalog
-};
+module.exports = { lessonAxisOrientation };