Pakobbix/rpg-companion-sillytavern
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: json format, et al.

Browse Source
This commit is contained in:
Subarashimo
2025-12-03 14:55:30 +01:00
parent 56349f30e6
commit 0f7fdfcef1
28 changed files with 5692 additions and 237 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/systems/ui/desktop.js
+25 -7
View File
@@ -24,15 +24,22 @@ export function setupDesktopTabs() {
const $userStats = $('#rpg-user-stats');
const $infoBox = $('#rpg-info-box');
const $thoughts = $('#rpg-thoughts');
const $skills = $('#rpg-skills');
const $inventory = $('#rpg-inventory');
const $quests = $('#rpg-quests');
// If no sections exist, nothing to organize
if ($userStats.length === 0 && $infoBox.length === 0 && $thoughts.length === 0 && $inventory.length === 0 && $quests.length === 0) {
if ($userStats.length === 0 && $infoBox.length === 0 && $thoughts.length === 0 && $skills.length === 0 && $inventory.length === 0 && $quests.length === 0) {
return;
}
// Create tab navigation - conditionally show inventory and quests tabs based on settings
// Create tab navigation - conditionally show skills, inventory and quests tabs based on settings
const skillsTabHtml = extensionSettings.showSkills ? `
<button class="rpg-tab-btn" data-tab="skills">
<i class="fa-solid fa-star"></i>
<span data-i18n-key="global.skills">Skills</span>
</button>` : '';
const inventoryTabHtml = extensionSettings.showInventory ? `
<button class="rpg-tab-btn" data-tab="inventory">
<i class="fa-solid fa-box"></i>
@@ -50,12 +57,13 @@ export function setupDesktopTabs() {
<button class="rpg-tab-btn active" data-tab="status">
<i class="fa-solid fa-chart-simple"></i>
<span data-i18n-key="global.status">Status</span>
</button>${inventoryTabHtml}${questsTabHtml}
</button>${skillsTabHtml}${inventoryTabHtml}${questsTabHtml}
</div>
`);
// Create tab content containers
const $statusTab = $('<div class="rpg-tab-content active" data-tab-content="status"></div>');
const $skillsTab = $('<div class="rpg-tab-content" data-tab-content="skills"></div>');
const $inventoryTab = $('<div class="rpg-tab-content" data-tab-content="inventory"></div>');
const $questsTab = $('<div class="rpg-tab-content" data-tab-content="quests"></div>');
@@ -72,11 +80,15 @@ export function setupDesktopTabs() {
$statusTab.append($thoughts.detach());
$thoughts.show();
}
if ($inventory.length > 0) {
if (extensionSettings.showSkills && $skills.length > 0) {
$skillsTab.append($skills.detach());
$skills.show();
}
if (extensionSettings.showInventory && $inventory.length > 0) {
$inventoryTab.append($inventory.detach());
$inventory.show();
}
if ($quests.length > 0) {
if (extensionSettings.showQuests && $quests.length > 0) {
$questsTab.append($quests.detach());
$quests.show();
}
@@ -88,6 +100,7 @@ export function setupDesktopTabs() {
const $tabsContainer = $('<div class="rpg-tabs-container"></div>');
$tabsContainer.append($tabNav);
$tabsContainer.append($statusTab);
$tabsContainer.append($skillsTab);
$tabsContainer.append($inventoryTab);
$tabsContainer.append($questsTab);
@@ -120,27 +133,30 @@ export function removeDesktopTabs() {
const $userStats = $('#rpg-user-stats').detach();
const $infoBox = $('#rpg-info-box').detach();
const $thoughts = $('#rpg-thoughts').detach();
const $skills = $('#rpg-skills').detach();
const $inventory = $('#rpg-inventory').detach();
const $quests = $('#rpg-quests').detach();
// Remove tabs container
$('.rpg-tabs-container').remove();
// Get dividers (all 4 dividers in the template)
// Get dividers (all 5 dividers in the template)
const $dividerStats = $('#rpg-divider-stats');
const $dividerInfo = $('#rpg-divider-info');
const $dividerThoughts = $('#rpg-divider-thoughts');
const $dividerSkills = $('#rpg-divider-skills');
const $dividerInventory = $('#rpg-divider-inventory');
// Restore original sections to content box in correct order
const $contentBox = $('.rpg-content-box');
// Re-insert sections in original order: User Stats, Info Box, Thoughts, Inventory, Quests
// Re-insert sections in original order: User Stats, Info Box, Thoughts, Skills, Inventory, Quests
// Each section goes before its corresponding divider
if ($dividerStats.length) {
$dividerStats.before($userStats);
$dividerInfo.before($infoBox);
$dividerThoughts.before($thoughts);
$dividerSkills.before($skills);
$dividerInventory.before($inventory);
$contentBox.append($quests);
} else {
@@ -148,6 +164,7 @@ export function removeDesktopTabs() {
$contentBox.append($userStats);
$contentBox.append($infoBox);
$contentBox.append($thoughts);
$contentBox.append($skills);
$contentBox.append($inventory);
$contentBox.append($quests);
}
@@ -156,6 +173,7 @@ export function removeDesktopTabs() {
$userStats.show();
$infoBox.show();
$thoughts.show();
$skills.show();
$inventory.show();
$quests.show();
$('.rpg-divider').show();
src/systems/ui/layout.js
+13 -4
View File
@@ -9,6 +9,7 @@ import {
$userStatsContainer,
$infoBoxContainer,
$thoughtsContainer,
$skillsContainer,
$inventoryContainer,
$questsContainer
} from '../../core/state.js';
@@ -228,6 +229,9 @@ export function updateSectionVisibility() {
$userStatsContainer.toggle(extensionSettings.showUserStats);
$infoBoxContainer.toggle(extensionSettings.showInfoBox);
$thoughtsContainer.toggle(extensionSettings.showCharacterThoughts);
if ($skillsContainer) {
$skillsContainer.toggle(extensionSettings.showSkills);
}
if ($inventoryContainer) {
$inventoryContainer.toggle(extensionSettings.showInventory);
}
@@ -238,19 +242,24 @@ export function updateSectionVisibility() {
// Show/hide dividers intelligently
// Divider after User Stats: shown if User Stats is visible AND at least one section after it is visible
const showDividerAfterStats = extensionSettings.showUserStats &&
(extensionSettings.showInfoBox || extensionSettings.showCharacterThoughts || extensionSettings.showInventory || extensionSettings.showQuests);
(extensionSettings.showInfoBox || extensionSettings.showCharacterThoughts || extensionSettings.showSkills || extensionSettings.showInventory || extensionSettings.showQuests);
$('#rpg-divider-stats').toggle(showDividerAfterStats);
// Divider after Info Box: shown if Info Box is visible AND at least one section after it is visible
const showDividerAfterInfo = extensionSettings.showInfoBox &&
(extensionSettings.showCharacterThoughts || extensionSettings.showInventory || extensionSettings.showQuests);
(extensionSettings.showCharacterThoughts || extensionSettings.showSkills || extensionSettings.showInventory || extensionSettings.showQuests);
$('#rpg-divider-info').toggle(showDividerAfterInfo);
// Divider after Thoughts: shown if Thoughts is visible AND Inventory or Quests is visible
// Divider after Thoughts: shown if Thoughts is visible AND Skills, Inventory or Quests is visible
const showDividerAfterThoughts = extensionSettings.showCharacterThoughts &&
(extensionSettings.showInventory || extensionSettings.showQuests);
(extensionSettings.showSkills || extensionSettings.showInventory || extensionSettings.showQuests);
$('#rpg-divider-thoughts').toggle(showDividerAfterThoughts);
// Divider after Skills: shown if Skills is visible AND Inventory or Quests is visible
const showDividerAfterSkills = extensionSettings.showSkills &&
(extensionSettings.showInventory || extensionSettings.showQuests);
$('#rpg-divider-skills').toggle(showDividerAfterSkills);
// Divider after Inventory: shown if Inventory is visible AND Quests is visible
const showDividerAfterInventory = extensionSettings.showInventory &&
extensionSettings.showQuests;
src/systems/ui/trackerEditor.js
+21 -2
View File
@@ -8,6 +8,7 @@ import { saveSettings } from '../../core/persistence.js';
import { renderUserStats } from '../rendering/userStats.js';
import { renderInfoBox } from '../rendering/infoBox.js';
import { renderThoughts } from '../rendering/thoughts.js';
import { renderSkills } from '../rendering/skills.js';
let $editorModal = null;
let activeTab = 'userStats';
@@ -287,10 +288,21 @@ function renderUserStatsTab() {
// Skills Section
html += `<h4><i class="fa-solid fa-star"></i> ${i18n.getTranslation('template.trackerEditorModal.userStatsTab.skillsSectionTitle')}</h4>`;
html += '<div class="rpg-editor-toggle-row">';
html += `<input type="checkbox" id="rpg-skills-enabled" ${config.skillsSection.enabled ? 'checked' : ''}>`;
// Check if skills are shown as separate section - if so, disable the toggle
const skillsInSeparateTab = extensionSettings.showSkills;
const skillsToggleDisabled = skillsInSeparateTab ? 'disabled' : '';
const skillsToggleStyle = skillsInSeparateTab ? 'style="opacity: 0.5; cursor: not-allowed;"' : '';
html += `<div class="rpg-editor-toggle-row" ${skillsToggleStyle}>`;
html += `<input type="checkbox" id="rpg-skills-enabled" ${config.skillsSection.enabled ? 'checked' : ''} ${skillsToggleDisabled}>`;
html += `<label for="rpg-skills-enabled">${i18n.getTranslation('template.trackerEditorModal.userStatsTab.enableSkillsSection')}</label>`;
html += '</div>';
// Show note when skills are in separate tab
if (skillsInSeparateTab) {
html += `<small style="display: block; margin-top: -8px; margin-bottom: 12px; color: #888; font-size: 11px;" data-i18n-key="template.trackerEditorModal.userStatsTab.skillsInSeparateTabNote">${i18n.getTranslation('template.trackerEditorModal.userStatsTab.skillsInSeparateTabNote')}</small>`;
}
html += `<label>${i18n.getTranslation('template.trackerEditorModal.userStatsTab.skillsLabelLabel')}</label>`;
html += `<input type="text" id="rpg-skills-label" value="${config.skillsSection.label}" class="rpg-text-input" placeholder="Skills">`;
@@ -415,17 +427,24 @@ function setupUserStatsListeners() {
// Skills section toggles
$('#rpg-skills-enabled').off('change').on('change', function() {
extensionSettings.trackerConfig.userStats.skillsSection.enabled = $(this).is(':checked');
saveSettings();
// Re-render both user stats (if skills shown there) and skills section
renderUserStats();
renderSkills();
});
$('#rpg-skills-label').off('blur').on('blur', function() {
extensionSettings.trackerConfig.userStats.skillsSection.label = $(this).val();
saveSettings();
renderUserStats();
});
$('#rpg-skills-fields').off('blur').on('blur', function() {
const fields = $(this).val().split(',').map(f => f.trim()).filter(f => f);
extensionSettings.trackerConfig.userStats.skillsSection.customFields = fields;
saveSettings();
// Re-render skills section when skills list changes
renderSkills();
});
}