diff --git a/code.js b/code.js
index 46ae19b..56821fe 100644
--- a/code.js
+++ b/code.js
@@ -45,40 +45,91 @@ figma.ui.onmessage = async (msg) => {
});
break;
-case 'ai-generate':
- try {
- const response = await fetch('http://localhost:3001/api/generate-design', {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({ prompt: msg.prompt })
- });
- const result = await response.json();
+ case 'ai-generate':
+ try {
+ const response = await fetch('http://localhost:3001/api/generate-design', {
+ method: 'POST',
+ headers: { 'Content-Type': 'application/json' },
+ body: JSON.stringify({ prompt: msg.prompt })
+ });
+ const result = await response.json();
- for (const element of result.elements) {
- if (element.type === 'rectangle') {
- const rect = figma.createRectangle();
- rect.x = element.x;
- rect.y = element.y;
- rect.resize(element.width, element.height);
- rect.fills = [{ type: 'SOLID', color: element.color }];
- figma.currentPage.appendChild(rect);
+ for (const element of result.elements) {
+ if (element.type === 'rectangle') {
+ const rect = figma.createRectangle();
+ rect.x = element.x;
+ rect.y = element.y;
+ rect.resize(element.width, element.height);
+ rect.fills = [{ type: 'SOLID', color: element.color }];
+ figma.currentPage.appendChild(rect);
- } else if (element.type === 'text') {
- const textNode = figma.createText();
- await figma.loadFontAsync({ family: "Inter", style: "Regular" });
- textNode.characters = element.text;
- textNode.fontSize = element.fontSize || 20;
- textNode.x = element.x;
- textNode.y = element.y;
- figma.currentPage.appendChild(textNode);
+ } else if (element.type === 'text') {
+ const textNode = figma.createText();
+ await figma.loadFontAsync({ family: "Inter", style: "Regular" });
+ textNode.characters = element.text;
+ textNode.fontSize = element.fontSize || 20;
+ textNode.x = element.x;
+ textNode.y = element.y;
+ figma.currentPage.appendChild(textNode);
+ }
+ }
+
+ } catch (error) {
+ figma.ui.postMessage({ type: 'error', message: error.message });
}
- }
-
- } catch (error) {
- figma.ui.postMessage({ type: 'error', message: error.message });
- }
- break;
+ break;
+ case 'create-wireframe':
+ // Header
+ const header = figma.createRectangle();
+ header.resize(800, 80);
+ header.x = 100;
+ header.y = 100;
+ header.fills = [{ type: 'SOLID', color: { r: 0.9, g: 0.9, b: 0.9 } }];
+ header.name = 'Header';
+ figma.currentPage.appendChild(header);
+ // Header Text
+ const headerText = figma.createText();
+ await figma.loadFontAsync({ family: "Inter", style: "Regular" });
+ headerText.characters = "Header";
+ headerText.x = 120;
+ headerText.y = 130;
+ headerText.fontSize = 32;
+ figma.currentPage.appendChild(headerText);
+ // Content
+ const content = figma.createRectangle();
+ content.resize(800, 400);
+ content.x = 100;
+ content.y = 200;
+ content.fills = [{ type: 'SOLID', color: { r: 0.95, g: 0.95, b: 0.95 } }];
+ content.name = 'Content';
+ figma.currentPage.appendChild(content);
+ // Content Text
+ const contentText = figma.createText();
+ await figma.loadFontAsync({ family: "Inter", style: "Regular" });
+ contentText.characters = "Content";
+ contentText.x = 120;
+ contentText.y = 220;
+ contentText.fontSize = 24;
+ figma.currentPage.appendChild(contentText);
+ // Footer
+ const footer = figma.createRectangle();
+ footer.resize(800, 60);
+ footer.x = 100;
+ footer.y = 620;
+ footer.fills = [{ type: 'SOLID', color: { r: 0.85, g: 0.85, b: 0.85 } }];
+ footer.name = 'Footer';
+ figma.currentPage.appendChild(footer);
+ // Footer Text
+ const footerText = figma.createText();
+ await figma.loadFontAsync({ family: "Inter", style: "Regular" });
+ footerText.characters = "Footer";
+ footerText.x = 120;
+ footerText.y = 640;
+ footerText.fontSize = 20;
+ figma.currentPage.appendChild(footerText);
+ figma.viewport.scrollAndZoomIntoView([header, content, footer]);
+ break;
default:
console.log("Unknown message:", msg);
diff --git a/ui.html b/ui.html
index dcaf0d3..f9740a4 100644
--- a/ui.html
+++ b/ui.html
@@ -20,6 +20,7 @@
+