Implement asset upload API and utility functions

- Add Asset and CardLayer model updates - Create asset upload API endpoints - Add AssetUploadDialog component - Create card layout algorithms - Implement symmetry generation utils - Add template configurations
2026-05-31 15:33:50 +08:00
parent 48629736f4
commit 0370e4018a
12 changed files with 749 additions and 4 deletions
--- a/frontend/src/utils/cardLayout.js
+++ b/frontend/src/utils/cardLayout.js
@@ -0,0 +1,128 @@
+const LAYOUT_POSITIONS = {
+  1: [
+    { x: 0.5, y: 0.5 }
+  ],
+  2: [
+    { x: 0.5, y: 0.25 },
+    { x: 0.5, y: 0.75 }
+  ],
+  3: [
+    { x: 0.5, y: 0.2 },
+    { x: 0.5, y: 0.5 },
+    { x: 0.5, y: 0.8 }
+  ],
+  4: [
+    { x: 0.3, y: 0.25 },
+    { x: 0.7, y: 0.25 },
+    { x: 0.3, y: 0.75 },
+    { x: 0.7, y: 0.75 }
+  ],
+  5: [
+    { x: 0.3, y: 0.2 },
+    { x: 0.7, y: 0.2 },
+    { x: 0.5, y: 0.5 },
+    { x: 0.3, y: 0.8 },
+    { x: 0.7, y: 0.8 }
+  ],
+  6: [
+    { x: 0.3, y: 0.2 },
+    { x: 0.7, y: 0.2 },
+    { x: 0.3, y: 0.5 },
+    { x: 0.7, y: 0.5 },
+    { x: 0.3, y: 0.8 },
+    { x: 0.7, y: 0.8 }
+  ],
+  7: [
+    { x: 0.3, y: 0.15 },
+    { x: 0.7, y: 0.15 },
+    { x: 0.5, y: 0.35 },
+    { x: 0.3, y: 0.55 },
+    { x: 0.7, y: 0.55 },
+    { x: 0.3, y: 0.85 },
+    { x: 0.7, y: 0.85 }
+  ],
+  8: [
+    { x: 0.3, y: 0.15 },
+    { x: 0.7, y: 0.15 },
+    { x: 0.5, y: 0.35 },
+    { x: 0.3, y: 0.55 },
+    { x: 0.7, y: 0.55 },
+    { x: 0.5, y: 0.65 },
+    { x: 0.3, y: 0.85 },
+    { x: 0.7, y: 0.85 }
+  ],
+  9: [
+    { x: 0.3, y: 0.15 },
+    { x: 0.7, y: 0.15 },
+    { x: 0.5, y: 0.35 },
+    { x: 0.2, y: 0.5 },
+    { x: 0.5, y: 0.5 },
+    { x: 0.8, y: 0.5 },
+    { x: 0.5, y: 0.65 },
+    { x: 0.3, y: 0.85 },
+    { x: 0.7, y: 0.85 }
+  ],
+  10: [
+    { x: 0.3, y: 0.15 },
+    { x: 0.7, y: 0.15 },
+    { x: 0.3, y: 0.35 },
+    { x: 0.7, y: 0.35 },
+    { x: 0.5, y: 0.5 },
+    { x: 0.3, y: 0.65 },
+    { x: 0.7, y: 0.65 },
+    { x: 0.3, y: 0.85 },
+    { x: 0.7, y: 0.85 }
+  ]
+}
+
+export function calculateSuitPositions(rank, cardWidth, cardHeight, symbolSize = 60) {
+  const positions = LAYOUT_POSITIONS[rank] || LAYOUT_POSITIONS[1]
+
+  return positions.map(pos => ({
+    x: pos.x * cardWidth - symbolSize / 2,
+    y: pos.y * cardHeight - symbolSize / 2,
+    width: symbolSize,
+    height: symbolSize
+  }))
+}
+
+export function getCornerPositions(cardWidth, cardHeight) {
+  return {
+    topLeft: { x: 50, y: 50 },
+    topRight: { x: cardWidth - 100, y: 50 },
+    bottomLeft: { x: 50, y: cardHeight - 100 },
+    bottomRight: { x: cardWidth - 100, y: cardHeight - 100 }
+  }
+}
+
+export function getSuitSymbol(suit) {
+  const symbols = {
+    spade: '♠',
+    heart: '♥',
+    club: '♣',
+    diamond: '♦'
+  }
+  return symbols[suit] || '♠'
+}
+
+export function getSuitColor(suit, templateColors) {
+  if (templateColors && templateColors[suit]) {
+    return templateColors[suit]
+  }
+
+  const colors = {
+    spade: '#000000',
+    heart: '#FF0000',
+    club: '#000000',
+    diamond: '#FF0000'
+  }
+  return colors[suit] || '#000000'
+}
+
+export function isRedSuit(suit) {
+  return suit === 'heart' || suit === 'diamond'
+}
+
+export function isBlackSuit(suit) {
+  return suit === 'spade' || suit === 'club'
+}