foliko 1.1.1 → 1.1.2

package/.agent/plugins/poster-plugin/src/components/ribbon.js

@@ -0,0 +1,193 @@
+/**
+ * 丝带/飘带组件
+ */
+
+const paper = require('paper')
+
+/**
+ * 创建丝带
+ */
+function createRibbon(project, args) {
+  const {
+    x = 0,
+    y = 0,
+    width = 300,
+    text = '',
+    fontSize = 28,
+    fontFamily,
+    color = '#ffffff',
+    backgroundColor = '#e74c3c',
+    borderColor,
+    borderWidth = 2,
+    shadow,
+    position = 'top', // top, bottom, left, right
+    style = 'fold', // fold, diagonal, corner
+    opacity = 1,
+  } = args
+
+  const items = []
+
+  if (style === 'diagonal') {
+    // 对角丝带
+    const diagonalLength = Math.sqrt(width ** 2 + 60 ** 2)
+    const angle = Math.atan2(60, width) * 180 / Math.PI
+
+    const ribbon = new paper.Path.Rectangle({
+      point: [x, y],
+      size: [diagonalLength, 60],
+      radius: 4,
+      fillColor: new paper.Color(backgroundColor),
+    })
+    ribbon.rotate(angle, new paper.Point(x, y))
+
+    if (borderColor) {
+      ribbon.strokeColor = new paper.Color(borderColor)
+      ribbon.strokeWidth = borderWidth
+    }
+
+    if (shadow) {
+      ribbon.shadowColor = new paper.Color(shadow.color || '#000000')
+      ribbon.shadowBlur = shadow.blur || 8
+      ribbon.shadowOffset = new paper.Point(shadow.offsetX || 3, shadow.offsetY || 3)
+    }
+
+    if (opacity !== 1) ribbon.opacity = opacity
+    items.push(ribbon)
+
+    // 文字
+    const textItem = new paper.PointText({
+      point: [x + diagonalLength / 2, y + 60 / 2 + fontSize / 3],
+      content: text,
+      fontSize,
+      fontFamily: fontFamily || 'sans-serif',
+      fillColor: new paper.Color(color),
+      justification: 'center',
+    })
+    textItem.rotate(angle, new paper.Point(x + diagonalLength / 2, y + 60 / 2))
+
+    if (opacity !== 1) textItem.opacity = opacity
+    items.push(textItem)
+
+  } else if (style === 'corner') {
+    // 角落丝带
+    const ribbonWidth = width
+    const ribbonHeight = 50
+
+    // 主丝带
+    const ribbon = new paper.Path.Rectangle({
+      point: [x, y],
+      size: [ribbonWidth, ribbonHeight],
+      fillColor: new paper.Color(backgroundColor),
+    })
+
+    if (borderColor) {
+      ribbon.strokeColor = new paper.Color(borderColor)
+      ribbon.strokeWidth = borderWidth
+    }
+
+    if (shadow) {
+      ribbon.shadowColor = new paper.Color(shadow.color || '#000000')
+      ribbon.shadowBlur = shadow.blur || 8
+      ribbon.shadowOffset = new paper.Point(shadow.offsetX || 3, shadow.offsetY || 3)
+    }
+
+    if (opacity !== 1) ribbon.opacity = opacity
+    items.push(ribbon)
+
+    // 折叠部分
+    const foldSize = 20
+    const fold = new paper.Path()
+    fold.add(new paper.Point(x, y + ribbonHeight))
+    fold.add(new paper.Point(x, y + ribbonHeight + foldSize))
+    fold.add(new paper.Point(x + foldSize, y + ribbonHeight))
+    fold.closed = true
+    fold.fillColor = new paper.Color(backgroundColor).multiply(0.8)
+
+    if (borderColor) {
+      fold.strokeColor = new paper.Color(borderColor)
+      fold.strokeWidth = borderWidth
+    }
+
+    if (opacity !== 1) fold.opacity = opacity
+    items.push(fold)
+
+    // 文字
+    const textItem = new paper.PointText({
+      point: [x + ribbonWidth / 2, y + ribbonHeight / 2 + fontSize / 3],
+      content: text,
+      fontSize,
+      fontFamily: fontFamily || 'sans-serif',
+      fillColor: new paper.Color(color),
+      justification: 'center',
+    })
+
+    if (opacity !== 1) textItem.opacity = opacity
+    items.push(textItem)
+
+  } else {
+    // 折叠丝带 (默认)
+    const ribbonHeight = 50
+
+    // 主丝带
+    const ribbon = new paper.Path.Rectangle({
+      point: [x, y],
+      size: [width, ribbonHeight],
+      fillColor: new paper.Color(backgroundColor),
+    })
+
+    if (borderColor) {
+      ribbon.strokeColor = new paper.Color(borderColor)
+      ribbon.strokeWidth = borderWidth
+    }
+
+    if (shadow) {
+      ribbon.shadowColor = new paper.Color(shadow.color || '#000000')
+      ribbon.shadowBlur = shadow.blur || 8
+      ribbon.shadowOffset = new paper.Point(shadow.offsetX || 3, shadow.offsetY || 3)
+    }
+
+    if (opacity !== 1) ribbon.opacity = opacity
+    items.push(ribbon)
+
+    // 左右折叠三角
+    const foldSize = 15
+    const leftFold = new paper.Path()
+    leftFold.add(new paper.Point(x, y))
+    leftFold.add(new paper.Point(x - foldSize, y - foldSize))
+    leftFold.add(new paper.Point(x, y - foldSize))
+    leftFold.closed = true
+    leftFold.fillColor = new paper.Color(backgroundColor).multiply(0.8)
+    if (opacity !== 1) leftFold.opacity = opacity
+    items.push(leftFold)
+
+    const rightFold = new paper.Path()
+    rightFold.add(new paper.Point(x + width, y))
+    rightFold.add(new paper.Point(x + width + foldSize, y - foldSize))
+    rightFold.add(new paper.Point(x + width, y - foldSize))
+    rightFold.closed = true
+    rightFold.fillColor = new paper.Color(backgroundColor).multiply(0.8)
+    if (opacity !== 1) rightFold.opacity = opacity
+    items.push(rightFold)
+
+    // 文字
+    const textItem = new paper.PointText({
+      point: [x + width / 2, y + ribbonHeight / 2 + fontSize / 3],
+      content: text,
+      fontSize,
+      fontFamily: fontFamily || 'sans-serif',
+      fillColor: new paper.Color(color),
+      justification: 'center',
+    })
+
+    if (opacity !== 1) textItem.opacity = opacity
+    items.push(textItem)
+  }
+
+  return {
+    success: true,
+    type: 'ribbon',
+    items: items.map(i => i.id),
+  }
+}
+
+module.exports = createRibbon

package/.agent/plugins/poster-plugin/src/components/seal.js

@@ -0,0 +1,146 @@
+/**
+ * 印章组件 - 印章效果
+ */
+
+const paper = require('paper')
+
+/**
+ * 创建印章
+ */
+function createSeal(project, args) {
+  const {
+    x = 0,
+    y = 0,
+    size = 100,
+    text = '印章',
+    fontSize = 24,
+    fontFamily,
+    color = '#e74c3c',
+    borderColor,
+    style = 'circle', // circle, square, star, hexagon
+    borderWidth = 3,
+    opacity = 1,
+  } = args
+
+  const items = []
+  const centerX = x + size / 2
+  const centerY = y + size / 2
+
+  // 印章边框
+  let border
+  switch (style) {
+    case 'circle':
+      border = new paper.Path.Circle({
+        center: [centerX, centerY],
+        radius: size / 2 - borderWidth,
+      })
+      break
+    case 'square':
+      const squareSize = size - borderWidth * 2
+      border = new paper.Path.Rectangle({
+        point: [x + borderWidth, y + borderWidth],
+        size: [squareSize, squareSize],
+        radius: 4,
+      })
+      break
+    case 'star':
+      border = createStarPath(centerX, centerY, size / 2 - borderWidth, size / 2 - borderWidth - 10, 5)
+      break
+    case 'hexagon':
+      border = createPolygonPath(centerX, centerY, size / 2 - borderWidth, 6)
+      break
+    default:
+      border = new paper.Path.Circle({
+        center: [centerX, centerY],
+        radius: size / 2 - borderWidth,
+      })
+  }
+
+  border.strokeColor = new paper.Color(color)
+  border.strokeWidth = borderWidth
+  border.fillColor = null
+  if (opacity !== 1) border.opacity = opacity
+  items.push(border)
+
+  // 内边框
+  const innerBorder = border.clone()
+  innerBorder.scale(0.85, 0.85, new paper.Point(centerX, centerY))
+  innerBorder.strokeWidth = 1
+  if (opacity !== 1) innerBorder.opacity = opacity
+  items.push(innerBorder)
+
+  // 文字
+  const textItem = new paper.PointText({
+    point: [centerX, centerY + fontSize / 3],
+    content: text,
+    fontSize,
+    fontFamily: fontFamily || 'serif',
+    fillColor: new paper.Color(color),
+    justification: 'center',
+  })
+
+  if (opacity !== 1) textItem.opacity = opacity
+  items.push(textItem)
+
+  // 顶部文字（如果适用）
+  const topText = new paper.PointText({
+    point: [centerX, centerY - size / 4],
+    content: '★',
+    fontSize: 16,
+    fontFamily: fontFamily || 'serif',
+    fillColor: new paper.Color(color),
+    justification: 'center',
+  })
+  if (opacity !== 1) topText.opacity = opacity
+  items.push(topText)
+
+  // 底部星星装饰
+  const bottomStar = new paper.PointText({
+    point: [centerX, centerY + size / 3],
+    content: '★ ★ ★',
+    fontSize: 12,
+    fontFamily: fontFamily || 'serif',
+    fillColor: new paper.Color(color),
+    justification: 'center',
+    letterSpacing: 8,
+  })
+  if (opacity !== 1) bottomStar.opacity = opacity
+  items.push(bottomStar)
+
+  return {
+    success: true,
+    type: 'seal',
+    items: items.map(i => i.id),
+  }
+}
+
+/**
+ * 创建五角星路径
+ */
+function createStarPath(cx, cy, outerR, innerR, points) {
+  const path = new paper.Path()
+  const angleStep = Math.PI / points
+
+  for (let i = 0; i < points * 2; i++) {
+    const r = i % 2 === 0 ? outerR : innerR
+    const angle = i * angleStep - Math.PI / 2
+    path.add(new paper.Point(cx + r * Math.cos(angle), cy + r * Math.sin(angle)))
+  }
+  path.closed = true
+  return path
+}
+
+/**
+ * 创建多边形路径
+ */
+function createPolygonPath(cx, cy, radius, sides) {
+  const path = new paper.Path()
+  for (let i = 0; i < sides; i++) {
+    const angle = (i * 2 * Math.PI / sides) - Math.PI / 2
+    path.add(new paper.Point(cx + radius * Math.cos(angle), cy + radius * Math.sin(angle)))
+  }
+  path.closed = true
+  return path
+}
+
+module.exports = createSeal

package/.agent/plugins/poster-plugin/src/components/table.js

@@ -12,8 +12,8 @@ function createTable(project, canvas, params) {
     x,
     y,
     width,
-    columns = [],
-    rows = [],
+    columns,
+    rows,
     rowHeight = 36,
     headerBg = '#f0f0f0',
     headerColor = '#333333',
@@ -27,16 +27,24 @@ function createTable(project, canvas, params) {
 
   const elements = []
 
-  if (columns.length === 0) {
+  // 确保 columns 是数组且不为空
+  if (!Array.isArray(columns) || columns.length === 0) {
     return { success: true, elements, type: 'table' }
   }
 
+  // 确保 rows 是数组
+  if (!Array.isArray(rows)) {
+    rows = []
+  }
+
+  // 确保 width 有默认值
+  const tableWidth = width || 400
   const totalHeight = rowHeight * (rows.length + 1)
 
   // 绘制外边框
   const outerBorder = new paper.Path.Rectangle({
     point: [x, y],
-    size: [width, totalHeight]
+    size: [tableWidth, totalHeight]
   })
   outerBorder.fillColor = new paper.Color('transparent')
   outerBorder.strokeColor = new paper.Color(borderColor)
@@ -49,7 +57,7 @@ function createTable(project, canvas, params) {
   // 绘制表头背景
   const headerBgRect = new paper.Path.Rectangle({
     point: [x, y],
-    size: [width, rowHeight]
+    size: [tableWidth, rowHeight]
   })
   headerBgRect.fillColor = new paper.Color(headerBg)
   headerBgRect.strokeColor = new paper.Color(borderColor)
@@ -62,7 +70,7 @@ function createTable(project, canvas, params) {
   // 绘制表头
   let currentX = x
   columns.forEach((col, index) => {
-    const colWidth = col.width || (width / columns.length)
+    const colWidth = col.width || (tableWidth / columns.length)
 
     // 列分隔线
     if (index > 0) {
@@ -103,7 +111,7 @@ function createTable(project, canvas, params) {
     if (striped && rowIndex % 2 === 1) {
       const stripeBg = new paper.Path.Rectangle({
         point: [x, rowY],
-        size: [width, rowHeight]
+        size: [tableWidth, rowHeight]
       })
       stripeBg.fillColor = new paper.Color(stripeColor)
       stripeBg.strokeColor = new paper.Color(borderColor)
@@ -129,7 +137,7 @@ function createTable(project, canvas, params) {
     // 单元格
     let cellX = x
     columns.forEach((col, colIndex) => {
-      const colWidth = col.width || (width / columns.length)
+      const colWidth = col.width || (tableWidth / columns.length)
       const cellValue = row[colIndex] || ''
       const cellText = new paper.PointText({
         point: [cellX + colWidth / 2, rowY + rowHeight / 2 + fontSize / 3],
@@ -150,7 +158,7 @@ function createTable(project, canvas, params) {
   return {
     success: true,
     elements,
-    width,
+    width: tableWidth,
     height: totalHeight,
     type: 'table'
   }

package/.agent/plugins/poster-plugin/src/components/tagCloud.js

@@ -6,21 +6,11 @@ const paper = require('paper')
 
 /**
  * 创建标签云
- * 
- * @param {Object} project - Paper.js 项目
- * @param {Object} canvas - 画布对象
- * @param {Object} args - 组件参数
- * @param {number} args.x - X坐标
- * @param {number} args.y - Y坐标
- * @param {Array} args.tags - 标签数组 [{text, color, bgColor}]
- * @param {number} args.fontSize - 字体大小
- * @param {number} args.padding - 标签内边距
- * @param {number} args.gap - 标签间距
- * @param {number} args.maxWidth - 最大宽度（自动换行）
  */
 function createTagCloud(project, canvas, args) {
   const {
-    x, y,
+    x = 0,
+    y = 0,
     tags = [],
     fontSize = 14,
     padding = 12,
@@ -29,12 +19,22 @@ function createTagCloud(project, canvas, args) {
   } = args
 
   const elements = []
+
+  // 确保 tags 是数组
+  if (!Array.isArray(tags) || tags.length === 0) {
+    return { success: true, elements, height: 0, type: 'tagCloud' }
+  }
+
   let currentX = x
   let currentY = y
   let rowHeight = 0
 
   for (const tag of tags) {
-    const textWidth = tag.text.length * fontSize * 0.6
+    // 确保 tag.text 是字符串
+    const tagText = String(tag.text || '')
+    if (!tagText) continue
+
+    const textWidth = tagText.length * fontSize * 0.6
     const tagWidth = textWidth + padding * 2
     const tagHeight = fontSize + padding * 2
 
@@ -52,17 +52,23 @@ function createTagCloud(project, canvas, args) {
       radius: tagHeight / 2,
     })
     tagBg.fillColor = new paper.Color(tag.bgColor || '#e0e7ff')
+    if (project && project.activeLayer) {
+      project.activeLayer.addChild(tagBg)
+    }
     elements.push({ type: 'rectangle', id: tagBg.id })
 
     // 绘制标签文字
-    const tagText = new paper.PointText({
+    const tagTextEl = new paper.PointText({
       point: [currentX + tagWidth / 2, currentY + tagHeight / 2 + fontSize / 3],
-      content: tag.text,
+      content: tagText,
       fontSize: fontSize,
       fillColor: new paper.Color(tag.color || '#4338ca'),
       justification: 'center',
     })
-    elements.push({ type: 'text', id: tagText.id })
+    if (project && project.activeLayer) {
+      project.activeLayer.addChild(tagTextEl)
+    }
+    elements.push({ type: 'text', id: tagTextEl.id })
 
     currentX += tagWidth + gap
     rowHeight = Math.max(rowHeight, tagHeight)
@@ -71,7 +77,8 @@ function createTagCloud(project, canvas, args) {
   return {
     success: true,
     elements,
-    height: rowHeight,
+    height: currentY - y + rowHeight,
+    type: 'tagCloud',
   }
 }
 

package/.agent/plugins/poster-plugin/src/components/timeline.js

@@ -6,18 +6,6 @@ const paper = require('paper')
 
 /**
  * 创建时间线
- * 
- * @param {Object} project - Paper.js 项目
- * @param {Object} canvas - 画布对象
- * @param {Object} args - 组件参数
- * @param {number} args.x - X坐标
- * @param {number} args.y - Y坐标
- * @param {number} args.width - 总宽度
- * @param {Array} args.items - 时间线项目 [{date, title, description}]
- * @param {string} args.lineColor - 线条颜色
- * @param {string} args.dotColor - 点颜色
- * @param {string} args.activeColor - 激活颜色
- * @param {number} args.dotSize - 点大小
  */
 function createTimeline(project, canvas, args) {
   const {
@@ -32,6 +20,12 @@ function createTimeline(project, canvas, args) {
   } = args
 
   const elements = []
+
+  // 确保 items 是数组
+  if (!Array.isArray(items) || items.length === 0) {
+    return { success: true, elements, height: 0, type: 'timeline' }
+  }
+
   const centerX = x + 80
   const contentX = x + 120
 
@@ -43,12 +37,17 @@ function createTimeline(project, canvas, args) {
       strokeColor: new paper.Color(lineColor),
       strokeWidth: 2,
     })
+    if (project && project.activeLayer) {
+      project.activeLayer.addChild(mainLine)
+    }
     elements.push({ type: 'line', id: mainLine.id })
   }
 
   // 绘制每个项目
   for (let i = 0; i < items.length; i++) {
     const item = items[i]
+    if (!item) continue
+
     const itemY = y + i * gap
     const isActive = item.active !== false
 
@@ -58,6 +57,9 @@ function createTimeline(project, canvas, args) {
       radius: dotSize / 2,
     })
     dot.fillColor = new paper.Color(isActive ? dotColor : lineColor)
+    if (project && project.activeLayer) {
+      project.activeLayer.addChild(dot)
+    }
     elements.push({ type: 'circle', id: dot.id })
 
     // 绘制日期
@@ -69,6 +71,9 @@ function createTimeline(project, canvas, args) {
         fillColor: new paper.Color('#94a3b8'),
         justification: 'left',
       })
+      if (project && project.activeLayer) {
+        project.activeLayer.addChild(dateText)
+      }
       elements.push({ type: 'text', id: dateText.id })
     }
 
@@ -80,6 +85,9 @@ function createTimeline(project, canvas, args) {
       fillColor: new paper.Color(isActive ? '#1e293b' : '#94a3b8'),
       justification: 'left',
     })
+    if (project && project.activeLayer) {
+      project.activeLayer.addChild(titleText)
+    }
     elements.push({ type: 'text', id: titleText.id })
 
     // 绘制描述
@@ -91,6 +99,9 @@ function createTimeline(project, canvas, args) {
         fillColor: new paper.Color('#64748b'),
         justification: 'left',
       })
+      if (project && project.activeLayer) {
+        project.activeLayer.addChild(descText)
+      }
       elements.push({ type: 'text', id: descText.id })
     }
   }
@@ -99,6 +110,7 @@ function createTimeline(project, canvas, args) {
     success: true,
     elements,
     height: items.length * gap,
+    type: 'timeline',
   }
 }