mirror of
https://github.com/willmiao/ComfyUI-Lora-Manager.git
synced 2026-03-21 21:22:11 -03:00
Refactor storage handling across application
- Introduced a new storageHelpers module to centralize localStorage interactions, improving code maintainability and readability. - Updated various components and managers to utilize the new storageHelpers functions for setting, getting, and removing items from localStorage. - Added migration logic to handle localStorage items during application initialization, ensuring compatibility with the new storage structure. - Enhanced logging during application initialization for better debugging.
This commit is contained in:
@@ -0,0 +1,22 @@
|
||||
from typing import Dict, Any
|
||||
from .base_processor import NodeProcessor, register_processor
|
||||
|
||||
@register_processor
|
||||
class FluxGuidanceProcessor(NodeProcessor):
|
||||
"""Processor for Flux Guidance nodes"""
|
||||
|
||||
NODE_CLASS_TYPE = "FluxGuidance"
|
||||
REQUIRED_FIELDS = {"guidance"}
|
||||
|
||||
def process(self, workflow_parser) -> Dict[str, Any]:
|
||||
"""Process a FluxGuidance node to extract guidance value"""
|
||||
result = {}
|
||||
|
||||
positive_text = self.resolve_input("conditioning", workflow_parser)
|
||||
if positive_text:
|
||||
result["positive"] = positive_text
|
||||
|
||||
if "guidance" in self.inputs:
|
||||
result["guidance"] = str(self.inputs["guidance"])
|
||||
return result
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import { refreshSingleLoraMetadata } from '../api/loraApi.js';
|
||||
import { showToast, getNSFWLevelName } from '../utils/uiHelpers.js';
|
||||
import { NSFW_LEVELS } from '../utils/constants.js';
|
||||
import { getStorageItem } from '../utils/storageHelpers.js';
|
||||
|
||||
export class LoraContextMenu {
|
||||
constructor() {
|
||||
@@ -149,7 +150,7 @@ export class LoraContextMenu {
|
||||
|
||||
updateCardBlurEffect(card, level) {
|
||||
// Get user settings for blur threshold
|
||||
const blurThreshold = parseInt(localStorage.getItem('nsfwBlurLevel') || '4');
|
||||
const blurThreshold = parseInt(getStorageItem('nsfwBlurLevel') || '4');
|
||||
|
||||
// Get card preview container
|
||||
const previewContainer = card.querySelector('.card-preview');
|
||||
|
||||
@@ -7,6 +7,7 @@ import { HeaderManager } from './components/Header.js';
|
||||
import { SettingsManager } from './managers/SettingsManager.js';
|
||||
import { showToast, initTheme, initBackToTop, lazyLoadImages } from './utils/uiHelpers.js';
|
||||
import { initializeInfiniteScroll } from './utils/infiniteScroll.js';
|
||||
import { migrateStorageItems } from './utils/storageHelpers.js';
|
||||
|
||||
// Core application class
|
||||
export class AppCore {
|
||||
@@ -17,6 +18,8 @@ export class AppCore {
|
||||
// Initialize core functionality
|
||||
async initialize() {
|
||||
if (this.initialized) return;
|
||||
|
||||
console.log('AppCore: Initializing...');
|
||||
|
||||
// Initialize managers
|
||||
state.loadingManager = new LoadingManager();
|
||||
@@ -64,6 +67,11 @@ export class AppCore {
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
// Migrate localStorage items to use the namespace prefix
|
||||
migrateStorageItems();
|
||||
});
|
||||
|
||||
// Create and export a singleton instance
|
||||
export const appCore = new AppCore();
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { appCore } from './core.js';
|
||||
import { state, initPageState } from './state/index.js';
|
||||
import { state } from './state/index.js';
|
||||
import { showLoraModal, toggleShowcase, scrollToTop } from './components/LoraModal.js';
|
||||
import { loadMoreLoras, fetchCivitai, deleteModel, replacePreview, resetAndReload, refreshLoras } from './api/loraApi.js';
|
||||
import {
|
||||
@@ -97,9 +97,6 @@ function initializeEventListeners() {
|
||||
|
||||
// Initialize everything when DOM is ready
|
||||
document.addEventListener('DOMContentLoaded', async () => {
|
||||
// Initialize page state
|
||||
initPageState('loras');
|
||||
|
||||
// Initialize core application
|
||||
await appCore.initialize();
|
||||
|
||||
|
||||
@@ -2,6 +2,7 @@ import { BASE_MODELS, BASE_MODEL_CLASSES } from '../utils/constants.js';
|
||||
import { state, getCurrentPageState } from '../state/index.js';
|
||||
import { showToast, updatePanelPositions } from '../utils/uiHelpers.js';
|
||||
import { loadMoreLoras } from '../api/loraApi.js';
|
||||
import { removeStorageItem, setStorageItem, getStorageItem } from '../utils/storageHelpers.js';
|
||||
|
||||
export class FilterManager {
|
||||
constructor(options = {}) {
|
||||
@@ -267,7 +268,7 @@ export class FilterManager {
|
||||
const storageKey = `${this.currentPage}_filters`;
|
||||
|
||||
// Save filters to localStorage
|
||||
localStorage.setItem(storageKey, JSON.stringify(this.filters));
|
||||
setStorageItem(storageKey, this.filters);
|
||||
|
||||
// Update state with current filters
|
||||
pageState.filters = { ...this.filters };
|
||||
@@ -323,9 +324,9 @@ export class FilterManager {
|
||||
this.updateTagSelections();
|
||||
this.updateActiveFiltersCount();
|
||||
|
||||
// Remove from localStorage
|
||||
// Remove from local Storage
|
||||
const storageKey = `${this.currentPage}_filters`;
|
||||
localStorage.removeItem(storageKey);
|
||||
removeStorageItem(storageKey);
|
||||
|
||||
// Update UI
|
||||
this.filterButton.classList.remove('active');
|
||||
@@ -344,16 +345,14 @@ export class FilterManager {
|
||||
|
||||
loadFiltersFromStorage() {
|
||||
const storageKey = `${this.currentPage}_filters`;
|
||||
const savedFilters = localStorage.getItem(storageKey);
|
||||
const savedFilters = getStorageItem(storageKey);
|
||||
|
||||
if (savedFilters) {
|
||||
try {
|
||||
const parsedFilters = JSON.parse(savedFilters);
|
||||
|
||||
// Ensure backward compatibility with older filter format
|
||||
this.filters = {
|
||||
baseModel: parsedFilters.baseModel || [],
|
||||
tags: parsedFilters.tags || []
|
||||
baseModel: savedFilters.baseModel || [],
|
||||
tags: savedFilters.tags || []
|
||||
};
|
||||
|
||||
// Update state with loaded filters
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { updatePanelPositions } from "../utils/uiHelpers.js";
|
||||
import { getCurrentPageState } from "../state/index.js";
|
||||
import { setStorageItem, getStorageItem } from "../utils/storageHelpers.js";
|
||||
/**
|
||||
* SearchManager - Handles search functionality across different pages
|
||||
* Each page can extend or customize this base functionality
|
||||
@@ -183,7 +184,7 @@ export class SearchManager {
|
||||
|
||||
loadSearchPreferences() {
|
||||
try {
|
||||
const preferences = JSON.parse(localStorage.getItem(`${this.currentPage}_search_prefs`)) || {};
|
||||
const preferences = getStorageItem(`${this.currentPage}_search_prefs`) || {};
|
||||
|
||||
// Apply search options
|
||||
if (preferences.options) {
|
||||
@@ -254,7 +255,7 @@ export class SearchManager {
|
||||
preferences.recursive = this.recursiveSearchToggle.checked;
|
||||
}
|
||||
|
||||
localStorage.setItem(`${this.currentPage}_search_prefs`, JSON.stringify(preferences));
|
||||
setStorageItem(`${this.currentPage}_search_prefs`, preferences);
|
||||
} catch (error) {
|
||||
console.error('Error saving search preferences:', error);
|
||||
}
|
||||
|
||||
@@ -2,6 +2,7 @@ import { modalManager } from './ModalManager.js';
|
||||
import { showToast } from '../utils/uiHelpers.js';
|
||||
import { state } from '../state/index.js';
|
||||
import { resetAndReload } from '../api/loraApi.js';
|
||||
import { setStorageItem } from '../utils/storageHelpers.js';
|
||||
|
||||
export class SettingsManager {
|
||||
constructor() {
|
||||
@@ -75,7 +76,7 @@ export class SettingsManager {
|
||||
state.global.settings.show_only_sfw = showOnlySFW;
|
||||
|
||||
// Save settings to localStorage
|
||||
localStorage.setItem('settings', JSON.stringify(state.global.settings));
|
||||
setStorageItem('settings', state.global.settings);
|
||||
|
||||
try {
|
||||
// Save backend settings via API
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { modalManager } from './ModalManager.js';
|
||||
import { getStorageItem, setStorageItem } from '../utils/storageHelpers.js';
|
||||
|
||||
export class UpdateService {
|
||||
constructor() {
|
||||
@@ -7,13 +8,13 @@ export class UpdateService {
|
||||
this.latestVersion = "v0.0.0"; // Initialize with default values
|
||||
this.updateInfo = null;
|
||||
this.updateAvailable = false;
|
||||
this.updateNotificationsEnabled = localStorage.getItem('show_update_notifications') !== 'false';
|
||||
this.lastCheckTime = parseInt(localStorage.getItem('last_update_check') || '0');
|
||||
this.updateNotificationsEnabled = getStorageItem('show_update_notifications') !== 'false';
|
||||
this.lastCheckTime = parseInt(getStorageItem('last_update_check') || '0');
|
||||
}
|
||||
|
||||
initialize() {
|
||||
// Initialize update preferences from localStorage
|
||||
const showUpdates = localStorage.getItem('show_update_notifications');
|
||||
const showUpdates = getStorageItem('show_update_notifications');
|
||||
this.updateNotificationsEnabled = showUpdates === null || showUpdates === 'true';
|
||||
|
||||
// Register event listener for update notification toggle
|
||||
@@ -22,7 +23,7 @@ export class UpdateService {
|
||||
updateCheckbox.checked = this.updateNotificationsEnabled;
|
||||
updateCheckbox.addEventListener('change', (e) => {
|
||||
this.updateNotificationsEnabled = e.target.checked;
|
||||
localStorage.setItem('show_update_notifications', e.target.checked);
|
||||
setStorageItem('show_update_notifications', e.target.checked);
|
||||
this.updateBadgeVisibility();
|
||||
});
|
||||
}
|
||||
@@ -71,7 +72,7 @@ export class UpdateService {
|
||||
|
||||
// Update last check time
|
||||
this.lastCheckTime = now;
|
||||
localStorage.setItem('last_update_check', now.toString());
|
||||
setStorageItem('last_update_check', now.toString());
|
||||
|
||||
// Update UI
|
||||
this.updateBadgeVisibility();
|
||||
|
||||
110
static/js/utils/storageHelpers.js
Normal file
110
static/js/utils/storageHelpers.js
Normal file
@@ -0,0 +1,110 @@
|
||||
/**
|
||||
* Utility functions for localStorage with namespacing to avoid conflicts
|
||||
* with other ComfyUI extensions or the main application
|
||||
*/
|
||||
|
||||
// Namespace prefix for all localStorage keys
|
||||
const STORAGE_PREFIX = 'lora_manager_';
|
||||
|
||||
/**
|
||||
* Get an item from localStorage with namespace support and fallback to legacy keys
|
||||
* @param {string} key - The key without prefix
|
||||
* @param {any} defaultValue - Default value if key doesn't exist
|
||||
* @returns {any} The stored value or defaultValue
|
||||
*/
|
||||
export function getStorageItem(key, defaultValue = null) {
|
||||
// Try with prefix first
|
||||
const prefixedValue = localStorage.getItem(STORAGE_PREFIX + key);
|
||||
|
||||
if (prefixedValue !== null) {
|
||||
// If it's a JSON string, parse it
|
||||
try {
|
||||
return JSON.parse(prefixedValue);
|
||||
} catch (e) {
|
||||
return prefixedValue;
|
||||
}
|
||||
}
|
||||
|
||||
// Fallback to legacy key (without prefix)
|
||||
const legacyValue = localStorage.getItem(key);
|
||||
|
||||
if (legacyValue !== null) {
|
||||
// If found in legacy storage, migrate it to prefixed storage
|
||||
try {
|
||||
const parsedValue = JSON.parse(legacyValue);
|
||||
setStorageItem(key, parsedValue);
|
||||
return parsedValue;
|
||||
} catch (e) {
|
||||
setStorageItem(key, legacyValue);
|
||||
return legacyValue;
|
||||
}
|
||||
}
|
||||
|
||||
// Return default value if neither prefixed nor legacy key exists
|
||||
return defaultValue;
|
||||
}
|
||||
|
||||
/**
|
||||
* Set an item in localStorage with namespace prefix
|
||||
* @param {string} key - The key without prefix
|
||||
* @param {any} value - The value to store
|
||||
*/
|
||||
export function setStorageItem(key, value) {
|
||||
const prefixedKey = STORAGE_PREFIX + key;
|
||||
|
||||
// Convert objects and arrays to JSON strings
|
||||
if (typeof value === 'object' && value !== null) {
|
||||
localStorage.setItem(prefixedKey, JSON.stringify(value));
|
||||
} else {
|
||||
localStorage.setItem(prefixedKey, value);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove an item from localStorage (both prefixed and legacy)
|
||||
* @param {string} key - The key without prefix
|
||||
*/
|
||||
export function removeStorageItem(key) {
|
||||
localStorage.removeItem(STORAGE_PREFIX + key);
|
||||
localStorage.removeItem(key); // Also remove legacy key
|
||||
}
|
||||
|
||||
/**
|
||||
* Migrate all existing localStorage items to use the prefix
|
||||
* This should be called once during application initialization
|
||||
*/
|
||||
export function migrateStorageItems() {
|
||||
// List of known keys used in the application
|
||||
const knownKeys = [
|
||||
'nsfwBlurLevel',
|
||||
'theme',
|
||||
'activeFolder',
|
||||
'folderTagsCollapsed',
|
||||
'settings',
|
||||
'loras_filters',
|
||||
'recipes_filters',
|
||||
'checkpoints_filters',
|
||||
'loras_search_prefs',
|
||||
'recipes_search_prefs',
|
||||
'checkpoints_search_prefs',
|
||||
'show_update_notifications',
|
||||
'last_update_check'
|
||||
];
|
||||
|
||||
// Migrate each known key
|
||||
knownKeys.forEach(key => {
|
||||
const value = localStorage.getItem(key);
|
||||
if (value !== null) {
|
||||
try {
|
||||
// Try to parse as JSON first
|
||||
const parsedValue = JSON.parse(value);
|
||||
setStorageItem(key, parsedValue);
|
||||
} catch (e) {
|
||||
// If not JSON, store as is
|
||||
setStorageItem(key, value);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
console.log('Lora Manager: Storage migration completed');
|
||||
}
|
||||
@@ -1,5 +1,6 @@
|
||||
import { state } from '../state/index.js';
|
||||
import { resetAndReload } from '../api/loraApi.js';
|
||||
import { getStorageItem, setStorageItem } from './storageHelpers.js';
|
||||
|
||||
export function showToast(message, type = 'info') {
|
||||
const toast = document.createElement('div');
|
||||
@@ -27,7 +28,7 @@ export function lazyLoadImages() {
|
||||
}
|
||||
|
||||
export function restoreFolderFilter() {
|
||||
const activeFolder = localStorage.getItem('activeFolder');
|
||||
const activeFolder = getStorageItem('activeFolder');
|
||||
const folderTag = activeFolder && document.querySelector(`.tag[data-folder="${activeFolder}"]`);
|
||||
if (folderTag) {
|
||||
folderTag.classList.add('active');
|
||||
@@ -36,13 +37,13 @@ export function restoreFolderFilter() {
|
||||
}
|
||||
|
||||
export function initTheme() {
|
||||
document.body.dataset.theme = localStorage.getItem('theme') || 'dark';
|
||||
document.body.dataset.theme = getStorageItem('theme') || 'dark';
|
||||
}
|
||||
|
||||
export function toggleTheme() {
|
||||
const theme = document.body.dataset.theme === 'light' ? 'dark' : 'light';
|
||||
document.body.dataset.theme = theme;
|
||||
localStorage.setItem('theme', theme);
|
||||
setStorageItem('theme', theme);
|
||||
}
|
||||
|
||||
export function toggleFolder(tag) {
|
||||
@@ -158,12 +159,12 @@ export function toggleFolderTags() {
|
||||
// Change icon to indicate folders are hidden
|
||||
toggleBtn.className = 'fas fa-folder-plus';
|
||||
toggleBtn.parentElement.title = 'Show folder tags';
|
||||
localStorage.setItem('folderTagsCollapsed', 'true');
|
||||
setStorageItem('folderTagsCollapsed', 'true');
|
||||
} else {
|
||||
// Change icon to indicate folders are visible
|
||||
toggleBtn.className = 'fas fa-folder-minus';
|
||||
toggleBtn.parentElement.title = 'Hide folder tags';
|
||||
localStorage.setItem('folderTagsCollapsed', 'false');
|
||||
setStorageItem('folderTagsCollapsed', 'false');
|
||||
}
|
||||
|
||||
// Update panel positions after toggling
|
||||
@@ -176,7 +177,7 @@ export function toggleFolderTags() {
|
||||
|
||||
// Add this to your existing initialization code
|
||||
export function initFolderTagsVisibility() {
|
||||
const isCollapsed = localStorage.getItem('folderTagsCollapsed') === 'true';
|
||||
const isCollapsed = getStorageItem('folderTagsCollapsed') === 'true';
|
||||
if (isCollapsed) {
|
||||
const folderTags = document.querySelector('.folder-tags');
|
||||
const toggleBtn = document.querySelector('.toggle-folders-btn i');
|
||||
|
||||
@@ -771,6 +771,7 @@ async function saveRecipeDirectly(widget) {
|
||||
try {
|
||||
// Get the workflow data from the ComfyUI app
|
||||
const prompt = await app.graphToPrompt();
|
||||
console.log('Prompt:', prompt.output);
|
||||
|
||||
// Show loading toast
|
||||
if (app && app.extensionManager && app.extensionManager.toast) {
|
||||
|
||||
Reference in New Issue
Block a user