- Reduced gap from 6px to 3px for more compact display
- Reduced vertical padding to 4px (from clamp(4px, 0.6vh, 6px))
- Tightened line-height from 1.3 to 1.2
- Reduced emoji size slightly (clamp(14px, 3.5vw, 18px))
- Frees up vertical space for attribute boxes and avatar on mobile
- Added min-height: 3em to rpg-calendar-day on mobile
- Increased vertical padding to 0.75em (from 0.25em default)
- Added line-height: 1.2 for tighter text
- Prevents date text from being pushed too high and cutting into box above
- Flexbox centering now has enough space to properly center content
- Moved refresh button creation from template.html to index.js (appended to body)
- Created new CSS class .rpg-mobile-refresh (exact copy of .rpg-mobile-toggle pattern)
- Uses opacity for show/hide instead of display (CSS controls visibility based on panel state)
- Show when panel open (body:has(.rpg-panel.rpg-mobile-open))
- Hide when panel closed (opacity: 0, pointer-events: none)
- Updated constrainFabToViewport() to accept optional button parameter
- Automatically detects which button and uses correct settings (mobileFabPosition or mobileRefreshPosition)
- Simplified updateGenerationModeUI() - CSS handles visibility
- Kept full drag functionality with touch and mouse support
- Button positioned via JavaScript with saved position
- z-index: 1001 (above panel, below toggle at 10002)
- Changed z-index from 99 to 1001
- Now properly layers: panel (1000) < refresh button (1001) < FAB toggle (10002)
- Refresh button is now visible when panel is open
- Changed .rpg-level-value padding from clamp(1px, 0.2vh, 2px) 0.375em to 0 0.375em
- Added mobile-specific override to prevent level value from inheriting large touch-friendly padding
- Level value now stays compact and properly aligned on mobile (no min-height, no vertical padding)
- Fixes misalignment and unwanted vertical space below level value
- Repositioned mobile refresh button to bottom-right (80px from bottom)
- Implemented full drag-to-reposition functionality
* Touch and mouse support with 200ms/10px threshold
* RequestAnimationFrame for smooth dragging
* Position saved to extensionSettings.mobileRefreshPosition
* Viewport constraints with 10px padding
- Fixed sticky tap highlight issue
* Added -webkit-tap-highlight-color: transparent
* Added blur() on click to remove focus
* Set user-select: none and touch-action: none
- Show/hide based on panel state
* Only visible when panel is expanded (rpg-mobile-open)
* Listens to rpg-panel-toggled events
* Auto-hides when panel closes
- Prevent accidental refresh after drag
* just-dragged flag prevents click for 100ms
* Click handler checks flag before executing
- Changed from absolute to fixed positioning for viewport-wide dragging
- Added mobileRefreshPosition to default settings (bottom: 80px, right: 20px)
- z-index: 99 (below FAB toggle at 100)
**Changes:**
1. Move button to float over all tabs (not just Stats)
- Removed from userStats.js HTML
- Added to template.html as floating absolute element
- Now visible on Status, Info, and Inventory tabs
2. Fix sticky black focus state
- Added :focus { outline: none } to CSS
- Call blur() after click to clear focus immediately
3. Add refresh animation
- Button spins during updateRPGData() call
- Smooth 0.8s rotation with @keyframes
- Uses .spinning class added/removed in JS
4. Improve theming and positioning
- Positioned absolute top-right (10px, 10px)
- Increased to 44px for better touch target
- z-index: 100 to float above content
- Already uses theme colors (--rpg-highlight, --rpg-text)
Mobile UX now:
✅ Button visible on all tabs (floating)
✅ Spins smoothly when refreshing
✅ No sticky black state after tap
✅ Properly themed across all themes
- Use SillyTavern macros ({{persona}}, {{description}}, {{personality}}) for character context
- Fix preset restoration after tracker generation using /preset command
- Fix weather editing bug by tracking specific weather line index
- Support both emoji and text formats for Info Box field editing
- Remove unused showdown import and fix missing semicolons
- Removed import of getCurrentPresetName (not available in SillyTavern)
- Simplified preset switching to not track/restore previous preset
- Removed restorePreset() function
- Fixes module loading error preventing extension activation
- Note: Users enabling separate preset will manually switch presets back
- Created inventoryEdit.js module with updateInventoryItem() function
- Made all inventory item names editable with contenteditable (mobile-friendly)
- Added rpg-editable class to 6 item rendering locations:
* On Person (grid and list views)
* Stored (grid and list views)
* Assets (grid and list views)
- Added blur event listener to save changes on edit
- Validates and sanitizes edited names using sanitizeItemName()
- Syncs changes to lastGeneratedData and committedTrackerData (AI-visible)
- Shows full item text when editing (not truncated)
- Consistent UX with other editable fields in extension (stats, character traits, etc.)
- Re-renders inventory after successful edit or reverts on invalid input
- Added namesMatch() helper function with three matching strategies:
1. Exact match (fast path)
2. Strip parentheses match (handles 'Sabrina' vs 'Sabrina (Avatar)')
3. Word boundary match (handles 'Sabrina' vs 'Princess Sabrina')
- Replaced exact string comparison with fuzzy matching in 3 places:
- Group member lookup
- All characters search
- Current character 1-on-1 chat
- Fixes issue where character portraits showed placeholder when AI added
parenthetical or title additions to character names
- Prevents false positives (e.g., 'Sabrina' won't match 'Sabrina's Mother')
- Added persistent '+ Add Item' button at bottom of each storage location
- Button is centered and always visible (whether location has 0 or many items)
- Removed redundant '+ Add' button from storage location header (kept trash button)
- Reverted empty state to simple message instead of special button
- Added CSS for .rpg-storage-add-item-container to center button with margin
- Matches UI pattern from On Person and Assets tabs
- Removed debug logging from inventoryActions.js
Fixes bug where empty storage locations (with "None" as items) were
being removed during validation, preventing users from adding items
to newly created locations.
Problem:
- User creates location "Spatial Pouch" with no items (stores as "None")
- On next load, validateStoredInventory() is called
- Previous logic: if cleanedValue === "None", remove location
- Result: Location deleted before user can add items to it
- Console: "Location 'Spatial Pouch' had no valid items, removing"
Root Cause:
Previous granular validation (commit dc603b8) was too aggressive:
```javascript
if (cleanedValue !== 'None') {
cleaned[sanitizedKey] = cleanedValue;
} else {
// Remove location ❌
}
```
Solution:
"None" is a VALID state - it means location exists but is empty.
Always keep locations, only warn if items were actually corrupted.
```javascript
// Always keep the location (even if empty/"None")
cleaned[sanitizedKey] = cleanedValue;
// Warn only if we cleaned corrupted items (not just "None")
if (value !== cleanedValue && value.toLowerCase() !== 'none') {
console.warn(`Cleaned corrupted items from "${sanitizedKey}"`);
}
```
Behavior Changes:
Before:
- Location with "None" → Removed ❌
- Location with "__proto__, Sword" → Removed (cleaned to "Sword") ❌
After:
- Location with "None" → Kept as "None" ✓
- Location with "__proto__, Sword" → Kept as "Sword" (warns about cleaning) ✓
Impact:
✓ Empty locations persist across loads
✓ Users can now add items to new locations
✓ Corrupted items still cleaned (just location kept)
✓ Better logging (warns when actual corruption cleaned)
Fixes: Cannot add items to newly created storage locations
Fixes critical issue where manual edits (add location, add item, change
stats, etc.) were invisible to AI in next generation, causing edits to be
immediately overwritten.
Root Cause:
- Manual edits updated extensionSettings and lastGeneratedData
- AI prompt builder used committedTrackerData (NOT extensionSettings)
- Manual edits were never synced to committedTrackerData
- Result: AI didn't see manual changes, overwrote them
Solution - Sync to Both Data Stores:
All manual edit points now update BOTH:
1. lastGeneratedData (for display)
2. committedTrackerData (for AI context)
Files Modified:
1. **src/systems/interaction/inventoryActions.js**
- updateLastGeneratedDataInventory() now sets committedTrackerData.userStats
- Affects: add/remove items, add/remove locations
2. **src/systems/rendering/userStats.js**
- All 3 edit handlers now set committedTrackerData.userStats
- Affects: stat values (health, etc.), mood emoji, conditions
- Also fixed: now uses buildInventorySummary() for proper v2 format
3. **src/systems/rendering/infoBox.js**
- updateInfoBoxField() now sets committedTrackerData.infoBox
- Affects: date, weather, temperature, time, location
4. **src/systems/rendering/thoughts.js**
- updateCharacterField() now sets committedTrackerData.characterThoughts
- Affects: character emoji, name, traits, thoughts, relationship
Impact - Manual Edits Now Persist:
Before:
- Add location "Home" → Next generation → Location gone ❌
- Add item "Sword" → Next generation → Item gone ❌
- Change health to 25% → AI ignores it ❌
After:
- Add location "Home" → Next generation → Location persists ✓
- Add item "Sword" → Next generation → Item included ✓
- Change health to 25% → AI acknowledges low health ✓
Works in Both Modes:
- Together mode: AI sees manual edits in injected prompt ✓
- Separate mode: AI sees manual edits in context ✓
User Experience:
- "I edited it, so it should stay" - now works as expected
- AI builds on manual changes instead of overwriting them
- Minimal overhead (just string copies)
Fixes: Manual inventory/stats edits being overwritten by AI generation
Fixed alignment of user portrait in the Status tab. The avatar was
previously aligned to the left side of its container.
Change:
- Added justify-content: center to the avatar's flex container
- Avatar now centered horizontally (align-items already centered it vertically)
Before: Avatar stuck to left edge of its space
After: Avatar centered in its allocated space
File: src/systems/rendering/userStats.js:56
Enhances validation to clean corrupted items at load time while preserving
valid ones, rather than discarding entire sections. Also auto-capitalizes
first letter of items for consistency.
New capability - Granular Item Cleaning:
1. **cleanItemString()** (src/utils/security.js):
- Parses item string, removes bad items, re-serializes clean ones
- Applies ALL parsing rules: markdown, sanitization, length limits
- Used at load time to clean persisted data immediately
- Returns "None" if no valid items remain
2. **Enhanced validateStoredInventory()**:
- Now cleans items within each location
- Only removes locations if ALL items are invalid
- Example: "Home": "Sword, __proto__, Shield" → "Home": "Sword, Shield"
- Example: "Bad": "__proto__, constructor" → location removed
3. **Enhanced validateInventoryStructure()** (src/core/persistence.js):
- Cleans onPerson, stored, and assets at load time
- Logs exactly what was cleaned for debugging
- Auto-saves cleaned data back to storage
Auto-Capitalization:
- Added to cleanSingleItem() in itemParser.js
- Capitalizes first letter of each item after all cleaning
- Preserves rest of case: "iPhone" → "iPhone" (not "Iphone")
- Examples: "sword" → "Sword", "3x potions" → "3x potions"
Behavior examples:
Before (threw away entire array):
- "Home": "Sword, " + "A".repeat(600) + ", Shield"
→ Entire location lost
After (granular cleaning):
- "Home": "Sword, " + "A".repeat(600) + ", Shield"
→ "Home": "Sword, AAA...(500 chars), Shield"
Before (kept corrupted data):
- onPerson: "sword, __proto__, shield"
→ Stored as-is, filtered only at render
After (cleaned at load):
- onPerson: "Sword, Shield"
→ Cleaned and saved immediately, capitalized
Benefits:
- ✓ Preserves valid items when some are corrupted
- ✓ Cleans data at source, not just at render
- ✓ Detailed logging of what was cleaned
- ✓ Consistent capitalization across all items
- ✓ Single source of truth for "valid item"
Fixes Bug #3: Locations disappearing when switching tabs or on reload.
Root cause: inventory.stored could become corrupted (null, array, or
undefined) due to incomplete validation during load/save operations.
Solution - Defense in Depth:
1. **Persistence Layer** (src/core/persistence.js):
- New validateInventoryStructure() function
- Validates on loadSettings() and loadChatData()
- Checks all v2 fields (onPerson, stored, assets, version)
- Ensures stored is always a plain object
- Validates stored keys/values using validateStoredInventory()
- Auto-repairs corrupted data with console warnings
- Persists repairs immediately
2. **Form State Management** (src/systems/interaction/inventoryActions.js):
- Enhanced restoreFormStates() to detect deleted locations
- Cleans up orphaned form states automatically
- Prevents errors from forms referencing non-existent locations
Validation checks:
- ✓ inventory.stored is object (not null/array/undefined)
- ✓ All stored keys are safe (no __proto__, constructor, etc.)
- ✓ All stored values are strings
- ✓ onPerson and assets are strings
- ✓ version field exists
Auto-repair scenarios:
- Corrupted stored → reset to {}
- Invalid onPerson/assets → reset to "None"
- Missing version → set to 2
- Dangerous keys → removed with warning
Result:
- Locations persist across tab switches ✓
- Empty locations persist ✓
- Data corruption auto-repaired on load ✓
- Orphaned form states cleaned up ✓
- No crashes from invalid data ✓
Fixes: Location disappears when switching tabs or reloading
Created comprehensive security layer to protect against malicious input
and resource exhaustion attacks.
New security.js module:
- sanitizeLocationName(): Blocks __proto__, constructor, toString, etc.
- sanitizeItemName(): Enforces max length (500 chars)
- validateStoredInventory(): Validates entire stored object structure
- MAX_ITEMS_PER_SECTION: Limit of 500 items per section
Protected attack vectors:
1. Prototype pollution via location names
- Blocked: "__proto__", "constructor", "prototype", etc.
- Alert shown to user if attempted
2. DoS via extremely long names
- Location names: max 200 chars (truncated with warning)
- Item names: max 500 chars (truncated with warning)
3. DoS via massive item lists
- Max 500 items per section (truncated with warning)
Integration:
- itemParser.js: Uses sanitizeItemName() and enforces max items
- inventoryActions.js: Validates all user input before saving
- Manual location creation: blocked dangerous names
- Manual item addition: length limits enforced
Security best practices (2025):
- No regex DoS vulnerabilities (character-by-character parsing)
- Explicit hasOwnProperty checks to avoid inherited properties
- Console warnings for all security events (auditing)
- Graceful degradation (truncate, don't crash)
- Defense in depth (validation at multiple layers)
This protects against both malicious actors and accidental abuse.
Fixes two parsing issues with inventory items:
1. Items with commas in parenthetical descriptions were incorrectly
split into multiple items. For example:
"Potato (Cursed, Sexy, Your Mum & Dick, Etc)" would become 3-4
separate items instead of one.
2. AI sometimes wraps item lists in square brackets, which should be
stripped. For example:
"[Sword, Shield]" should parse as ["Sword", "Shield"]
Solution:
- Enhanced parseItems() to track parenthesis depth during parsing
- Only split on commas that are OUTSIDE parentheses
- Strip wrapping square brackets before parsing
- Commas inside parentheses are now preserved as part of the item name
- Maintains backward compatibility with existing items
Implementation:
- Pre-processing: strip wrapping brackets if present
- Two-pass parsing: first collapses newlines in parentheses (existing),
then smart comma splitting (new)
- Similar approach to existing newline handling logic
Examples:
- "Sword, Shield" → ["Sword", "Shield"] (unchanged)
- "Item (tag1, tag2), Sword" → ["Item (tag1, tag2)", "Sword"] (fixed)
- "[Sword, Shield]" → ["Sword", "Shield"] (fixed)
Fixes: Items with commas split into multiple items
Fixes bug where expanding an existing storage location would close
the "Add Location" form that was currently open. This happened
because renderInventory() recreated all HTML from scratch, resetting
all inline forms to hidden state.
Solution:
- Track open form states in inventoryActions module
- Restore form visibility after each re-render
- Applies to all inline forms: add location, add items (on person,
stored, assets)
This also fixes the related issue where switching tabs would close
open forms.
Fixes: Location disappears when expanding while adding new location
- Created getLocationId() helper function to normalize location names to IDs
- Function removes special characters (apostrophes, etc.) before converting to ID
- Both rendering and action handlers now use same ID generation logic
- Fixes issue where locations with apostrophes couldn't be deleted
- Example: "Dottore's Study" now properly generates ID "Dottores-Study"
- Commented out debug logging
- openai_setting_names from /api/settings/get is an array, not an object
- Use .includes() instead of 'in' operator to check for preset
- Prevents duplicate preset imports on every page refresh
- Preset is now only imported once on first extension load
- Check if preset exists using /api/settings/get instead of HEAD request
- Look for preset in openai_setting_names to determine if it's already imported
- Comment out 'already exists' log to reduce console noise
- Only import preset if it's truly missing from the settings
- Use correct /api/presets/save endpoint instead of /api/presets/save-openai
- Add getRequestHeaders() import and use it in the fetch call
- Include apiId: 'openai' in the request body
- Fixes 'Forbidden' error when importing preset
- Fixed extension settings not appearing in Extensions tab by appending to correct container (#extensions_settings2)
- Added Discord and Support Creator buttons directly in JavaScript
- Added persistence for committedTrackerData to maintain state across refreshes and restarts
- Updated saveChatData() to include committedTrackerData in chat metadata
- Updated loadChatData() to restore committedTrackerData from saved chat data
Added comprehensive error handling to prevent extension initialization failures:
- Added settings validation in loadSettings() to detect corrupt data
- Improved error recovery in main initialization with granular try-catch blocks
- Enhanced HTML regex import with structure validation and detailed error logging
- Added detection for conflicting old manual formatting regex scripts
- Added user-friendly toastr notifications for initialization errors and conflicts
- Each init step now has independent error handling to prevent cascade failures
This fixes issues where invalid extension_settings could prevent the extension
from loading entirely. The extension will now gracefully handle corrupt data,
warn about conflicts, and fall back to defaults when necessary.
Related to user report where extension wouldn't load with certain settings.json
configurations containing old manual formatting regexes or malformed data.
- Changed storage location names to black for better visibility on colored background
- Updated view toggle buttons to have dark background with proper border outline
- Removed wrapper background from view toggle, individual buttons now standalone
Implemented comprehensive individual item management system with toggleable view modes:
- Added item parsing utilities (parseItems/serializeItems) for comma-separated strings
- Implemented list view (full-width rows) and grid view (responsive cards)
- Added view mode toggle buttons per inventory section (onPerson, stored, assets)
- View preferences persist per-section in settings
- Replaced text-based editing with add/remove item controls
- Added inline forms for adding new items (matching existing UX patterns)
- Applied theme accent color (--rpg-highlight) to all outlines and active states
- Updated all tabs (desktop/mobile/inventory subtabs) with theme-consistent styling
Technical improvements:
- Created itemParser.js utility module for item string manipulation
- Enhanced inventory rendering with conditional list/grid HTML generation
- Added switchViewMode handler with settings persistence
- Fixed [object Object] display bug with comprehensive type checking
- All buttons and items now use transparent backgrounds with theme accent borders
Changed selector from .rpg-mobile-tab-content[data-tab-content="info"]
to include .active class, preventing the info tab from always being
visible regardless of which tab is selected.
The display: flex !important was overriding the base tab switching
logic (.rpg-mobile-tab-content { display: none; }), causing the info
tab to render on top of all other tabs.
Changed selector from .rpg-stats-left > div to :first-child to only
target the avatar wrapper, preventing the mood emoji from stretching
into the attributes column.
The previous fix made all direct children of .rpg-stats-left span the
full width, which incorrectly affected the mood div. Now only the
first child (avatar wrapper) spans both columns and is centered.
Changed .rpg-info-section from flex: 1 to flex: 0 0 auto so it only
takes the vertical space needed by its content (calendar/weather/
location widgets) rather than expanding equally with other sections.
Previously, all .rpg-section elements had flex: 1, causing them to
equally share vertical space. This forced the info box to expand
beyond its content needs, creating excessive bottom padding.
With this change:
- Info box is now compact (no wasted space)
- Stats section expands to fill more vertical space
- Overall layout is more balanced with stats getting priority
Replaced all prompt() and confirm() dialogs with contenteditable fields
and inline UI components for a better user experience.
Changes:
- Made inventory fields (On Person, Stored items, Assets) contenteditable
with blur-to-save functionality
- Replaced "Add Location" prompt with inline form (hidden by default)
- Replaced "Remove Location" confirm with inline confirmation UI
- Added CSS styling for inline editing states (hover, focus, empty)
- Added CSS for inline forms, buttons, and confirmation UI
- Fixed bug where inventory sub-tabs were unclickable due to
incorrect container ID in toggleLocationCollapse() and
switchInventoryTab() functions
All inline edits now save automatically on blur, matching the UX
pattern used elsewhere in the extension (mood/conditions fields).
Desktop (2 tabs):
- Status tab: User Stats + Info Box + Character Thoughts
- Inventory tab: Inventory system (dedicated space)
Mobile (3 tabs):
- Stats tab: User Stats only
- Info tab: Info Box + Character Thoughts
- Inventory tab: Inventory only
Features:
- Created desktop.js module for desktop tab management
- Updated mobile.js to use 3-tab structure (more breathing room on small screens)
- Added CSS styling for desktop tabs (hover states, active indicators)
- Implemented viewport transition handlers (desktop ↔ mobile)
- Tabs replace dividers (cleaner visual separation)
- Character thoughts can now expand to fill vertical space
This resolves the cramped 4-section panel issue by organizing content into logical tabs on both desktop and mobile.
Root cause: renderInventory() signature mismatch - was expecting parameters
but called without any, resulting in empty/broken rendering.
Changes:
- Rename renderInventory(inventory, options) → generateInventoryHTML() (internal)
- Create new renderInventory() with no parameters (like renderUserStats, etc.)
- New function gets container from state, data from settings, updates DOM directly
- Import getInventoryRenderOptions() to get current tab/collapse state
- Keep updateInventoryDisplay() for use by inventoryActions module
Now matches the pattern used by all other render modules, fixing the bug where
inventory section appeared empty in the panel.
- Include inventory in mobile tab system alongside user stats
- Add inventory to Stats tab (grouped with user stats)
- Update setupMobileTabs() to detect and organize inventory section
- Update removeMobileTabs() to restore inventory in correct order
- Handle inventory show/hide in mobile tab transitions
Inventory now works seamlessly on mobile viewports with proper tab organization.
- Add inventory section to template.html between Thoughts and bottom controls
- Wire up renderInventory() to all event handlers (message received, character changed, swipes)
- Initialize inventory container reference and event listeners in index.js
- Add showInventory toggle checkbox to settings with visibility control
- Update layout.js to handle inventory section and divider visibility
- Add renderInventory parameter to updateRPGData for separate mode support
- Update state.js and config.js with inventory container and showInventory setting
Inventory is now fully integrated as a visible, interactive panel section that persists across all user interactions.
Lucas 'Paperboy' Rose-Winters
Spicy_Marinara
Paperboy