@jjlmoya/utils-tabletop 1.5.0 → 1.6.0

package/src/tool/investigation-board/i18n/sv.ts

@@ -0,0 +1,126 @@
+import { bibliography } from '../bibliography';
+import type { InvestigationBoardLocaleContent } from '../entry';
+
+export const content: InvestigationBoardLocaleContent = {
+  slug: "konspirationsboard-skapare",
+  title: "Konspirationsboard Skapare",
+  description: "Skapa interaktiva konspirationsboards och utredningskartor. Koppla ihop karaktärer, ledtrådar, platser och spåra relationer med anpassade länkar.",
+  ui: {
+  "title": "Konspirationsboard Skapare",
+  "addCard": "Lägg till Kort",
+  "searchPlaceholder": "Sök kort efter namn eller ledtrådar",
+  "filterAll": "Alla Kategorier",
+  "filterCharacter": "Karaktärer",
+  "filterClue": "Ledtrådar",
+  "filterLocation": "Platser",
+  "filterItem": "Föremål",
+  "cardName": "Kortnamn",
+  "cardCategory": "Kategori",
+  "cardDescription": "Beskrivning",
+  "cardNotes": "Privata Anteckningar",
+  "cardTags": "Taggar separerade med komma",
+  "cardColor": "Markeringsfärg för Kort",
+  "save": "Spara Ändringar",
+  "delete": "Ta bort",
+  "cancel": "Avbryt",
+  "clearBoard": "Rensa Board",
+  "connectionsTitle": "Relationskarta",
+  "addConnection": "Lägg till Koppling",
+  "connectionLabel": "Relationsetikett",
+  "connectionColor": "Linjefärg",
+  "sourceCard": "Från Kort",
+  "targetCard": "Till Kort",
+  "close": "Stäng",
+  "character": "Karaktär",
+  "clue": "Ledtråd",
+  "location": "Plats",
+  "item": "Föremål",
+  "custom": "Anpassad",
+  "immersive": "Helskärm"
+},
+  seo: [
+    { type: 'title', text: "Konspirationsboard Skapare för Tabletop och Detektiv RPG Spel", level: 2 },
+    { type: 'paragraph', html: "Skapa inlevelserika utredningskartor och konspirationsboards för dina rollspel. Dra och släpp ledtrådar, platser och karaktärer, och koppla ihop dem med anpassade trådar för att visualisera komplexa mysterier." },
+    {
+      type: 'stats',
+      items: [
+        { value: "Obegränsat", label: "Nodboard" },
+        { value: "4", label: "Kategorier" },
+        { value: "Dra och Släpp", label: "Gränssnitt" }
+      ],
+      columns: 3
+    },
+    { type: 'title', text: "Hur man bygger en utredningskarta", level: 2 },
+    { type: 'paragraph', html: "Lägg till anpassade kort för ledtrådar, karaktärer, föremål och platser. Dra dem på plats i rutnätet. Välj två kort för att länka dem med en färgad relationstråd. Dubbelklicka på noder eller trådar för detaljer." }
+  ],
+  faq: [
+    {
+      question: "Hur lägger jag till kopplingslinjer?",
+      answer: "Klicka på Lägg till Koppling i kontrollpanelen, välj start- och målkort, ange en textetikett samt färg, och spara."
+    },
+    {
+      question: "Kan jag dra kort på mobilen?",
+      answer: "Ja, tavlan stöder touch-händelser för att smidigt dra och flytta kort på smartphones och surfplattor."
+    }
+  ],
+  bibliography,
+  howTo: [
+    {
+      name: "Lägg till Utredningskort",
+      text: "Skapa kort som representerar NPC:er, ledtrådar, brottsplatser eller föremål."
+    },
+    {
+      name: "Koppla Relationer",
+      text: "Skapa kopplingslinjer mellan kort för att visa hur ledtrådar hänger ihop."
+    }
+  ],
+  schemas: [
+    {
+      '@context': 'https://schema.org',
+      '@type': 'SoftwareApplication',
+      'name': "Konspirationsboard Skapare",
+      'operatingSystem': 'All',
+      'applicationCategory': 'UtilitiesApplication',
+      'browserRequirements': 'Requires HTML5 SVG support. Requires JavaScript.'
+    },
+    {
+      '@context': 'https://schema.org',
+      '@type': 'FAQPage',
+      'mainEntity': [
+        {
+          '@type': 'Question',
+          'name': "Hur lägger jag till kopplingslinjer?",
+          'acceptedAnswer': {
+            '@type': 'Answer',
+            'text': "Klicka på Lägg till Koppling i kontrollpanelen, välj start- och målkort, ange en textetikett samt färg, och spara."
+          }
+        },
+        {
+          '@type': 'Question',
+          'name': "Kan jag dra kort på mobilen?",
+          'acceptedAnswer': {
+            '@type': 'Answer',
+            'text': "Ja, tavlan stöder touch-händelser för att smidigt dra och flytta kort på smartphones och surfplattor."
+          }
+        }
+      ]
+    },
+    {
+      '@context': 'https://schema.org',
+      '@type': 'HowTo',
+      'name': "Hur man använder Konspirationsboard Skaparen",
+      'step': [
+        {
+          '@type': 'HowToStep',
+          'name': "Lägg till Utredningskort",
+          'text': "Skapa kort som representerar NPC:er, ledtrådar, brottsplatser eller föremål."
+        },
+        {
+          '@type': 'HowToStep',
+          'name': "Koppla Relationer",
+          'text': "Skapa kopplingslinjer mellan kort för att visa hur ledtrådar hänger ihop."
+        }
+      ]
+    }
+  ]
+};

package/src/tool/investigation-board/i18n/tr.ts

@@ -0,0 +1,126 @@
+import { bibliography } from '../bibliography';
+import type { InvestigationBoardLocaleContent } from '../entry';
+
+export const content: InvestigationBoardLocaleContent = {
+  slug: "komplo-tahtasi-yapici",
+  title: "Komplo Tahtası Yapıcı",
+  description: "Etkileşimli komplo tahtaları ve araştırma haritaları tasarlayın. Karakterleri, ipuçlarını, konumları ilişkilendirin ve özel bağlantılarla ilişkileri izleyin.",
+  ui: {
+  "title": "Komplo Tahtası Yapıcı",
+  "addCard": "Kart Ekle",
+  "searchPlaceholder": "Kartları isim veya ipucuna göre ara",
+  "filterAll": "Tüm Kategoriler",
+  "filterCharacter": "Karakterler",
+  "filterClue": "İpuçları",
+  "filterLocation": "Konumlar",
+  "filterItem": "Eşyalar",
+  "cardName": "Kart Adı",
+  "cardCategory": "Kategori",
+  "cardDescription": "Açıklama",
+  "cardNotes": "Özel Notlar",
+  "cardTags": "Virgülle ayrılmış etiketler",
+  "cardColor": "Kart Vurgu Rengi",
+  "save": "Değişiklikleri Kaydet",
+  "delete": "Sil",
+  "cancel": "İptal",
+  "clearBoard": "Tahtayı Temizle",
+  "connectionsTitle": "İlişki Haritası",
+  "addConnection": "Bağlantı Ekle",
+  "connectionLabel": "İlişki Etiketi",
+  "connectionColor": "Çizgi Rengi",
+  "sourceCard": "Başlangıç Kartı",
+  "targetCard": "Hedef Kart",
+  "close": "Kapat",
+  "character": "Karakter",
+  "clue": "İpucu",
+  "location": "Konum",
+  "item": "Eşya",
+  "custom": "Özel",
+  "immersive": "Tam Ekran"
+},
+  seo: [
+    { type: 'title', text: "Masaüstü ve Dedektiflik RPG Oyunları için Komplo Tahtası Yapıcı", level: 2 },
+    { type: 'paragraph', html: "Masaüstü rol yapma oyunlarınız için sürükleyici araştırma haritaları ve komplo tahtaları oluşturun. İpuçlarını, konumları ve karakterleri sürükleyip bırakın, ardından karmaşık gizemleri görselleştirmek için bunları özel iplerle bağlayın." },
+    {
+      type: 'stats',
+      items: [
+        { value: "Sınırsız", label: "Düğüm Tahtası" },
+        { value: "4", label: "Kategorier" },
+        { value: "Sürükle ve Bırak", label: "Arayüz" }
+      ],
+      columns: 3
+    },
+    { type: 'title', text: "Araştırma Haritası Nasıl Oluşturulur", level: 2 },
+    { type: 'paragraph', html: "İpuçlarını, karakterleri, eşyaları ve konumları temsil eden özel kartlar ekleyin. Onları ızgara üzerindeki konumlara sürükleyin. İki kart seçerek onları renkli bir ilişki ipi ile bağlayın. Detayları görmek için düğümlere veya iplere çift tıklayın." }
+  ],
+  faq: [
+    {
+      question: "Bağlantı çizgilerini nasıl eklerim?",
+      answer: "Kontrol panelinde Bağlantı Ekle seçeneğine tıklayın, kaynak ve hedef kartları seçin, bir metin etiketi ve renk atayıp kaydedin."
+    },
+    {
+      question: "Kartları mobilde sürükleyebilir miyim?",
+      answer: "Evet, tahta akıllı telefonlarda ve tabletlerde kartları sorunsuz bir şekilde sürükleyip taşımak için dokunmatik hareketleri destekler."
+    }
+  ],
+  bibliography,
+  howTo: [
+    {
+      name: "Araştırma Kartları Ekle",
+      text: "NPC\\'leri, ipuçlarını, olay yerlerini veya eşyaları temsil eden kartlar oluşturun."
+    },
+    {
+      name: "İlişkileri Bağla",
+      text: "İpuçlarının birbiriyle ilişkisini göstermek için kartlar arasında bağlantı çizgileri oluşturun."
+    }
+  ],
+  schemas: [
+    {
+      '@context': 'https://schema.org',
+      '@type': 'SoftwareApplication',
+      'name': "Komplo Tahtası Yapıcı",
+      'operatingSystem': 'All',
+      'applicationCategory': 'UtilitiesApplication',
+      'browserRequirements': 'Requires HTML5 SVG support. Requires JavaScript.'
+    },
+    {
+      '@context': 'https://schema.org',
+      '@type': 'FAQPage',
+      'mainEntity': [
+        {
+          '@type': 'Question',
+          'name': "Bağlantı çizgilerini nasıl eklerim?",
+          'acceptedAnswer': {
+            '@type': 'Answer',
+            'text': "Kontrol panelinde Bağlantı Ekle seçeneğine tıklayın, kaynak ve hedef kartları seçin, bir metin etiketi ve renk atayıp kaydedin."
+          }
+        },
+        {
+          '@type': 'Question',
+          'name': "Kartları mobilde sürükleyebilir miyim?",
+          'acceptedAnswer': {
+            '@type': 'Answer',
+            'text': "Evet, tahta akıllı telefonlarda ve tabletlerde kartları sorunsuz bir şekilde sürükleyip taşımak için dokunmatik hareketleri destekler."
+          }
+        }
+      ]
+    },
+    {
+      '@context': 'https://schema.org',
+      '@type': 'HowTo',
+      'name': "Komplo Tahtası Yapıcı Nasıl Kullanılır",
+      'step': [
+        {
+          '@type': 'HowToStep',
+          'name': "Araştırma Kartları Ekle",
+          'text': "NPC\\'leri, ipuçlarını, olay yerlerini veya eşyaları temsil eden kartlar oluşturun."
+        },
+        {
+          '@type': 'HowToStep',
+          'name': "İlişkileri Bağla",
+          'text': "İpuçlarının birbiriyle ilişkisini göstermek için kartlar arasında bağlantı çizgileri oluşturun."
+        }
+      ]
+    }
+  ]
+};

package/src/tool/investigation-board/i18n/zh.ts

@@ -0,0 +1,126 @@
+import { bibliography } from '../bibliography';
+import type { InvestigationBoardLocaleContent } from '../entry';
+
+export const content: InvestigationBoardLocaleContent = {
+  slug: "investigation-board",
+  title: "线索墙制作器",
+  description: "设计互动式线索墙 and 调查地图。连接角色、线索、地点，并用自定义线段追踪关系。",
+  ui: {
+  "title": "线索墙制作器",
+  "addCard": "添加卡片",
+  "searchPlaceholder": "按名称或线索搜索卡片",
+  "filterAll": "所有类别",
+  "filterCharacter": "角色",
+  "filterClue": "线索",
+  "filterLocation": "地点",
+  "filterItem": "物品",
+  "cardName": "卡片名称",
+  "cardCategory": "类别",
+  "cardDescription": "描述",
+  "cardNotes": "私人备注",
+  "cardTags": "用逗号分隔的标签",
+  "cardColor": "卡片高亮颜色",
+  "save": "保存修改",
+  "delete": "删除",
+  "cancel": "取消",
+  "clearBoard": "清空画板",
+  "connectionsTitle": "关系网地图",
+  "addConnection": "添加连接",
+  "connectionLabel": "关系标签",
+  "connectionColor": "线段颜色",
+  "sourceCard": "起始卡片",
+  "targetCard": "目标卡片",
+  "close": "关闭",
+  "character": "角色",
+  "clue": "线索",
+  "location": "地点",
+  "item": "物品",
+  "custom": "自定义",
+  "immersive": "全屏模式"
+},
+  seo: [
+    { type: 'title', text: "跑团与侦探角色扮演游戏的线索墙制作器", level: 2 },
+    { type: 'paragraph', html: "为您的桌面角色扮演游戏创建沉浸式调查地图和线索墙。拖放线索、地点和角色，然后用自定义的线段将它们连接起来，使复杂的谜题可视化。" },
+    {
+      type: 'stats',
+      items: [
+        { value: "无限制", label: "节点画板" },
+        { value: "4", label: "类别数量" },
+        { value: "拖放操作", label: "交互界面" }
+      ],
+      columns: 3
+    },
+    { type: 'title', text: "如何构建调查地图", level: 2 },
+    { type: 'paragraph', html: "添加代表线索、角色、物品和地点的自定义卡片。将它们拖动到网格中的对应位置。选择两张卡片，用彩色关系线将它们链接起来。双击节点或连接线以查看详细信息。" }
+  ],
+  faq: [
+    {
+      question: "如何添加连接线？",
+      answer: "点击控制面板中的添加连接，选择起始和目标卡片，指定文本标签和颜色，然后保存。"
+    },
+    {
+      question: "我可以在手机上拖动卡片吗？",
+      answer: "可以，画板支持触摸事件，可以在智能手机和平板电脑上流畅地拖动和移动卡片。"
+    }
+  ],
+  bibliography,
+  howTo: [
+    {
+      name: "添加调查卡片",
+      text: "创建代表NPC、线索、案发现场或物品的卡片。"
+    },
+    {
+      name: "链接关系",
+      text: "在卡片之间创建连接线，以显示线索之间的关联。"
+    }
+  ],
+  schemas: [
+    {
+      '@context': 'https://schema.org',
+      '@type': 'SoftwareApplication',
+      'name': "线索墙制作器",
+      'operatingSystem': 'All',
+      'applicationCategory': 'UtilitiesApplication',
+      'browserRequirements': 'Requires HTML5 SVG support. Requires JavaScript.'
+    },
+    {
+      '@context': 'https://schema.org',
+      '@type': 'FAQPage',
+      'mainEntity': [
+        {
+          '@type': 'Question',
+          'name': "如何添加连接线？",
+          'acceptedAnswer': {
+            '@type': 'Answer',
+            'text': "点击控制面板中的添加连接，选择起始和目标卡片，指定文本标签和颜色，然后保存。"
+          }
+        },
+        {
+          '@type': 'Question',
+          'name': "我可以在手机上拖动卡片吗？",
+          'acceptedAnswer': {
+            '@type': 'Answer',
+            'text': "可以，画板支持触摸事件，可以在智能手机和平板电脑上流畅地拖动和移动卡片。"
+          }
+        }
+      ]
+    },
+    {
+      '@context': 'https://schema.org',
+      '@type': 'HowTo',
+      'name': "线索墙制作器使用方法",
+      'step': [
+        {
+          '@type': 'HowToStep',
+          'name': "添加调查卡片",
+          'text': "创建代表NPC、线索、案发现场或物品的卡片。"
+        },
+        {
+          '@type': 'HowToStep',
+          'name': "链接关系",
+          'text': "在卡片之间创建连接线，以显示线索之间的关联。"
+        }
+      ]
+    }
+  ]
+};

package/src/tool/investigation-board/index.ts

@@ -0,0 +1,11 @@
+import type { ToolDefinition } from '../../types';
+import { investigationBoard } from './entry';
+
+export * from './entry';
+
+export const INVESTIGATION_BOARD_TOOL: ToolDefinition = {
+  entry: investigationBoard,
+  Component: () => import('./component.astro'),
+  SEOComponent: () => import('./seo.astro'),
+  BibliographyComponent: () => import('./bibliography.astro'),
+};

package/src/tool/investigation-board/interactDrag.ts

@@ -0,0 +1,58 @@
+import interact from 'interactjs';
+import { state } from './dom';
+import { getHighlightPath } from './logic';
+import { drawConnections } from './renderer';
+import { adjustBoardSize } from './layout';
+import { saveState } from './stateManager';
+import { cancelLongPress } from './boardContextMenu';
+
+interface DragEvent {
+  target: HTMLElement;
+  dx: number;
+  dy: number;
+}
+
+function handleDragStart(event: DragEvent): void {
+  cancelLongPress();
+  event.target.classList.add('dragging');
+}
+
+function handleDragMove(event: DragEvent): void {
+  cancelLongPress();
+  const target = event.target;
+  const id = target.id.replace('node-', '');
+  const n = state.nodes.find((item) => item.id === id);
+  if (n) {
+    let newX = n.x + event.dx / state.zoomScale;
+    let newY = n.y + event.dy / state.zoomScale;
+    newX = Math.round(newX / 15) * 15;
+    newY = Math.round(newY / 15) * 15;
+    n.x = newX;
+    n.y = newY;
+    target.style.left = `${newX}px`;
+    target.style.top = `${newY}px`;
+    const highlight = state.highlightedNodeId
+      ? getHighlightPath(state.connections, state.highlightedNodeId)
+      : null;
+    drawConnections(highlight);
+    adjustBoardSize();
+  }
+}
+
+function handleDragEnd(event: DragEvent): void {
+  const target = event.target;
+  target.classList.remove('dragging');
+  saveState();
+  adjustBoardSize();
+}
+
+export function initializeDrag(): void {
+  interact('.board-node').draggable({
+    inertia: true,
+    listeners: {
+      start: (event: DragEvent) => handleDragStart(event),
+      move: (event: DragEvent) => handleDragMove(event),
+      end: (event: DragEvent) => handleDragEnd(event),
+    },
+  });
+}