@pixel-normal-edit/mcp 2.0.7 → 2.0.10

package/domains/art-tree/surface_lessons.js

@@ -2,7 +2,7 @@ const shapes = require('./shapes');
 const surfaceShapes = require('./surface_shapes');
 
 /**
- * Lesson: Surface Types (Mặt phẳng, lồi, lõm)
+ * Lesson: Surface Types (Flat, convex, concave)
  */
 function lessonSurfaceTypes(canvasSize = 32, color = '#2196f3') {
   const commands = [];
@@ -10,20 +10,20 @@ function lessonSurfaceTypes(canvasSize = 32, color = '#2196f3') {
   const qX = Math.floor(canvasSize / 4);
   const r = Math.floor(canvasSize * 0.15);
 
-  // 1. Flat Plane (Mặt phẳng)
+  // 1. Flat Plane
   const w = Math.floor(canvasSize * 0.2);
   commands.push(shapes.drawRectangle(qX - w/2, midY - w/2, w, w, '#4caf50', false));
   // Add some grid lines to show it's flat
   commands.push(shapes.drawLine(qX, midY - w/2, qX, midY + w/2, '#4caf50'));
   commands.push(shapes.drawLine(qX - w/2, midY, qX + w/2, midY, '#4caf50'));
 
-  // 2. Convex Surface (Mặt lồi - e.g. Dome/Sphere)
+  // 2. Convex Surface (e.g. Dome/Sphere)
   // We use an ellipse that curves outwards (downwards)
   commands.push(shapes.drawEllipse(qX * 2, midY, r, r, '#ff9800', false));
   // Cross contour curving DOWN (convex towards viewer)
   commands.push(shapes.drawEllipse(qX * 2, midY + Math.floor(r*0.2), r, Math.floor(r*0.3), '#ff9800', false));
 
-  // 3. Concave Surface (Mặt lõm - e.g. Bowl)
+  // 3. Concave Surface (e.g. Bowl)
   // Draw the top rim of a bowl
   commands.push(shapes.drawEllipse(qX * 3, midY, r, Math.floor(r*0.3), '#9c27b0', false));
   // Draw the bottom curve (the inside of the bowl)
@@ -38,7 +38,7 @@ function lessonSurfaceTypes(canvasSize = 32, color = '#2196f3') {
 }
 
 /**
- * Lesson: Edge Types (Cạnh cứng vuông vức vs Cạnh mềm bo góc)
+ * Lesson: Edge Types (Hard sharp corners vs Soft rounded edges)
  */
 function lessonEdgeTypes(canvasSize = 32, color = '#ff5722') {
   const commands = [];
@@ -47,10 +47,10 @@ function lessonEdgeTypes(canvasSize = 32, color = '#ff5722') {
   const midY = Math.floor(canvasSize / 2);
   const w = Math.floor(canvasSize * 0.25);
 
-  // 1. Hard Edge (Cạnh cứng - Sharp corners)
+  // 1. Hard Edge (Sharp corners)
   commands.push(shapes.drawRectangle(qX1 - w/2, midY - w/2, w, w, '#e91e63', false));
 
-  // 2. Soft Edge / Transitional (Cạnh mềm / Mặt chuyển tiếp)
+  // 2. Soft Edge / Transitional
   // Draw a box with rounded corners (fillet)
   const r = Math.floor(w * 0.2); // Corner radius
   const rx = qX2 - w/2;

package/domains/art-tree/tools.js

@@ -96,126 +96,126 @@ function register(server) {
   // ── Lesson Tools ──────────────────────────────────────────────────────
 
   registerTool(server, 'art_tree_lesson_lines',
-    'Lesson: Vẽ đường thẳng — Introduction to drawing straight lines',
+    'Lesson: Lines — Introduction to drawing straight lines',
     { canvasSize: z.number().int().min(16).max(64).default(32),
       color: hexColor.default('#ff0000') },
     async (p) => {
       const commands = lessons.lessonLines(p.canvasSize, p.color);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học đường thẳng hoàn thành (${commands.length} nét vẽ)` }] };
+      return { content: [{ type: 'text', text: `✓ Lines lesson completed (${commands.length} strokes)` }] };
     });
 
   registerTool(server, 'art_tree_lesson_squares',
-    'Lesson: Hình vuông & Hình chữ nhật — Understanding right angles and proportions',
+    'Lesson: Squares & Rectangles — Understanding right angles and proportions',
     { canvasSize: z.number().int().min(16).max(64).default(32),
       color: hexColor.default('#1565c0') },
     async (p) => {
       const commands = lessons.lessonSquares(p.canvasSize, p.color);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học hình vuông & chữ nhật hoàn thành (${commands.length} nét vẽ)` }] };
+      return { content: [{ type: 'text', text: `✓ Squares & Rectangles lesson completed (${commands.length} strokes)` }] };
     });
 
   registerTool(server, 'art_tree_lesson_circles',
-    'Lesson: Hình tròn — Learning curves and symmetry',
+    'Lesson: Circles — Learning curves and symmetry',
     { canvasSize: z.number().int().min(16).max(64).default(32),
       color: hexColor.default('#e91e63') },
     async (p) => {
       const commands = lessons.lessonCircles(p.canvasSize, p.color);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học hình tròn hoàn thành (${commands.length} nét vẽ)` }] };
+      return { content: [{ type: 'text', text: `✓ Circles lesson completed (${commands.length} strokes)` }] };
     });
 
   registerTool(server, 'art_tree_lesson_ellipses',
-    'Lesson: Hình elip — Understanding oval shapes and proportions',
+    'Lesson: Ellipses — Understanding oval shapes and proportions',
     { canvasSize: z.number().int().min(16).max(64).default(32),
       color: hexColor.default('#9c27b0') },
     async (p) => {
       const commands = lessons.lessonEllipses(p.canvasSize, p.color);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học hình elip hoàn thành (${commands.length} nét vẽ)` }] };
+      return { content: [{ type: 'text', text: `✓ Ellipses lesson completed (${commands.length} strokes)` }] };
     });
 
   registerTool(server, 'art_tree_lesson_triangles',
-    'Lesson: Hình tam giác — Three-point shapes and stability',
+    'Lesson: Triangles — Three-point shapes and stability',
     { canvasSize: z.number().int().min(16).max(64).default(32),
       color: hexColor.default('#ff5722') },
     async (p) => {
       const commands = lessons.lessonTriangles(p.canvasSize, p.color);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học hình tam giác hoàn thành (${commands.length} nét vẽ)` }] };
+      return { content: [{ type: 'text', text: `✓ Triangles lesson completed (${commands.length} strokes)` }] };
     });
 
   registerTool(server, 'art_tree_lesson_polygons',
-    'Lesson: Đa giác — Multi-sided shapes',
+    'Lesson: Polygons — Multi-sided shapes',
     { canvasSize: z.number().int().min(16).max(64).default(32),
       color: hexColor.default('#607d8b') },
     async (p) => {
       const commands = lessons.lessonPolygons(p.canvasSize, p.color);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học đa giác hoàn thành (${commands.length} nét vẽ)` }] };
+      return { content: [{ type: 'text', text: `✓ Polygons lesson completed (${commands.length} strokes)` }] };
     });
 
   registerTool(server, 'art_tree_lesson_composition',
-    'Lesson: Tổng hợp — Combining basic shapes to create simple objects (house, sun, tree)',
+    'Lesson: Composition — Combining basic shapes to create simple objects (house, sun, tree)',
     { canvasSize: z.number().int().min(16).max(64).default(32) },
     async (p) => {
       const commands = lessons.lessonComposition(p.canvasSize);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học tổng hợp hoàn thành (${commands.length} nét vẽ)` }] };
+      return { content: [{ type: 'text', text: `✓ Composition lesson completed (${commands.length} strokes)` }] };
     });
 
   registerTool(server, 'art_tree_lesson_freehand',
-    'Lesson: Vẽ bằng tay — Luyện vẽ bằng tay, hạn chế dùng thước',
+    'Lesson: Freehand Drawing — Practice freehand drawing without rulers',
     { canvasSize: z.number().int().min(16).max(64).default(32), color: hexColor.default('#795548') },
     async (p) => {
       const commands = lessons.lessonFreehand(p.canvasSize, p.color);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học vẽ tay hoàn thành (${commands.length} đoạn thẳng nhỏ)` }] };
+      return { content: [{ type: 'text', text: `✓ Freehand drawing lesson completed (${commands.length} small segments)` }] };
     });
 
   registerTool(server, 'art_tree_lesson_proportions',
-    'Lesson: Tỉ lệ và góc — Tập giữ tỉ lệ và góc (Proportions and Angles)',
+    'Lesson: Proportions and Angles — Practice maintaining proportions and angles',
     { canvasSize: z.number().int().min(16).max(64).default(32), color: hexColor.default('#3f51b5') },
     async (p) => {
       const commands = lessons.lessonProportionsAndAngles(p.canvasSize, p.color);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học tỉ lệ và góc hoàn thành` }] };
+      return { content: [{ type: 'text', text: `✓ Proportions and Angles lesson completed` }] };
     });
 
   registerTool(server, 'art_tree_lesson_curves',
-    'Lesson: Đường cong — Đường cong C, S',
+    'Lesson: Curves — C-curves and S-curves',
     { canvasSize: z.number().int().min(16).max(64).default(32), color: hexColor.default('#9c27b0') },
     async (p) => {
       const commands = lessons.lessonCurves(p.canvasSize, p.color);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học đường cong C, S hoàn thành (${commands.length} nét)` }] };
+      return { content: [{ type: 'text', text: `✓ Curves (C, S) lesson completed (${commands.length} strokes)` }] };
     });
 
   registerTool(server, 'art_tree_lesson_spiral',
-    'Lesson: Xoắn ốc — Vẽ đường xoắn ốc',
+    'Lesson: Spiral — Drawing spiral curves',
     { canvasSize: z.number().int().min(16).max(64).default(32), color: hexColor.default('#ff9800') },
     async (p) => {
       const commands = lessons.lessonSpiral(p.canvasSize, p.color);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học xoắn ốc hoàn thành (${commands.length} nét)` }] };
+      return { content: [{ type: 'text', text: `✓ Spiral lesson completed (${commands.length} strokes)` }] };
     });
 
   registerTool(server, 'art_tree_lesson_strokes',
-    'Lesson: Các loại nét — Nét dài, nét ngắn, nét đậm–nhạt',
+    'Lesson: Stroke Types — Long strokes, short strokes, thick and thin lines',
     { canvasSize: z.number().int().min(16).max(64).default(32), color: hexColor.default('#2196f3') },
     async (p) => {
       const commands = lessons.lessonStrokes(p.canvasSize, p.color);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học nét vẽ hoàn thành` }] };
+      return { content: [{ type: 'text', text: `✓ Strokes lesson completed` }] };
     });
 
   registerTool(server, 'art_tree_lesson_parallel_intersecting',
-    'Lesson: Song song & giao nhau — Vẽ các đường song song và đường giao nhau',
+    'Lesson: Parallel & Intersecting Lines — Drawing parallel and intersecting lines',
     { canvasSize: z.number().int().min(16).max(64).default(32), color: hexColor.default('#00bcd4') },
     async (p) => {
       const commands = lessons.lessonParallelAndIntersecting(p.canvasSize, p.color);
       await Promise.all(commands.map(cmd => sendCommand(cmd)));
-      return { content: [{ type: 'text', text: `✓ Bài học song song và giao nhau hoàn thành` }] };
+      return { content: [{ type: 'text', text: `✓ Parallel & Intersecting Lines lesson completed` }] };
     });
 
   registerTool(server, 'art_tree_lesson_catalog',
@@ -226,7 +226,7 @@ function register(server) {
       const text = catalog.map(l =>
         `  • ${l.id}: ${l.name} — ${l.description}`
       ).join('\n');
-      return { content: [{ type: 'text', text: `📚 Danh sách bài học Art Tree:\n\n${text}` }] };
+      return { content: [{ type: 'text', text: `📚 Art Tree Lesson Catalog:\n\n${text}` }] };
     });
 }
 

package/domains/art-tree/transform_lessons_1.js

@@ -53,7 +53,7 @@ function lessonSquash(canvasSize = 32, color = '#ff9800') {
 }
 
 /**
- * Lesson: Taper & Swell (Thu nhỏ hoặc phình to)
+ * Lesson: Taper & Swell (Narrow or bulge)
  * Cylinder -> Bottle
  */
 function lessonTaperSwell(canvasSize = 32, color = '#00bcd4') {
@@ -80,7 +80,7 @@ function lessonTaperSwell(canvasSize = 32, color = '#00bcd4') {
 }
 
 /**
- * Lesson: Bend (Uốn cong)
+ * Lesson: Bend (Curved bending)
  * Cylinder -> Bent Tube
  */
 function lessonBend(canvasSize = 32, color = '#e91e63') {

package/domains/art-tree/transform_lessons_2.js

@@ -3,7 +3,7 @@ const transformShapes = require('./transform_shapes');
 const structureLessons = require('./structure_lessons');
 
 /**
- * Lesson: Rotate (Xoay)
+ * Lesson: Rotate (Rotation)
  * Analyzing how objects change when rotated around X, Y, Z axes.
  * We can reuse the Axis Orientation lesson as it perfectly demonstrates rotation.
  */
@@ -13,7 +13,7 @@ function lessonRotate(canvasSize = 32, color = '#ff5722') {
 }
 
 /**
- * Lesson: Cut (Cắt khối)
+ * Lesson: Cut (Slice a form)
  * Sphere -> Truncated Sphere (exposing internal cross-section)
  */
 function lessonCut(canvasSize = 32, color = '#8bc34a') {
@@ -32,7 +32,7 @@ function lessonCut(canvasSize = 32, color = '#8bc34a') {
 }
 
 /**
- * Lesson: Hollow (Khoét rỗng)
+ * Lesson: Hollow (Carve interior)
  * Cylinder -> Pipe/Hole
  */
 function lessonHollow(canvasSize = 32, color = '#3f51b5') {
@@ -50,7 +50,7 @@ function lessonHollow(canvasSize = 32, color = '#3f51b5') {
 }
 
 /**
- * Lesson: Combine (Ghép khối)
+ * Lesson: Combine (Merge forms)
  * Box + Cylinder (e.g., a wheel on an axle, or a tower on a base)
  */
 function lessonCombine(canvasSize = 32, color = '#607d8b') {

package/domains/art-tree/transform_tools.js

@@ -89,14 +89,14 @@ function register(server) {
     {},
     () => {
       const text = `📚 Transformation Lessons:
-  • transform_stretch: Stretch/Elongate (Cầu -> Trứng)
-  • transform_squash: Squash/Compress (Cầu -> Đĩa dẹt)
-  • transform_taper: Taper/Swell (Trụ -> Chai)
-  • transform_bend: Bend (Trụ -> Ống cong)
-  • transform_rotate: Rotate (Xoay 3D)
-  • transform_cut: Cut/Truncate (Cắt khối)
-  • transform_hollow: Hollow out (Khoét rỗng)
-  • transform_combine: Combine (Ghép khối)`;
+  • transform_stretch: Stretch/Elongate (Sphere -> Egg)
+  • transform_squash: Squash/Compress (Sphere -> Flat disc)
+  • transform_taper: Taper/Swell (Cylinder -> Bottle)
+  • transform_bend: Bend (Cylinder -> Bent tube)
+  • transform_rotate: Rotate (3D rotation analysis)
+  • transform_cut: Cut/Truncate (Slice a form)
+  • transform_hollow: Hollow out (Carve interior)
+  • transform_combine: Combine (Merge forms)`;
       return { content: [{ type: 'text', text }] };
     });
 }

package/domains/art-tree/vocab_lessons.js

@@ -0,0 +1,32 @@
+const vocabShapes = require('./vocab_shapes');
+
+/**
+ * Lesson: Visual Vocabulary - House Breakdown
+ * A 5-step process of recalling and drawing parts of an object.
+ * Users can supply the step number (1 to 5) to see the progressive breakdown.
+ */
+function lessonVocabHouse(canvasSize = 64, step = 1) {
+  const cx = Math.floor(canvasSize / 2);
+  const cy = Math.floor(canvasSize * 0.45);
+  
+  // Ensure step is between 1 and 5
+  const validStep = Math.max(1, Math.min(5, step));
+
+  return vocabShapes.drawHouseBreakdown(cx, cy, canvasSize, validStep);
+}
+
+function getVocabLessonCatalog() {
+  return [
+    { 
+      id: 'vocab_house', 
+      name: 'House Breakdown (5 Steps)', 
+      description: 'Break down a house: Masses -> Structural -> Functional -> Identity -> Materials. Supply step=1..5', 
+      fn: lessonVocabHouse 
+    }
+  ];
+}
+
+module.exports = {
+  lessonVocabHouse,
+  getVocabLessonCatalog
+};

package/domains/art-tree/vocab_shapes.js

@@ -0,0 +1,116 @@
+const shapes = require('./shapes');
+
+/**
+ * Draws a 5-step breakdown of a House.
+ * Step 1: Main Masses (Thân + Mái)
+ * Step 2: Structural Parts (Cột, Móng, Hiên/Bậc thềm)
+ * Step 3: Functional Parts (Cửa, Cửa sổ)
+ * Step 4: Identifying Details (Ống khói, Viền mái, Khung cửa)
+ * Step 5: Materials (Ván gỗ, Gạch)
+ */
+function drawHouseBreakdown(cx, cy, scale, step) {
+  const commands = [];
+  const color = '#37474f';
+  
+  const w = Math.floor(scale * 0.5);
+  const h = Math.floor(scale * 0.4);
+  const roofH = Math.floor(scale * 0.25);
+  
+  const leftX = cx - Math.floor(w/2);
+  const rightX = cx + Math.floor(w/2);
+  const topY = cy;
+  const botY = cy + h;
+  const roofTipY = topY - roofH;
+
+  // STEP 1: MAIN MASSES
+  if (step >= 1) {
+    // Main Body Box
+    commands.push(shapes.drawRectangle(leftX, topY, w, h, color, false));
+    // Roof Triangle
+    commands.push(shapes.drawLine(leftX, topY, cx, roofTipY, color));
+    commands.push(shapes.drawLine(cx, roofTipY, rightX, topY, color));
+  }
+
+  // STEP 2: STRUCTURAL PARTS
+  if (step >= 2) {
+    // Corner Columns (Cột)
+    commands.push(shapes.drawLine(leftX - 4, topY, leftX - 4, botY, color));
+    commands.push(shapes.drawLine(rightX + 4, topY, rightX + 4, botY, color));
+    // Foundation (Móng)
+    commands.push(shapes.drawRectangle(leftX - 6, botY, w + 12, 5, color, false));
+    // Front Porch Steps (Bậc thềm)
+    const pW = Math.floor(w * 0.4);
+    const pX = cx - Math.floor(pW/2);
+    commands.push(shapes.drawRectangle(pX, botY + 5, pW, 4, color, false));
+    commands.push(shapes.drawRectangle(pX - 2, botY + 9, pW + 4, 4, color, false));
+  }
+
+  // STEP 3: FUNCTIONAL PARTS
+  if (step >= 3) {
+    // Door (Cửa ra vào)
+    const dW = Math.floor(w * 0.25);
+    const dH = Math.floor(h * 0.6);
+    const dX = cx - Math.floor(dW/2);
+    commands.push(shapes.drawRectangle(dX, botY - dH, dW, dH, color, false));
+    
+    // Windows (Cửa sổ)
+    const winW = Math.floor(w * 0.2);
+    const winH = Math.floor(h * 0.35);
+    const winY = topY + Math.floor(h * 0.2);
+    // Left window
+    commands.push(shapes.drawRectangle(leftX + 8, winY, winW, winH, color, false));
+    // Right window
+    commands.push(shapes.drawRectangle(rightX - 8 - winW, winY, winW, winH, color, false));
+  }
+
+  // STEP 4: IDENTIFYING DETAILS
+  if (step >= 4) {
+    // Chimney (Ống khói)
+    const chimW = Math.floor(w * 0.15);
+    const chimX = leftX + Math.floor(w * 0.1);
+    const chimY = topY - Math.floor(roofH * 0.6);
+    commands.push(shapes.drawRectangle(chimX, chimY, chimW, Math.floor(roofH * 0.5), color, false));
+    commands.push(shapes.drawRectangle(chimX - 2, chimY - 4, chimW + 4, 4, color, false)); // Chimney cap
+    
+    // Roof Trim (Viền mái)
+    commands.push(shapes.drawLine(leftX - 6, topY + 4, cx, roofTipY - 6, color));
+    commands.push(shapes.drawLine(cx, roofTipY - 6, rightX + 6, topY + 4, color));
+    
+    // Window/Door Frames & Knobs (Khung cửa)
+    const winW = Math.floor(w * 0.2);
+    const winH = Math.floor(h * 0.35);
+    const winY = topY + Math.floor(h * 0.2);
+    // Left window cross
+    commands.push(shapes.drawLine(leftX + 8 + Math.floor(winW/2), winY, leftX + 8 + Math.floor(winW/2), winY + winH, color));
+    commands.push(shapes.drawLine(leftX + 8, winY + Math.floor(winH/2), leftX + 8 + winW, winY + Math.floor(winH/2), color));
+    // Right window cross
+    commands.push(shapes.drawLine(rightX - 8 - Math.floor(winW/2), winY, rightX - 8 - Math.floor(winW/2), winY + winH, color));
+    commands.push(shapes.drawLine(rightX - 8 - winW, winY + Math.floor(winH/2), rightX - 8, winY + Math.floor(winH/2), color));
+    // Door knob
+    commands.push(shapes.drawCircle(cx + Math.floor(w * 0.08), botY - Math.floor(h * 0.3), 1, color, true));
+  }
+
+  // STEP 5: SURFACE MATERIALS
+  if (step >= 5) {
+    const matColor = '#9e9e9e';
+    // Wood Planks on the main body
+    for (let i = 1; i < 5; i++) {
+      const plankY = topY + i * Math.floor(h / 5);
+      commands.push(shapes.drawLine(leftX + 2, plankY, rightX - 2, plankY, matColor));
+    }
+    
+    // Brick lines on the chimney
+    const chimW = Math.floor(w * 0.15);
+    const chimX = leftX + Math.floor(w * 0.1);
+    const chimY = topY - Math.floor(roofH * 0.6);
+    commands.push(shapes.drawLine(chimX, chimY + 4, chimX + chimW, chimY + 4, matColor));
+    commands.push(shapes.drawLine(chimX, chimY + 8, chimX + chimW, chimY + 8, matColor));
+    commands.push(shapes.drawLine(chimX + 4, chimY + 4, chimX + 4, chimY + 8, matColor)); // vertical brick line
+  }
+
+  return commands;
+}
+
+module.exports = {
+  drawHouseBreakdown
+};

package/domains/art-tree/vocab_tools.js

@@ -0,0 +1,41 @@
+const { z } = require('zod');
+const { registerTool, sendCommand } = require('../../core/server');
+const vocabLessons = require('./vocab_lessons');
+
+/**
+ * Register all visual vocabulary tools on the MCP server.
+ * @param {McpServer} server
+ */
+function register(server) {
+  registerTool(server, 'art_tree_lesson_vocab_house',
+    'Lesson: Visual Vocabulary - 5-Step Breakdown of a House. Pass step (1 to 5).',
+    { 
+      canvasSize: z.number().int().min(16).max(128).default(64),
+      step: z.number().int().min(1).max(5).describe('The breakdown step (1=Main Masses, 2=Structural, 3=Functional, 4=Identity, 5=Materials)')
+    },
+    async (p) => {
+      const commands = vocabLessons.lessonVocabHouse(p.canvasSize, p.step);
+      await Promise.all(commands.map(cmd => sendCommand(cmd)));
+      const steps = [
+        "1. Main Masses (Khối chính: Thân nhà, Mái)",
+        "2. Structural Parts (Bộ phận lớn: Cột, Móng, Bậc thềm)",
+        "3. Functional Parts (Chức năng: Cửa, Cửa sổ)",
+        "4. Identifying Details (Nhận diện: Ống khói, Viền mái, Khung cửa)",
+        "5. Surface Materials (Vật liệu: Ván gỗ, Gạch)"
+      ];
+      return { content: [{ type: 'text', text: `✓ Step ${p.step} Vocabulary breakdown completed:\n${steps[p.step - 1]}` }] };
+    });
+
+  registerTool(server, 'art_tree_lesson_vocab_catalog',
+    'Get the catalog of all available Visual Vocabulary lessons',
+    {},
+    () => {
+      const catalog = vocabLessons.getVocabLessonCatalog();
+      const text = catalog.map(l =>
+        `  • ${l.id}: ${l.name} — ${l.description}`
+      ).join('\n');
+      return { content: [{ type: 'text', text: `📚 Visual Vocabulary Lessons:\n\n${text}` }] };
+    });
+}
+
+module.exports = { register };

package/index.js

@@ -28,6 +28,7 @@ require('dotenv').config({ path: require('path').join(__dirname, '..', '.env') }
 const { createServer } = require('./core/server');
 const { registerAll: registerCoreTools } = require('./tools/index');
 const { registerAll: registerArtTree } = require('./domains/art-tree/index');
+const { registerAll: registerRules } = require('./rules/index');
 
 // ── Initialize ────────────────────────────────────────────────────────────
 const server = createServer();
@@ -35,6 +36,9 @@ const server = createServer();
 // ── Register Core Tools ───────────────────────────────────────────────────
 registerCoreTools(server);
 
+// ── Register Rules / Workflow Tools (BẮT BUỘC: chạy trước khi vẽ) ────────
+registerRules(server);
+
 // ── Register Domain Modules ───────────────────────────────────────────────
 registerArtTree(server);
 // Future domains: registerPixelArt(server), registerCharacterDrawing(server), etc.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pixel-normal-edit/mcp",
-  "version": "2.0.7",
+  "version": "2.0.10",
   "description": "MCP server for Pixel Normal Edit canvas - enables AI agents to draw pixel art",
   "main": "index.js",
   "bin": {