mcp-painter

Instructions

Implementation Reference

• index.ts:143-177 (handler)

  Handler logic for the 'drawing_getCanvasPng' tool. Checks if canvas exists, calls drawingTool.getCanvasPngBase64 to get base64 PNG, and returns it as ImageContent along with text description.
  case "drawing_getCanvasPng": // Updated tool name if (!currentCanvas) { return { content: [{ type: "text", text: "Error: No canvas generated. Please use 'drawing_generateCanvas' first.", }], isError: true, }; } try { const base64Png = await drawingTool.getCanvasPngBase64(currentCanvas); // Use getCanvasPngBase64 return { content: [ { type: "text", text: "PNG image of the canvas (base64 encoded):", // Informative text }, { type: "image", // Use 'image' content type data: base64Png, mimeType: "image/png", } as ImageContent, ], isError: false, }; } catch (error) { return { content: [{ type: "text", text: `Failed to get canvas PNG data: ${(error as Error).message}`, }], isError: true, }; }
• index.ts:59-67 (schema)

  Schema definition for the 'drawing_getCanvasPng' tool, including name, description, and empty input schema (no parameters required).
  { name: "drawing_getCanvasPng", // Changed name to reflect PNG output description: "Get the current drawing canvas as a PNG image (base64 encoded).", // Updated description inputSchema: { type: "object", properties: {}, // No input needed to get canvas data required: [], }, },
• index.ts:21-77 (registration)

  The TOOLS array where the 'drawing_getCanvasPng' tool is registered along with its schema. This array is used in the ListToolsRequestSchema handler.
  const TOOLS = [ { name: "drawing_generateCanvas", description: "Generate a new drawing canvas with specified width and height.", inputSchema: { type: "object", properties: { width: { type: "number", description: "Width of the canvas in pixels" }, height: { type: "number", description: "Height of the canvas in pixels" }, }, required: ["width", "height"], }, }, { name: "drawing_fillRectangle", description: "Fill a rectangle on the drawing canvas with a specified color and coordinates.", inputSchema: { type: "object", properties: { x: { type: "number", description: "X coordinate of the top-left corner of the rectangle" }, y: { type: "number", description: "Y coordinate of the top-left corner of the rectangle" }, width: { type: "number", description: "Width of the rectangle" }, height: { type: "number", description: "Height of the rectangle" }, color: { type: "object", description: "Color to fill the rectangle with (RGB)", properties: { r: { type: "number", description: "Red component (0-255)" }, g: { type: "number", description: "Green component (0-255)" }, b: { type: "number", description: "Blue component (0-255)" }, a: { type: "number", description: "Alpha component (0-255, optional, default 255)" }, }, required: ["r", "g", "b"], }, }, required: ["x", "y", "width", "height", "color"], }, }, { name: "drawing_getCanvasPng", // Changed name to reflect PNG output description: "Get the current drawing canvas as a PNG image (base64 encoded).", // Updated description inputSchema: { type: "object", properties: {}, // No input needed to get canvas data required: [], }, }, { name: "drawing_getCanvasData", description: "Get the current pixel data of the drawing canvas as JSON.", inputSchema: { type: "object", properties: {}, // No input needed to get canvas data required: [], }, }, ];
• drawingTool.ts:55-90 (helper)

  Core helper function in Canvas class that generates PNG from pixel data using pngjs, packs the PNG, and encodes it to base64 string.
  async getCanvasPngBase64(): Promise<string> { const png = new PNG({ width: this.width, height: this.height, bitDepth: 8, colorType: 6, // truecolor with alpha inputColorType: 6, }); for (let y = 0; y < this.height; y++) { for (let x = 0; x < this.width; x++) { const pixel = this.pixels[y][x]; const idx = (y * this.width + x) << 2; // Faster than * 4 png.data[idx] = pixel.r; png.data[idx + 1] = pixel.g; png.data[idx + 2] = pixel.b; png.data[idx + 3] = pixel.a; } } return new Promise<string>((resolve, reject) => { const chunks: Buffer[] = []; png.pack() .on('data', function(chunk) { chunks.push(chunk); }) .on('end', function() { const pngBuffer = Buffer.concat(chunks); const base64String = pngBuffer.toString('base64'); resolve(base64String); }) .on('error', function(error) { reject(error); }); }); }
• drawingTool.ts:116-121 (helper)

  Exported wrapper helper function getCanvasPngBase64 that validates the Canvas instance and delegates to the class method.
  function getCanvasPngBase64(canvas: Canvas): Promise<string> { if (!(canvas instanceof Canvas)) { throw new Error("Invalid canvas object provided."); } return canvas.getCanvasPngBase64(); }