';
+
// Row 1: Date, Weather, Temperature, Time widgets
- let html = '
';
+ html += '
';
// Calendar widget - always show (editable even if empty)
// Display abbreviated version but allow editing full value
@@ -301,6 +355,67 @@ export function renderInfoBox() {
`;
+ // Row 3: Recent Events widget (notebook style) - dynamically show 1-3 events
+ // Parse Recent Events from infoBox string
+ let recentEvents = [];
+ if (committedTrackerData.infoBox) {
+ const recentEventsLine = committedTrackerData.infoBox.split('\n').find(line => line.startsWith('Recent Events:'));
+ if (recentEventsLine) {
+ const eventsString = recentEventsLine.replace('Recent Events:', '').trim();
+ if (eventsString) {
+ recentEvents = eventsString.split(',').map(e => e.trim()).filter(e => e);
+ }
+ }
+ }
+
+ const validEvents = recentEvents.filter(e => e && e.trim() && e !== 'Event 1' && e !== 'Event 2' && e !== 'Event 3');
+
+ // If no valid events, show at least one placeholder
+ if (validEvents.length === 0) {
+ validEvents.push('Click to add event');
+ }
+
+ html += `
+
+ `;
+
+ // Close the scrollable content wrapper
+ html += '
';
+
$infoBoxContainer.html(html);
// Add event handlers for editable Info Box fields
@@ -320,7 +435,12 @@ export function renderInfoBox() {
}
}
- updateInfoBoxField(field, value);
+ // Handle recent events separately
+ if (field === 'event1' || field === 'event2' || field === 'event3') {
+ updateRecentEvent(field, value);
+ } else {
+ updateInfoBoxField(field, value);
+ }
});
// For date fields, show full value on focus
@@ -610,3 +730,84 @@ export function updateInfoBoxField(field, value) {
renderInfoBox();
}
}
+
+/**
+ * Update a recent event in the committed tracker data
+ * @param {string} field - event1, event2, or event3
+ * @param {string} value - New event text
+ */
+function updateRecentEvent(field, value) {
+ // Map field to index
+ const eventIndex = {
+ 'event1': 0,
+ 'event2': 1,
+ 'event3': 2
+ }[field];
+
+ if (eventIndex !== undefined) {
+ // Parse current infoBox to get existing events
+ const lines = (committedTrackerData.infoBox || '').split('\n');
+ let recentEvents = [];
+
+ // Find existing Recent Events line
+ const recentEventsLine = lines.find(line => line.startsWith('Recent Events:'));
+ if (recentEventsLine) {
+ const eventsString = recentEventsLine.replace('Recent Events:', '').trim();
+ if (eventsString) {
+ recentEvents = eventsString.split(',').map(e => e.trim()).filter(e => e);
+ }
+ }
+
+ // Ensure array has enough slots
+ while (recentEvents.length <= eventIndex) {
+ recentEvents.push('');
+ }
+
+ // Update the specific event
+ recentEvents[eventIndex] = value;
+
+ // Filter out empty events and rebuild the line
+ const validEvents = recentEvents.filter(e => e && e.trim());
+ const newRecentEventsLine = validEvents.length > 0
+ ? `Recent Events: ${validEvents.join(', ')}`
+ : '';
+
+ // Update infoBox with new Recent Events line
+ const updatedLines = lines.filter(line => !line.startsWith('Recent Events:'));
+ if (newRecentEventsLine) {
+ // Add Recent Events line at the end (before any empty lines)
+ let insertIndex = updatedLines.length;
+ for (let i = updatedLines.length - 1; i >= 0; i--) {
+ if (updatedLines[i].trim() !== '') {
+ insertIndex = i + 1;
+ break;
+ }
+ }
+ updatedLines.splice(insertIndex, 0, newRecentEventsLine);
+ }
+
+ committedTrackerData.infoBox = updatedLines.join('\n');
+ lastGeneratedData.infoBox = updatedLines.join('\n');
+
+ // Update the message's swipe data
+ const chat = getContext().chat;
+ if (chat && chat.length > 0) {
+ for (let i = chat.length - 1; i >= 0; i--) {
+ const message = chat[i];
+ if (!message.is_user) {
+ if (message.extra && message.extra.rpg_companion_swipes) {
+ const swipeId = message.swipe_id || 0;
+ if (message.extra.rpg_companion_swipes[swipeId]) {
+ message.extra.rpg_companion_swipes[swipeId].infoBox = updatedLines.join('\n');
+ }
+ }
+ break;
+ }
+ }
+ }
+
+ saveChatData();
+ renderInfoBox();
+ console.log(`[RPG Companion] Updated recent event ${field}:`, value);
+ }
+}
diff --git a/src/systems/rendering/quests.js b/src/systems/rendering/quests.js
new file mode 100644
index 0000000..efaa8da
--- /dev/null
+++ b/src/systems/rendering/quests.js
@@ -0,0 +1,306 @@
+/**
+ * Quests Rendering Module
+ * Handles UI rendering for quests system (main and optional quests)
+ */
+
+import { extensionSettings, $questsContainer } from '../../core/state.js';
+import { saveSettings } from '../../core/persistence.js';
+
+/**
+ * HTML escape helper
+ * @param {string} text - Text to escape
+ * @returns {string} Escaped HTML
+ */
+function escapeHtml(text) {
+ const div = document.createElement('div');
+ div.textContent = text;
+ return div.innerHTML;
+}
+
+/**
+ * Renders the quests sub-tab navigation (Main, Optional)
+ * @param {string} activeTab - Currently active sub-tab ('main', 'optional')
+ * @returns {string} HTML for sub-tab navigation
+ */
+export function renderQuestsSubTabs(activeTab = 'main') {
+ return `
+
+
+
+
+ `;
+}
+
+/**
+ * Renders the main quest view
+ * @param {string} mainQuest - Current main quest title
+ * @returns {string} HTML for main quest view
+ */
+export function renderMainQuestView(mainQuest) {
+ const questDisplay = (mainQuest && mainQuest !== 'None') ? mainQuest : '';
+ const hasQuest = questDisplay.length > 0;
+
+ return `
+
+
+
+ ${hasQuest ? `
+
+
+
${escapeHtml(questDisplay)}
+
+
+
+
+
+ ` : `
+
+
No active main quests
+ `}
+
+
+
+ The main quests represent your primary objective in the story.
+
+
+ `;
+}
+
+/**
+ * Renders the optional quests view
+ * @param {string[]} optionalQuests - Array of optional quest titles
+ * @returns {string} HTML for optional quests view
+ */
+export function renderOptionalQuestsView(optionalQuests) {
+ const quests = optionalQuests.filter(q => q && q !== 'None');
+
+ let questsHtml = '';
+ if (quests.length === 0) {
+ questsHtml = '
No active optional quests
';
+ } else {
+ questsHtml = quests.map((quest, index) => `
+
+
${escapeHtml(quest)}
+
+
+
+
+ `).join('');
+ }
+
+ return `
+
+
+
+
+
+ ${questsHtml}
+
+
+
+ Optional quests are side objectives that complement your main story.
+
+
+
+ `;
+}
+
+/**
+ * Main render function for quests
+ */
+export function renderQuests() {
+ if (!extensionSettings.showInventory || !$questsContainer) {
+ return;
+ }
+
+ // Get current sub-tab from container or default to 'main'
+ const activeSubTab = $questsContainer.data('active-subtab') || 'main';
+
+ // Get quests data
+ const mainQuest = extensionSettings.quests.main || 'None';
+ const optionalQuests = extensionSettings.quests.optional || [];
+
+ // Build HTML
+ let html = '
';
+ html += renderQuestsSubTabs(activeSubTab);
+
+ // Render active sub-tab
+ html += '
';
+ if (activeSubTab === 'main') {
+ html += renderMainQuestView(mainQuest);
+ } else {
+ html += renderOptionalQuestsView(optionalQuests);
+ }
+ html += '
';
+
+ $questsContainer.html(html);
+
+ // Attach event handlers
+ attachQuestEventHandlers();
+}
+
+/**
+ * Attach event handlers for quest interactions
+ */
+function attachQuestEventHandlers() {
+ // Sub-tab switching
+ $questsContainer.find('.rpg-quests-subtab').on('click', function() {
+ const tab = $(this).data('tab');
+ $questsContainer.data('active-subtab', tab);
+ renderQuests();
+ });
+
+ // Add quest button
+ $questsContainer.find('[data-action="add-quest"]').on('click', function() {
+ const field = $(this).data('field');
+ $(`#rpg-add-quest-form-${field}`).show();
+ $(`#rpg-new-quest-${field}`).focus();
+ });
+
+ // Cancel add quest
+ $questsContainer.find('[data-action="cancel-add-quest"]').on('click', function() {
+ const field = $(this).data('field');
+ $(`#rpg-add-quest-form-${field}`).hide();
+ $(`#rpg-new-quest-${field}`).val('');
+ });
+
+ // Save add quest
+ $questsContainer.find('[data-action="save-add-quest"]').on('click', function() {
+ const field = $(this).data('field');
+ const input = $(`#rpg-new-quest-${field}`);
+ const questTitle = input.val().trim();
+
+ if (questTitle) {
+ if (field === 'main') {
+ extensionSettings.quests.main = questTitle;
+ } else {
+ if (!extensionSettings.quests.optional) {
+ extensionSettings.quests.optional = [];
+ }
+ extensionSettings.quests.optional.push(questTitle);
+ }
+ saveSettings();
+ renderQuests();
+ }
+ });
+
+ // Edit quest (main only)
+ $questsContainer.find('[data-action="edit-quest"]').on('click', function() {
+ const field = $(this).data('field');
+ $(`#rpg-edit-quest-form-${field}`).show();
+ $('.rpg-quest-item[data-field="main"]').hide();
+ $(`#rpg-edit-quest-${field}`).focus();
+ });
+
+ // Cancel edit quest
+ $questsContainer.find('[data-action="cancel-edit-quest"]').on('click', function() {
+ const field = $(this).data('field');
+ $(`#rpg-edit-quest-form-${field}`).hide();
+ $('.rpg-quest-item[data-field="main"]').show();
+ });
+
+ // Save edit quest
+ $questsContainer.find('[data-action="save-edit-quest"]').on('click', function() {
+ const field = $(this).data('field');
+ const input = $(`#rpg-edit-quest-${field}`);
+ const questTitle = input.val().trim();
+
+ if (questTitle) {
+ extensionSettings.quests.main = questTitle;
+ saveSettings();
+ renderQuests();
+ }
+ });
+
+ // Remove quest
+ $questsContainer.find('[data-action="remove-quest"]').on('click', function() {
+ const field = $(this).data('field');
+ const index = $(this).data('index');
+
+ if (field === 'main') {
+ extensionSettings.quests.main = 'None';
+ } else {
+ extensionSettings.quests.optional.splice(index, 1);
+ }
+ saveSettings();
+ renderQuests();
+ });
+
+ // Inline editing for optional quests
+ $questsContainer.find('.rpg-quest-title.rpg-editable').on('blur', function() {
+ const $this = $(this);
+ const field = $this.data('field');
+ const index = $this.data('index');
+ const newTitle = $this.text().trim();
+
+ if (newTitle && field === 'optional' && index !== undefined) {
+ extensionSettings.quests.optional[index] = newTitle;
+ saveSettings();
+ }
+ });
+
+ // Enter key to save in forms
+ $questsContainer.find('.rpg-inline-input').on('keypress', function(e) {
+ if (e.which === 13) {
+ const field = $(this).attr('id').includes('edit') ?
+ $(this).attr('id').replace('rpg-edit-quest-', '') :
+ $(this).attr('id').replace('rpg-new-quest-', '');
+
+ if ($(this).attr('id').includes('edit')) {
+ $(`[data-action="save-edit-quest"][data-field="${field}"]`).click();
+ } else {
+ $(`[data-action="save-add-quest"][data-field="${field}"]`).click();
+ }
+ }
+ });
+}
diff --git a/src/systems/ui/desktop.js b/src/systems/ui/desktop.js
index 2b8e2a4..b7e07e2 100644
--- a/src/systems/ui/desktop.js
+++ b/src/systems/ui/desktop.js
@@ -22,9 +22,10 @@ export function setupDesktopTabs() {
const $infoBox = $('#rpg-info-box');
const $thoughts = $('#rpg-thoughts');
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) {
+ if ($userStats.length === 0 && $infoBox.length === 0 && $thoughts.length === 0 && $inventory.length === 0 && $quests.length === 0) {
return;
}
@@ -39,12 +40,17 @@ export function setupDesktopTabs() {
Inventory
+