feat(npcs): inspect cards, Show overlay, and optional external link

Clicking an NPC tile opens description cards (multi-select accordion); Show puts avatars on screen. Optional URL opens a webview tab. Avatar pan in the editor commits on pointer up.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Ivan Fontosh
2026-08-19 10:42:57 +08:00
parent 1a9f0f2557
commit 0f4bb76b41
35 changed files with 1189 additions and 259 deletions
+20 -4
View File
@@ -211,7 +211,7 @@ export const EDITOR_MESSAGES: Record<EditorLocale, Record<string, string>> = {
'help.section.npcs.title': 'НПС',
'help.section.npcs.body':
'НПС — персонажи кампании с аватаром, описанием и однонаправленными связями между собой. Они общие для проекта.\n\nВ редакторе:\n\n1) В блоке «Свойства игры» нажмите «НПС» — откроется отдельное окно редактора персонажей.\n\n2) «Добавить» — укажите уникальное имя и обязательный аватар (PNG, JPG или WebP): кнопка выбора или перетаскивание файла. При необходимости сразу заполните описание.\n\n3) Слева — список персонажей: поиск, порядок перетаскиванием; меню «⋮» — только удаление (с подтверждением; все связи с этим персонажем тоже удаляются). Персонажей можно объединять в группы (и подгруппы): создайте группу и перетащите НПС в неё или оставьте «Без группы». На графе связей доступен фильтр по группе.\n\n4) В центре — граф связей: протяните стрелку от одного персонажа к другому и укажите обязательное название связи.\n\n5) Справа — карточка выбранного персонажа: настройте круглый токен, цвет рамки, положение аватара (перетаскивание и колесо мыши для масштаба), имя, описание, группу и отношения. Поле «Тип» задаёт отношение: враждебный, нейтральный или дружественный — от этого зависит цвет кольца токена на карте.\n\n6) В «Редакторе сцены» раскройте «НПС» и перетащите персонажа на карту. Круглый токен можно двигать и менять его размер.\n\nВо время сессии на пульте токен НПС можно двигать; правый клик по маркеру:\n• если токен неактивен — «Сделать активным»;\n• если активен — «Открыть информацию» (карточка НПС), смена типа (враждебный / нейтральный / дружественный) и «Сделать неактивным».\nНа презентации токены только отображаются. Подробнее о пульте — в разделе «Пульт управления».',
'НПС — персонажи кампании с аватаром, описанием и однонаправленными связями между собой. Они общие для проекта.\n\nВ редакторе:\n\n1) В блоке «Свойства игры» нажмите «НПС» — откроется отдельное окно редактора персонажей.\n\n2) «Добавить» — укажите уникальное имя и обязательный аватар (PNG, JPG или WebP): кнопка выбора или перетаскивание файла. При необходимости сразу заполните описание.\n\n3) Слева — список персонажей: поиск, порядок перетаскиванием; меню «⋮» — только удаление (с подтверждением; все связи с этим персонажем тоже удаляются). Персонажей можно объединять в группы (и подгруппы): создайте группу и перетащите НПС в неё или оставьте «Без группы». На графе связей доступен фильтр по группе.\n\n4) В центре — граф связей: протяните стрелку от одного персонажа к другому и укажите обязательное название связи.\n\n5) Справа — карточка выбранного персонажа: настройте круглый токен, цвет рамки, положение аватара (перетаскивание и колесо мыши для масштаба), имя, описание, необязательную внешнюю ссылку (страница в браузере внутри окна НПС на сессии), группу и отношения. Поле «Тип» задаёт отношение: враждебный, нейтральный или дружественный — от этого зависит цвет кольца токена на карте.\n\n6) В «Редакторе сцены» раскройте «НПС» и перетащите персонажа на карту. Круглый токен можно двигать и менять его размер.\n\nВо время сессии на пульте токен НПС можно двигать; правый клик по маркеру:\n• если токен неактивен — «Сделать активным»;\n• если активен — «Открыть информацию» (карточка в окне НПС), смена типа (враждебный / нейтральный / дружественный) и «Сделать неактивным».\nВ окне НПС клик по плитке открывает карточку слева (можно несколько сразу; у каждой аккордеон). Чекбокс «Показать» выводит аватар на экран игроков. Если задана внешняя ссылка, у карточки вкладки «Описание» и «Внешняя ссылка».\nНа презентации токены только отображаются. Подробнее о пульте — в разделе «Пульт управления».',
'help.section.session.title': 'Запуск сессии',
'help.section.session.body':
@@ -473,6 +473,8 @@ export const EDITOR_MESSAGES: Record<EditorLocale, Record<string, string>> = {
'npcs.avatarEmpty': 'Аватар не выбран',
'npcs.avatarRequired': 'Выберите аватар.',
'npcs.chooseAvatar': 'Выбрать аватар',
'npcs.avatarPickHint': 'Нажмите или перетащите изображение (PNG, JPG, WebP)',
'npcs.changeAvatar': 'Сменить аватар',
'npcs.dropHint': 'Перетащите изображение (PNG, JPG, WebP)',
'npcs.disposition': 'ТИП',
'npcs.disposition.hostile': 'Враждебный',
@@ -488,6 +490,12 @@ export const EDITOR_MESSAGES: Record<EditorLocale, Record<string, string>> = {
'npcs.description': 'ОПИСАНИЕ',
'npcs.descriptionPlaceholder': 'Описание персонажа…',
'npcs.descriptionEmpty': 'Описание отсутствует',
'npcs.externalLink': 'ВНЕШНЯЯ ССЫЛКА',
'npcs.externalLinkPlaceholder': 'https://…',
'npcs.externalLinkInvalid': 'Нужна ссылка http или https.',
'npcs.tabDescription': 'Описание',
'npcs.tabExternalLink': 'Внешняя ссылка',
'npcs.showOnScreen': 'Показать',
'npcs.relations': 'Отношения',
'npcs.untitled': 'Без имени',
'npcs.deleteTitle': 'Удаление НПС',
@@ -506,7 +514,7 @@ export const EDITOR_MESSAGES: Record<EditorLocale, Record<string, string>> = {
'npcs.graphZoomOut': 'Уменьшить',
'npcs.graphFitAll': 'Показать всё',
'npcs.windowEmpty': 'Добавьте НПС в редакторе.',
'npcs.selectToShow': 'Выберите персонажа в списке — он появится на экране.',
'npcs.selectToShow': 'Выберите персонажей в списке — карточки откроются слева. Чекбокс «Показать» выводит аватар на экран.',
'npcs.closeOverlay': 'Закрыть всех',
'npcs.rotateOverlay': 'Повернуть',
'npcs.zoomIn': 'Увеличить',
@@ -838,7 +846,7 @@ export const EDITOR_MESSAGES: Record<EditorLocale, Record<string, string>> = {
'help.section.npcs.title': 'NPCs',
'help.section.npcs.body':
'NPCs are campaign characters with an avatar, description, and one-way relations between them. They belong to the project.\n\nIn the editor:\n\n1) Under Game properties, click NPCs to open the character editor window.\n\n2) Add — enter a unique name and a required avatar (PNG, JPG, or WebP) via Choose image or by dropping a file. Fill in the description if needed.\n\n3) On the left — character list: search, reorder by drag-and-drop; the ⋮ menu only deletes (with confirmation; relations to that character are removed too). Characters can be organized into groups (and subgroups): create a group and drag NPCs into it, or leave them Ungrouped. The relation graph has a group filter.\n\n4) In the center — relation graph: drag an arrow from one character to another and enter a required relation title.\n\n5) On the right — selected character card: circular token, ring color, avatar position (drag and mouse wheel to zoom), name, description, group, and relations. Type sets disposition: hostile, neutral, or friendly — it controls the ring color on the map.\n\n6) In Scene editor, expand NPCs and drag a character onto the map. The circular marker can be moved and resized.\n\nDuring a session on the control panel you can move NPC tokens; right-click a marker:\n• if inactive — Make active;\n• if active — Open information (NPC card), change type (hostile / neutral / friendly), and Make inactive.\nOn presentation tokens are display-only. See Control panel for more.',
'NPCs are campaign characters with an avatar, description, and one-way relations between them. They belong to the project.\n\nIn the editor:\n\n1) Under Game properties, click NPCs to open the character editor window.\n\n2) Add — enter a unique name and a required avatar (PNG, JPG, or WebP) via Choose image or by dropping a file. Fill in the description if needed.\n\n3) On the left — character list: search, reorder by drag-and-drop; the ⋮ menu only deletes (with confirmation; relations to that character are removed too). Characters can be organized into groups (and subgroups): create a group and drag NPCs into it, or leave them Ungrouped. The relation graph has a group filter.\n\n4) In the center — relation graph: drag an arrow from one character to another and enter a required relation title.\n\n5) On the right — selected character card: circular token, ring color, avatar position (drag and mouse wheel to zoom), name, description, optional external link (opens as a page in the session NPCs window), group, and relations. Type sets disposition: hostile, neutral, or friendly — it controls the ring color on the map.\n\n6) In Scene editor, expand NPCs and drag a character onto the map. The circular marker can be moved and resized.\n\nDuring a session on the control panel you can move NPC tokens; right-click a marker:\n• if inactive — Make active;\n• if active — Open information (card in the NPCs window), change type (hostile / neutral / friendly), and Make inactive.\nIn the NPCs window, click a tile to open the card on the left (several at once; each is an accordion). The Show checkbox puts the avatar on the player screen. If an external link is set, the card has Description and External link tabs.\nOn presentation tokens are display-only. See Control panel for more.',
'help.section.session.title': 'Starting a session',
'help.section.session.body':
@@ -1102,6 +1110,8 @@ export const EDITOR_MESSAGES: Record<EditorLocale, Record<string, string>> = {
'npcs.avatarEmpty': 'No avatar selected',
'npcs.avatarRequired': 'Choose an avatar.',
'npcs.chooseAvatar': 'Choose avatar',
'npcs.avatarPickHint': 'Click or drop an image (PNG, JPG, WebP)',
'npcs.changeAvatar': 'Change avatar',
'npcs.dropHint': 'Drop an image (PNG, JPG, WebP)',
'npcs.disposition': 'TYPE',
'npcs.disposition.hostile': 'Hostile',
@@ -1117,6 +1127,12 @@ export const EDITOR_MESSAGES: Record<EditorLocale, Record<string, string>> = {
'npcs.description': 'DESCRIPTION',
'npcs.descriptionPlaceholder': 'Character description…',
'npcs.descriptionEmpty': 'No description',
'npcs.externalLink': 'EXTERNAL LINK',
'npcs.externalLinkPlaceholder': 'https://…',
'npcs.externalLinkInvalid': 'Enter an http or https URL.',
'npcs.tabDescription': 'Description',
'npcs.tabExternalLink': 'External link',
'npcs.showOnScreen': 'Show',
'npcs.relations': 'Relations',
'npcs.untitled': 'Untitled',
'npcs.deleteTitle': 'Delete NPC',
@@ -1136,7 +1152,7 @@ export const EDITOR_MESSAGES: Record<EditorLocale, Record<string, string>> = {
'npcs.graphZoomOut': 'Zoom out',
'npcs.graphFitAll': 'Fit view',
'npcs.windowEmpty': 'Add NPCs in the editor.',
'npcs.selectToShow': 'Select a character in the list — they will appear on screen.',
'npcs.selectToShow': 'Select characters in the list — their cards open on the left. The Show checkbox puts the avatar on screen.',
'npcs.closeOverlay': 'Close all',
'npcs.rotateOverlay': 'Rotate',
'npcs.zoomIn': 'Zoom in',