@jjlmoya/utils-tabletop 1.5.0 → 1.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +5 -3
- package/src/entries.ts +5 -1
- package/src/index.ts +2 -0
- package/src/tests/locale_completeness.test.ts +2 -1
- package/src/tests/tool_validation.test.ts +2 -1
- package/src/tool/investigation-board/bibliography.astro +16 -0
- package/src/tool/investigation-board/bibliography.ts +12 -0
- package/src/tool/investigation-board/boardContextMenu.ts +64 -0
- package/src/tool/investigation-board/client.ts +223 -0
- package/src/tool/investigation-board/component.astro +23 -0
- package/src/tool/investigation-board/components/BoardCanvas.astro +39 -0
- package/src/tool/investigation-board/components/CardDrawer.astro +73 -0
- package/src/tool/investigation-board/components/ConnectionModal.astro +49 -0
- package/src/tool/investigation-board/components/ContextMenu.astro +26 -0
- package/src/tool/investigation-board/components/ControlPanel.astro +57 -0
- package/src/tool/investigation-board/connectionModal.ts +60 -0
- package/src/tool/investigation-board/dom.ts +89 -0
- package/src/tool/investigation-board/drawer.ts +110 -0
- package/src/tool/investigation-board/entry.ts +59 -0
- package/src/tool/investigation-board/i18n/de.ts +209 -0
- package/src/tool/investigation-board/i18n/en.ts +209 -0
- package/src/tool/investigation-board/i18n/es.ts +209 -0
- package/src/tool/investigation-board/i18n/fr.ts +209 -0
- package/src/tool/investigation-board/i18n/id.ts +209 -0
- package/src/tool/investigation-board/i18n/it.ts +209 -0
- package/src/tool/investigation-board/i18n/ja.ts +209 -0
- package/src/tool/investigation-board/i18n/ko.ts +209 -0
- package/src/tool/investigation-board/i18n/nl.ts +209 -0
- package/src/tool/investigation-board/i18n/pl.ts +209 -0
- package/src/tool/investigation-board/i18n/pt.ts +209 -0
- package/src/tool/investigation-board/i18n/ru.ts +209 -0
- package/src/tool/investigation-board/i18n/sv.ts +209 -0
- package/src/tool/investigation-board/i18n/tr.ts +209 -0
- package/src/tool/investigation-board/i18n/zh.ts +209 -0
- package/src/tool/investigation-board/index.ts +11 -0
- package/src/tool/investigation-board/interactDrag.ts +58 -0
- package/src/tool/investigation-board/investigation-board.css +799 -0
- package/src/tool/investigation-board/layout.ts +16 -0
- package/src/tool/investigation-board/logic.test.ts +105 -0
- package/src/tool/investigation-board/logic.ts +106 -0
- package/src/tool/investigation-board/panzoom.ts +24 -0
- package/src/tool/investigation-board/renderer.ts +256 -0
- package/src/tool/investigation-board/seo.astro +16 -0
- package/src/tool/investigation-board/stateManager.ts +126 -0
- package/src/tool/investigation-board/types.ts +26 -0
- package/src/tools.ts +3 -0
|
@@ -0,0 +1,209 @@
|
|
|
1
|
+
import { bibliography } from '../bibliography';
|
|
2
|
+
import type { InvestigationBoardLocaleContent } from '../entry';
|
|
3
|
+
|
|
4
|
+
export const content: InvestigationBoardLocaleContent = {
|
|
5
|
+
slug: "komplo-tahtasi-olusturucu",
|
|
6
|
+
title: "Komplo Tahtası Oluşturucu: Online Dedektif RPG İpucu & İlişki Haritası",
|
|
7
|
+
description: "Etkileşimli komplo tahtaları ve RPG araştırma haritaları tasarlayın. Şüphelileri, ipuçlarını ve konumları renkli iplerle bağlayın.",
|
|
8
|
+
ui: {
|
|
9
|
+
"title": "Komplo Tahtası Oluşturucu",
|
|
10
|
+
"addCard": "Kart Ekle",
|
|
11
|
+
"searchPlaceholder": "Kartları isim veya ipucuna göre ara",
|
|
12
|
+
"filterAll": "Tüm Kategoriler",
|
|
13
|
+
"filterCharacter": "Karakterler",
|
|
14
|
+
"filterClue": "İpuçları",
|
|
15
|
+
"filterLocation": "Konumlar",
|
|
16
|
+
"filterItem": "Eşyalar",
|
|
17
|
+
"cardName": "Kart Adı",
|
|
18
|
+
"cardCategory": "Kategori",
|
|
19
|
+
"cardDescription": "Açıklama",
|
|
20
|
+
"cardNotes": "Özel Notlar",
|
|
21
|
+
"cardTags": "Virgülle ayrılmış etiketler",
|
|
22
|
+
"cardColor": "Kart Vurgu Rengi",
|
|
23
|
+
"save": "Değişiklikleri Kaydet",
|
|
24
|
+
"delete": "Sil",
|
|
25
|
+
"cancel": "İptal",
|
|
26
|
+
"clearBoard": "Tahtayı Temizle",
|
|
27
|
+
"connectionsTitle": "İlişki Haritası",
|
|
28
|
+
"addConnection": "Bağlantı Ekle",
|
|
29
|
+
"connectionLabel": "İlişki Etiketi",
|
|
30
|
+
"connectionColor": "Çizgi Rengi",
|
|
31
|
+
"sourceCard": "Başlangıç Kartı",
|
|
32
|
+
"targetCard": "Hedef Kart",
|
|
33
|
+
"close": "Kapat",
|
|
34
|
+
"character": "Karakter",
|
|
35
|
+
"clue": "İpucu",
|
|
36
|
+
"location": "Konum",
|
|
37
|
+
"item": "Eşya",
|
|
38
|
+
"custom": "Özel",
|
|
39
|
+
"immersive": "Tam Ekran"
|
|
40
|
+
},
|
|
41
|
+
seo: [
|
|
42
|
+
{ type: 'title', text: "Online Komplo Tahtası Oluşturucu: Dedektif RPG İpuçlarını ve İlişkileri Düzenleyin", level: 2 },
|
|
43
|
+
{ type: 'paragraph', html: "Karmaşık yalanlar ağını çözmek, şüphelilerin alibilerini takip etmek ve olay yeri delillerini birleştirmek her türlü dedektif RPG grubunu yorabilir. İster Call of Cthulhu kampanyası, ister Cyberpunk cinayet gizemi, ister D&D dedektiflik görevi yürütüyor veya bir gerilim romanı yazıyor olun - çevrimiçi komplo tahtası oluşturucumuz en iyi araçtır. Sınırsız dijital mantar panoda ipuçlarını, NPC'leri ve fiziksel kanıtları sürükleyin, bırakın, kategorize edin ve bağlayın. Şüphelilerin olay yerleriyle, alibilerle ve gizli nedenlerle nasıl bağlantılı olduğunu anında görmek için renk kodlu ilişki iplerini kullanın." },
|
|
44
|
+
{
|
|
45
|
+
type: 'stats',
|
|
46
|
+
items: [
|
|
47
|
+
{ value: "Sınırsız", label: "Düğüm Tahtası" },
|
|
48
|
+
{ value: "4", label: "Kategoriler" },
|
|
49
|
+
{ value: "Sürükle-Bırak", label: "Arayüz" }
|
|
50
|
+
],
|
|
51
|
+
columns: 3
|
|
52
|
+
},
|
|
53
|
+
{ type: 'title', text: "Dedektif RPG Araştırma Tahtanızı Yapılandırmak İçin İpuçları", level: 2 },
|
|
54
|
+
{ type: 'tip', title: "Üç İpucu Kuralı", html: "Oyuncuların ulaşmasını istediğiniz her sonuç veya çıkarım için araştırma tahtasına en az üç farklı ipucu ekleyin. Alternatif akıl yürütme yollarını göstermek için bunları özel renkli iplerle bağlayın. Şüpheliler için Karakter kartlarını, olay yerleri için Konum kartlarını ve fiziksel kanıtlar veya belgeler için Eşya kartlarını kullanın. Notları güncel tutun." },
|
|
55
|
+
{ type: 'title', text: "Dijital Komplo Tahtaları ve Fiziksel Mantar Panolar", level: 2 },
|
|
56
|
+
{
|
|
57
|
+
type: 'proscons',
|
|
58
|
+
title: "Dijital Komplo Tahtaları ve Fiziksel Mantar Panolar",
|
|
59
|
+
items: [
|
|
60
|
+
{ pro: "Alan sınırı olmadan gerektiği kadar ipucu, şüpheli ve karakter ilişkisi eklemek için sınırsız tahta boyutu.", con: "Masa başı oyun seansı sırasında bir ekran, tablet veya dijital cihaz gerektirir." },
|
|
61
|
+
{ pro: "Oyun seansları sırasında belirli tanıkları veya ipuçlarını anında bulmak için hızlı arama ve kategori filtreleri.", con: "Gerçek bir duvarda gerçek kırmızı ipliğin ve raptiyelerin fiziksel dokunma hissi eksiktir." },
|
|
62
|
+
{ pro: "Haritaları oyun geceleri arasında fiziksel yer kaplamadan dijital olarak kaydedin, yükleyin ve paylaşın.", con: "Tahta durumunu kaydetmek için internet erişimi veya tarayıcının yerel depolama alanı gerekir." }
|
|
63
|
+
]
|
|
64
|
+
},
|
|
65
|
+
{ type: 'title', text: "Gizem Haritanız İçin Kart Kategorilerini Seçme", level: 3 },
|
|
66
|
+
{
|
|
67
|
+
type: 'comparative',
|
|
68
|
+
items: [
|
|
69
|
+
{
|
|
70
|
+
title: "Karakter Düğümleri",
|
|
71
|
+
description: "NPC'leri, şüphelileri, tanıkları veya örgütleri temsil eder. İlişkileri renkli çizgilerle vurgulayın.",
|
|
72
|
+
icon: 'mdi:account-group',
|
|
73
|
+
highlight: true,
|
|
74
|
+
points: [
|
|
75
|
+
"Şüpheli alibilerini ve güdülerini takip edin",
|
|
76
|
+
"Aile ve gizli örgüt bağlarını ilişkilendirin",
|
|
77
|
+
"Tanık ifadelerinin ayrıntılarını kaydedin"
|
|
78
|
+
]
|
|
79
|
+
},
|
|
80
|
+
{
|
|
81
|
+
title: "İpucu Düğümleri",
|
|
82
|
+
description: "Oyuncuların kampanya sırasında keşfettiği fiziksel kanıtları, otopsi raporlarını, alibileri veya söylentileri temsil eder.",
|
|
83
|
+
icon: 'mdi:magnify',
|
|
84
|
+
highlight: false,
|
|
85
|
+
points: [
|
|
86
|
+
"Otopsi raporları ve adli tıp analizleri",
|
|
87
|
+
"Olay yerlerinde bulunan fiziksel nesneler",
|
|
88
|
+
"Kulaktan dolma söylentiler ve sızdırılmış sırlar"
|
|
89
|
+
]
|
|
90
|
+
},
|
|
91
|
+
{
|
|
92
|
+
title: "Konum Düğümleri",
|
|
93
|
+
description: "Olay yerleri, şüpheli evleri, gizli sığınaklar veya şehirler.",
|
|
94
|
+
icon: 'mdi:map-marker',
|
|
95
|
+
highlight: false,
|
|
96
|
+
points: [
|
|
97
|
+
"Olay yeri fotoğrafları ve krokiler",
|
|
98
|
+
"Önemli NPC'lerin ikametgahları",
|
|
99
|
+
"Gizli sığınaklar ve boyut kapıları"
|
|
100
|
+
]
|
|
101
|
+
}
|
|
102
|
+
],
|
|
103
|
+
columns: 3
|
|
104
|
+
},
|
|
105
|
+
{ type: 'title', text: "Komplo Haritalama Terimleri Sözlüğü", level: 3 },
|
|
106
|
+
{
|
|
107
|
+
type: 'glossary',
|
|
108
|
+
items: [
|
|
109
|
+
{ term: "Araştırma Düğümü", definition: "Tuval üzerindeki kişi, konum, ipucu veya eşyayı temsil eden herhangi bir kart." },
|
|
110
|
+
{ term: "İlişki İpi", definition: "İki kartı birbirine bağlayan ve ilişkilerini gösteren renkli bir çizgi (örneğin: Şüpheli, Alibi, Sahibi)." },
|
|
111
|
+
{ term: "Sarmal Mod", definition: "Mobil veya tabletlerde tuval çalışma alanını en üst düzeye çıkarmak için kontrol panellerini gizleyen tam ekran düzeni." },
|
|
112
|
+
{ term: "Vurgu Yolu", definition: "Seçilen bir kartın yalnızca bağlı düğümlerini ve çizgilerini gösteren, tahtanın geri kalanını karartan görsel bir efekt." }
|
|
113
|
+
]
|
|
114
|
+
},
|
|
115
|
+
{
|
|
116
|
+
type: 'diagnostic',
|
|
117
|
+
variant: 'info',
|
|
118
|
+
title: "Mobil Cihazlar İçin Performans İpucu",
|
|
119
|
+
icon: 'mdi:information-outline',
|
|
120
|
+
badge: 'GRID TIP',
|
|
121
|
+
html: "Eski tabletlerde düğümleri sürüklemek yavaş geliyorsa, menüleri gizlemek için tam ekran modunu açın. Minimum çabayla tahtayı düzenli tutmak için ızgaraya hizalamanın etkin olduğundan (kartlar her 15 pikselde bir hizalanır) emin olun."
|
|
122
|
+
}
|
|
123
|
+
],
|
|
124
|
+
faq: [
|
|
125
|
+
{ question: "Bağlantı çizgilerini nasıl eklerim?", answer: "Kontrol panelinde Bağlantı Ekle'ye tıklayın veya bir karttaki bağlantı simgesine tıklayıp hedef kartı seçin." },
|
|
126
|
+
{ question: "Mobilde kartları 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." },
|
|
127
|
+
{ question: "Özel kart renkleri kullanabilir miyim?", answer: "Evet. Bir karta çift tıklayın, Kategori altında Özel seçeneğini belirleyin ve bir vurgu rengi seçin." },
|
|
128
|
+
{ question: "Tahta çalışmamı kaydediyor mu?", answer: "Evet. İlerlemeniz, mevcut tahta adı altında tarayıcınızın yerel depolama alanına otomatik olarak kaydedilir." },
|
|
129
|
+
{ question: "Tahtayı nasıl yakınlaştırıp uzaklaştırırım ve hareket ettiririm?", answer: "Yakınlaştırmak ve uzaklaştırmak için sıkıştırma hareketlerini veya fare tekerleğini kullanın. Tuval üzerinde gezinmek için arka planı sürükleyin." }
|
|
130
|
+
],
|
|
131
|
+
bibliography,
|
|
132
|
+
howTo: [
|
|
133
|
+
{ name: "Araştırma Kartları Ekle", text: "NPC'leri, ipuçlarını, olay yerlerini veya eşyaları temsil eden kartlar oluşturun." },
|
|
134
|
+
{ name: "İlişkileri Bağla", text: "İpuçlarının nasıl ilişkili olduğunu göstermek için kartlar arasında bağlantı çizgileri oluşturun." }
|
|
135
|
+
],
|
|
136
|
+
schemas: [
|
|
137
|
+
{
|
|
138
|
+
'@context': 'https://schema.org',
|
|
139
|
+
'@type': 'SoftwareApplication',
|
|
140
|
+
'name': "Komplo Tahtası Oluşturucu: Online Dedektif RPG İpucu & İlişki Haritası",
|
|
141
|
+
'operatingSystem': 'All',
|
|
142
|
+
'applicationCategory': 'UtilitiesApplication',
|
|
143
|
+
'browserRequirements': 'Requires HTML5 SVG support. Requires JavaScript.'
|
|
144
|
+
},
|
|
145
|
+
{
|
|
146
|
+
'@context': 'https://schema.org',
|
|
147
|
+
'@type': 'FAQPage',
|
|
148
|
+
'mainEntity': [
|
|
149
|
+
{
|
|
150
|
+
'@type': 'Question',
|
|
151
|
+
'name': "Bağlantı çizgilerini nasıl eklerim?",
|
|
152
|
+
'acceptedAnswer': {
|
|
153
|
+
'@type': 'Answer',
|
|
154
|
+
'text': "Kontrol panelinde Bağlantı Ekle'ye tıklayın veya bir karttaki bağlantı simgesine tıklayıp hedef kartı seçin."
|
|
155
|
+
}
|
|
156
|
+
},
|
|
157
|
+
{
|
|
158
|
+
'@type': 'Question',
|
|
159
|
+
'name': "Mobilde kartları sürükleyebilir miyim?",
|
|
160
|
+
'acceptedAnswer': {
|
|
161
|
+
'@type': 'Answer',
|
|
162
|
+
'text': "Evet, tahta akıllı telefonlarda ve tabletlerde kartları sorunsuz bir şekilde sürükleyip taşımak için dokunmatik hareketleri destekler."
|
|
163
|
+
}
|
|
164
|
+
},
|
|
165
|
+
{
|
|
166
|
+
'@type': 'Question',
|
|
167
|
+
'name': "Özel kart renkleri kullanabilir miyim?",
|
|
168
|
+
'acceptedAnswer': {
|
|
169
|
+
'@type': 'Answer',
|
|
170
|
+
'text': "Evet. Bir karta çift tıklayın, Kategori altında Özel seçeneğini belirleyin ve bir vurgu rengi seçin."
|
|
171
|
+
}
|
|
172
|
+
},
|
|
173
|
+
{
|
|
174
|
+
'@type': 'Question',
|
|
175
|
+
'name': "Tahta çalışmamı kaydediyor mu?",
|
|
176
|
+
'acceptedAnswer': {
|
|
177
|
+
'@type': 'Answer',
|
|
178
|
+
'text': "Evet. İlerlemeniz, mevcut tahta adı altında tarayıcınızın yerel depolama alanına otomatik olarak kaydedilir."
|
|
179
|
+
}
|
|
180
|
+
},
|
|
181
|
+
{
|
|
182
|
+
'@type': 'Question',
|
|
183
|
+
'name': "Tahtayı nasıl yakınlaştırıp uzaklaştırırım ve hareket ettiririm?",
|
|
184
|
+
'acceptedAnswer': {
|
|
185
|
+
'@type': 'Answer',
|
|
186
|
+
'text': "Yakınlaştırmak ve uzaklaştırmak için sıkıştırma hareketlerini veya fare tekerleğini kullanın. Tuval üzerinde gezinmek için arka planı sürükleyin."
|
|
187
|
+
}
|
|
188
|
+
}
|
|
189
|
+
]
|
|
190
|
+
},
|
|
191
|
+
{
|
|
192
|
+
'@context': 'https://schema.org',
|
|
193
|
+
'@type': 'HowTo',
|
|
194
|
+
'name': "Komplo Tahtası Oluşturucu Nasıl Kullanılır",
|
|
195
|
+
'step': [
|
|
196
|
+
{
|
|
197
|
+
'@type': 'HowToStep',
|
|
198
|
+
'name': "Araştırma Kartları Ekle",
|
|
199
|
+
'text': "NPC'leri, ipuçlarını, olay yerlerini veya eşyaları temsil eden kartlar oluşturun."
|
|
200
|
+
},
|
|
201
|
+
{
|
|
202
|
+
'@type': 'HowToStep',
|
|
203
|
+
'name': "İlişkileri Bağla",
|
|
204
|
+
'text': "İpuçlarının nasıl ilişkili olduğunu göstermek için kartlar arasında bağlantı çizgileri oluşturun."
|
|
205
|
+
}
|
|
206
|
+
]
|
|
207
|
+
}
|
|
208
|
+
]
|
|
209
|
+
};
|
|
@@ -0,0 +1,209 @@
|
|
|
1
|
+
import { bibliography } from '../bibliography';
|
|
2
|
+
import type { InvestigationBoardLocaleContent } from '../entry';
|
|
3
|
+
|
|
4
|
+
export const content: InvestigationBoardLocaleContent = {
|
|
5
|
+
slug: "investigation-board",
|
|
6
|
+
title: "线索墙制作器:在线侦探RPG线索与人物关系图整理工具",
|
|
7
|
+
description: "设计交互式线索墙和RPG调查地图。使用定制的彩色关系线将嫌疑人、线索和地点连接起来。",
|
|
8
|
+
ui: {
|
|
9
|
+
"title": "线索墙制作器",
|
|
10
|
+
"addCard": "添加卡片",
|
|
11
|
+
"searchPlaceholder": "按名称或线索搜索卡片",
|
|
12
|
+
"filterAll": "所有类别",
|
|
13
|
+
"filterCharacter": "人物",
|
|
14
|
+
"filterClue": "线索",
|
|
15
|
+
"filterLocation": "地点",
|
|
16
|
+
"filterItem": "道具",
|
|
17
|
+
"cardName": "卡片名称",
|
|
18
|
+
"cardCategory": "类别",
|
|
19
|
+
"cardDescription": "描述",
|
|
20
|
+
"cardNotes": "私人备注",
|
|
21
|
+
"cardTags": "以逗号分隔的的标签",
|
|
22
|
+
"cardColor": "卡片高亮颜色",
|
|
23
|
+
"save": "保存修改",
|
|
24
|
+
"delete": "删除",
|
|
25
|
+
"cancel": "取消",
|
|
26
|
+
"clearBoard": "清空画板",
|
|
27
|
+
"connectionsTitle": "关系地图",
|
|
28
|
+
"addConnection": "添加连接",
|
|
29
|
+
"connectionLabel": "关系标签",
|
|
30
|
+
"connectionColor": "连线颜色",
|
|
31
|
+
"sourceCard": "起始卡片",
|
|
32
|
+
"targetCard": "目标卡片",
|
|
33
|
+
"close": "关闭",
|
|
34
|
+
"character": "人物",
|
|
35
|
+
"clue": "线索",
|
|
36
|
+
"location": "地点",
|
|
37
|
+
"item": "道具",
|
|
38
|
+
"custom": "自定义",
|
|
39
|
+
"immersive": "全屏模式"
|
|
40
|
+
},
|
|
41
|
+
seo: [
|
|
42
|
+
{ type: 'title', text: "在线线索墙制作器:整理侦探RPG线索与人物关系地图", level: 2 },
|
|
43
|
+
{ type: 'paragraph', html: "在侦探RPG中,理清复杂的谎言网络、追踪嫌疑人的不在场证明并连接案发现场证据,很容易让玩家感到混乱。无论是运行《克苏鲁的呼唤》跑团、赛博朋克谋杀谜案、D&D侦探冒险,还是撰写悬疑小说,我们的在线线索墙制作器都是终极工具。在无限的数字化软木板上拖放、分类并关联线索、NPC和实体物证。使用彩色关系连线,瞬间直观查看嫌疑人与案发现场、不在场证明以及隐藏动机的关系。" },
|
|
44
|
+
{
|
|
45
|
+
type: 'stats',
|
|
46
|
+
items: [
|
|
47
|
+
{ value: "无限制", label: "节点画板" },
|
|
48
|
+
{ value: "4", label: "节点类别" },
|
|
49
|
+
{ value: "拖拽操作", label: "操作界面" }
|
|
50
|
+
],
|
|
51
|
+
columns: 3
|
|
52
|
+
},
|
|
53
|
+
{ type: 'title', text: "侦探RPG调查画板整理技巧", level: 2 },
|
|
54
|
+
{ type: 'tip', title: "三线索原则", html: "对于你希望玩家得出的每个结论或推理,在调查画板上至少添加三个不同的线索。使用自定义的彩色连线将它们连接起来,展示不同的推理路径。使用人物卡代表嫌疑人与证人,地点卡代表案发现场,道具卡代表物证或文档。根据玩家的发现及时更新私人备注。" },
|
|
55
|
+
{ type: 'title', text: "数字线索墙与实体软木板对比", level: 2 },
|
|
56
|
+
{
|
|
57
|
+
type: 'proscons',
|
|
58
|
+
title: "数字线索墙与实体软木板对比",
|
|
59
|
+
items: [
|
|
60
|
+
{ pro: "无限的画板尺寸,可根据需要添加任意数量的线索、嫌疑人和人物关系,不受空间限制。", con: "桌面跑团时需要在游戏桌上准备屏幕、平板电脑或数字化设备。" },
|
|
61
|
+
{ pro: "即时搜索和类别过滤器,可在游戏过程中立即定位特定证人或物证。", con: "缺少在真实墙壁上使用图钉和真实红毛线连接的实体触感。" },
|
|
62
|
+
{ pro: "数字化保存、加载和分享调查地图,在游戏间隙不占用任何物理空间。", con: "需要互联网连接或浏览器本地存储来保存画板状态。" }
|
|
63
|
+
]
|
|
64
|
+
},
|
|
65
|
+
{ type: 'title', text: "为你的谜题地图选择卡片类别", level: 3 },
|
|
66
|
+
{
|
|
67
|
+
type: 'comparative',
|
|
68
|
+
items: [
|
|
69
|
+
{
|
|
70
|
+
title: "人物节点",
|
|
71
|
+
description: "代表NPC、嫌疑人、证人或组织。使用彩色连线突出人物关系。",
|
|
72
|
+
icon: 'mdi:account-group',
|
|
73
|
+
highlight: true,
|
|
74
|
+
points: [
|
|
75
|
+
"追踪嫌疑人不在场证明与动机",
|
|
76
|
+
"关联家族关系与秘密组织结盟",
|
|
77
|
+
"记录证人证言的详细内容"
|
|
78
|
+
]
|
|
79
|
+
},
|
|
80
|
+
{
|
|
81
|
+
title: "线索节点",
|
|
82
|
+
description: "代表玩家在跑团过程中发现的实体物证、尸检报告、不在场证明或传闻。",
|
|
83
|
+
icon: 'mdi:magnify',
|
|
84
|
+
highlight: false,
|
|
85
|
+
points: [
|
|
86
|
+
"尸检报告与法医鉴定数据",
|
|
87
|
+
"从案发现场收集到的实体物品",
|
|
88
|
+
"听到的传闻与泄露的秘密"
|
|
89
|
+
]
|
|
90
|
+
},
|
|
91
|
+
{
|
|
92
|
+
title: "地点节点",
|
|
93
|
+
description: "案发现场、嫌疑人住宅、秘密藏身处或城市。",
|
|
94
|
+
icon: 'mdi:map-marker',
|
|
95
|
+
highlight: false,
|
|
96
|
+
points: [
|
|
97
|
+
"案发现场照片与平面图",
|
|
98
|
+
"关键NPC的住所与工作地",
|
|
99
|
+
"秘密据点与异次元传送门"
|
|
100
|
+
]
|
|
101
|
+
}
|
|
102
|
+
],
|
|
103
|
+
columns: 3
|
|
104
|
+
},
|
|
105
|
+
{ type: 'title', text: "线索墙专业术语表", level: 3 },
|
|
106
|
+
{
|
|
107
|
+
type: 'glossary',
|
|
108
|
+
items: [
|
|
109
|
+
{ term: "调查节点", definition: "画布上代表人物、地点、线索或道具 hard card 卡片。" },
|
|
110
|
+
{ term: "关系连线", definition: "连接两张卡片的彩色线条,指示它们的关系(例如:嫌疑人、不在场证明、所有者)。" },
|
|
111
|
+
{ term: "沉浸模式", definition: "隐藏控制面板的全屏布局,可最大化移动端或平板上的画布工作空间。" },
|
|
112
|
+
{ term: "高亮路径", definition: "仅彩色显示与所选卡片直接相连的节点和连线,同时将画板其余部分变暗的视觉效果。" }
|
|
113
|
+
]
|
|
114
|
+
},
|
|
115
|
+
{
|
|
116
|
+
type: 'diagnostic',
|
|
117
|
+
variant: 'info',
|
|
118
|
+
title: "移动端性能建议",
|
|
119
|
+
icon: 'mdi:information-outline',
|
|
120
|
+
badge: 'GRID TIP',
|
|
121
|
+
html: "如果旧款平板电脑上拖拽节点较慢,请开启沉浸模式以隐藏浮动菜单。确保启用了网格吸附(卡片每15像素吸附对齐),以便轻松保持画板整洁。"
|
|
122
|
+
}
|
|
123
|
+
],
|
|
124
|
+
faq: [
|
|
125
|
+
{ question: "如何添加连接线?", answer: "点击控制面板中的“添加连接”,或点击卡片上的链接图标,然后选择目标卡片。" },
|
|
126
|
+
{ question: "我可以在手机上拖动卡片吗?", answer: "可以,画板支持触摸手势,可在智能手机和平板电脑上流畅地拖动和移动卡片。" },
|
|
127
|
+
{ question: "我可以使用自定义的卡片颜色吗?", answer: "可以。双击卡片,在类别下选择 Custom,然后选择高亮颜色。" },
|
|
128
|
+
{ question: "画板会保存我的工作吗?", answer: "会。您的进度会自动保存在浏览器的本地存储中,保存在当前画板名称下。" },
|
|
129
|
+
{ question: "如何放大、缩小和移动画板?", answer: "使用双指捏合手势或鼠标滚轮进行放大和缩小。拖动背景可在画布上平移移动。" }
|
|
130
|
+
],
|
|
131
|
+
bibliography,
|
|
132
|
+
howTo: [
|
|
133
|
+
{ name: "添加调查卡片", text: "创建代表NPC、线索、案发现场或道具的卡片。" },
|
|
134
|
+
{ name: "关联关系", text: "在卡片之间创建连接线,以显示线索之间的关联。" }
|
|
135
|
+
],
|
|
136
|
+
schemas: [
|
|
137
|
+
{
|
|
138
|
+
'@context': 'https://schema.org',
|
|
139
|
+
'@type': 'SoftwareApplication',
|
|
140
|
+
'name': "线索墙制作器:在线侦探RPG线索与人物关系图整理工具",
|
|
141
|
+
'operatingSystem': 'All',
|
|
142
|
+
'applicationCategory': 'UtilitiesApplication',
|
|
143
|
+
'browserRequirements': 'Requires HTML5 SVG support. Requires JavaScript.'
|
|
144
|
+
},
|
|
145
|
+
{
|
|
146
|
+
'@context': 'https://schema.org',
|
|
147
|
+
'@type': 'FAQPage',
|
|
148
|
+
'mainEntity': [
|
|
149
|
+
{
|
|
150
|
+
'@type': 'Question',
|
|
151
|
+
'name': "如何添加连接线?",
|
|
152
|
+
'acceptedAnswer': {
|
|
153
|
+
'@type': 'Answer',
|
|
154
|
+
'text': "点击控制面板中的“添加连接”,或点击卡片上的链接图标,然后选择目标卡片。"
|
|
155
|
+
}
|
|
156
|
+
},
|
|
157
|
+
{
|
|
158
|
+
'@type': 'Question',
|
|
159
|
+
'name': "我可以在手机上拖动卡片吗?",
|
|
160
|
+
'acceptedAnswer': {
|
|
161
|
+
'@type': 'Answer',
|
|
162
|
+
'text': "可以,画板支持触摸手势,可在智能手机和平板电脑上流畅地拖动和移动卡片。"
|
|
163
|
+
}
|
|
164
|
+
},
|
|
165
|
+
{
|
|
166
|
+
'@type': 'Question',
|
|
167
|
+
'name': "我可以使用自定义的卡片颜色吗?",
|
|
168
|
+
'acceptedAnswer': {
|
|
169
|
+
'@type': 'Answer',
|
|
170
|
+
'text': "可以。双击卡片,在类别下选择 Custom,然后选择高亮颜色。"
|
|
171
|
+
}
|
|
172
|
+
},
|
|
173
|
+
{
|
|
174
|
+
'@type': 'Question',
|
|
175
|
+
'name': "画板会保存我的工作吗?",
|
|
176
|
+
'acceptedAnswer': {
|
|
177
|
+
'@type': 'Answer',
|
|
178
|
+
'text': "会。您的进度会自动保存在浏览器的本地存储中,保存在当前画板名称下。"
|
|
179
|
+
}
|
|
180
|
+
},
|
|
181
|
+
{
|
|
182
|
+
'@type': 'Question',
|
|
183
|
+
'name': "如何放大、缩小和移动画板?",
|
|
184
|
+
'acceptedAnswer': {
|
|
185
|
+
'@type': 'Answer',
|
|
186
|
+
'text': "使用双指捏合手势或鼠标滚轮进行放大和缩小。拖动背景可在画布上平移移动。"
|
|
187
|
+
}
|
|
188
|
+
}
|
|
189
|
+
]
|
|
190
|
+
},
|
|
191
|
+
{
|
|
192
|
+
'@context': 'https://schema.org',
|
|
193
|
+
'@type': 'HowTo',
|
|
194
|
+
'name': "线索墙制作器使用方法",
|
|
195
|
+
'step': [
|
|
196
|
+
{
|
|
197
|
+
'@type': 'HowToStep',
|
|
198
|
+
'name': "添加调查卡片",
|
|
199
|
+
'text': "创建代表NPC、线索、案发现场或道具的卡片。"
|
|
200
|
+
},
|
|
201
|
+
{
|
|
202
|
+
'@type': 'HowToStep',
|
|
203
|
+
'name': "关联关系",
|
|
204
|
+
'text': "在卡片之间创建连接线,以显示线索之间的关联。"
|
|
205
|
+
}
|
|
206
|
+
]
|
|
207
|
+
}
|
|
208
|
+
]
|
|
209
|
+
};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { ToolDefinition } from '../../types';
|
|
2
|
+
import { investigationBoard } from './entry';
|
|
3
|
+
|
|
4
|
+
export * from './entry';
|
|
5
|
+
|
|
6
|
+
export const INVESTIGATION_BOARD_TOOL: ToolDefinition = {
|
|
7
|
+
entry: investigationBoard,
|
|
8
|
+
Component: () => import('./component.astro'),
|
|
9
|
+
SEOComponent: () => import('./seo.astro'),
|
|
10
|
+
BibliographyComponent: () => import('./bibliography.astro'),
|
|
11
|
+
};
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import interact from 'interactjs';
|
|
2
|
+
import { state } from './dom';
|
|
3
|
+
import { getHighlightPath } from './logic';
|
|
4
|
+
import { drawConnections } from './renderer';
|
|
5
|
+
import { adjustBoardSize } from './layout';
|
|
6
|
+
import { saveState } from './stateManager';
|
|
7
|
+
import { cancelLongPress } from './boardContextMenu';
|
|
8
|
+
|
|
9
|
+
interface DragEvent {
|
|
10
|
+
target: HTMLElement;
|
|
11
|
+
dx: number;
|
|
12
|
+
dy: number;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
function handleDragStart(event: DragEvent): void {
|
|
16
|
+
cancelLongPress();
|
|
17
|
+
event.target.classList.add('dragging');
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
function handleDragMove(event: DragEvent): void {
|
|
21
|
+
cancelLongPress();
|
|
22
|
+
const target = event.target;
|
|
23
|
+
const id = target.id.replace('node-', '');
|
|
24
|
+
const n = state.nodes.find((item) => item.id === id);
|
|
25
|
+
if (n) {
|
|
26
|
+
let newX = n.x + event.dx / state.zoomScale;
|
|
27
|
+
let newY = n.y + event.dy / state.zoomScale;
|
|
28
|
+
newX = Math.round(newX / 15) * 15;
|
|
29
|
+
newY = Math.round(newY / 15) * 15;
|
|
30
|
+
n.x = newX;
|
|
31
|
+
n.y = newY;
|
|
32
|
+
target.style.left = `${newX}px`;
|
|
33
|
+
target.style.top = `${newY}px`;
|
|
34
|
+
const highlight = state.highlightedNodeId
|
|
35
|
+
? getHighlightPath(state.connections, state.highlightedNodeId)
|
|
36
|
+
: null;
|
|
37
|
+
drawConnections(highlight);
|
|
38
|
+
adjustBoardSize();
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
function handleDragEnd(event: DragEvent): void {
|
|
43
|
+
const target = event.target;
|
|
44
|
+
target.classList.remove('dragging');
|
|
45
|
+
saveState();
|
|
46
|
+
adjustBoardSize();
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
export function initializeDrag(): void {
|
|
50
|
+
interact('.board-node').draggable({
|
|
51
|
+
inertia: true,
|
|
52
|
+
listeners: {
|
|
53
|
+
start: (event: DragEvent) => handleDragStart(event),
|
|
54
|
+
move: (event: DragEvent) => handleDragMove(event),
|
|
55
|
+
end: (event: DragEvent) => handleDragEnd(event),
|
|
56
|
+
},
|
|
57
|
+
});
|
|
58
|
+
}
|