From 0580130d47d1891e0d70002ff49f6dcceca57ec0 Mon Sep 17 00:00:00 2001 From: Will Miao <13051207myq@gmail.com> Date: Mon, 17 Mar 2025 15:53:53 +0800 Subject: [PATCH] Fix lora page header --- static/js/components/Header.js | 11 ++++----- static/js/main.js | 19 +++------------- static/js/managers/LoraSearchManager.js | 1 - static/js/managers/UpdateService.js | 12 ++++------ static/js/recipes.js | 1 + templates/components/header.html | 30 ++----------------------- 6 files changed, 14 insertions(+), 60 deletions(-) diff --git a/static/js/components/Header.js b/static/js/components/Header.js index ee13b8e0..2078b132 100644 --- a/static/js/components/Header.js +++ b/static/js/components/Header.js @@ -1,3 +1,5 @@ +import { updateService } from '../managers/UpdateService.js'; + /** * Header.js - Manages the application header behavior across different pages * Handles initialization of appropriate search and filter managers based on current page @@ -76,7 +78,7 @@ export class HeaderManager { const settingsToggle = document.querySelector('.settings-toggle'); if (settingsToggle) { settingsToggle.addEventListener('click', () => { - if (window.settingsManager && typeof window.settingsManager.toggleSettings === 'function') { + if (window.settingsManager) { window.settingsManager.toggleSettings(); } }); @@ -86,7 +88,7 @@ export class HeaderManager { const updateToggle = document.getElementById('updateToggleBtn'); if (updateToggle) { updateToggle.addEventListener('click', () => { - // Handle update check logic + updateService.toggleUpdateModal(); }); } @@ -148,8 +150,3 @@ export class HeaderManager { } } } - -// Initialize the header manager when the DOM is loaded -document.addEventListener('DOMContentLoaded', () => { -window.headerManager = new HeaderManager(); -}); \ No newline at end of file diff --git a/static/js/main.js b/static/js/main.js index 8448a052..af0dc77a 100644 --- a/static/js/main.js +++ b/static/js/main.js @@ -3,6 +3,7 @@ import { LoadingManager } from './managers/LoadingManager.js'; import { modalManager } from './managers/ModalManager.js'; import { updateService } from './managers/UpdateService.js'; import { state, initSettings } from './state/index.js'; +import { initializeCommonComponents } from './common.js'; import { showLoraModal } from './components/LoraModal.js'; import { toggleShowcase, scrollToTop } from './components/LoraModal.js'; import { loadMoreLoras, fetchCivitai, deleteModel, replacePreview, resetAndReload, refreshLoras } from './api/loraApi.js'; @@ -22,16 +23,13 @@ import { } from './utils/uiHelpers.js'; import { initializeInfiniteScroll } from './utils/infiniteScroll.js'; import { showDeleteModal, confirmDelete, closeDeleteModal } from './utils/modalUtils.js'; -import { SearchManager } from './managers/SearchManager.js'; import { DownloadManager } from './managers/DownloadManager.js'; import { SettingsManager, toggleApiKeyVisibility } from './managers/SettingsManager.js'; import { LoraContextMenu } from './components/ContextMenu.js'; import { moveManager } from './managers/MoveManager.js'; -import { FilterManager } from './managers/FilterManager.js'; import { createLoraCard, updateCardsForBulkMode } from './components/LoraCard.js'; import { bulkManager } from './managers/BulkManager.js'; import { HeaderManager } from './components/Header.js'; - // Add bulk mode to state state.bulkMode = false; state.selectedLoras = new Set(); @@ -73,6 +71,8 @@ document.addEventListener('DOMContentLoaded', async () => { // Ensure settings are initialized initSettings(); + initializeCommonComponents(); + window.headerManager = new HeaderManager(); state.loadingManager = new LoadingManager(); modalManager.initialize(); // Initialize modalManager after DOM is loaded updateService.initialize(); // Initialize updateService after modalManager @@ -104,19 +104,6 @@ document.addEventListener('DOMContentLoaded', async () => { // Update positions on window resize window.addEventListener('resize', updatePanelPositions); - // Initialize search manager with LoRA-specific options - const loraSearchManager = new SearchManager({ - searchCallback: (query, options, recursive) => { - // LoRA-specific search implementation - // This could call your API with the right parameters - fetchLoras({ - search: query, - search_options: options, - recursive: recursive - }); - } - }); - // Set the current page for proper context document.body.dataset.page = 'loras'; }); diff --git a/static/js/managers/LoraSearchManager.js b/static/js/managers/LoraSearchManager.js index e9c22a65..c350416f 100644 --- a/static/js/managers/LoraSearchManager.js +++ b/static/js/managers/LoraSearchManager.js @@ -10,7 +10,6 @@ import { showToast } from '../utils/uiHelpers.js'; export class LoraSearchManager extends SearchManager { constructor(options = {}) { - console.log("initializing lora search manager"); super({ page: 'loras', ...options diff --git a/static/js/managers/UpdateService.js b/static/js/managers/UpdateService.js index 050fdff5..3f83584f 100644 --- a/static/js/managers/UpdateService.js +++ b/static/js/managers/UpdateService.js @@ -34,10 +34,10 @@ export class UpdateService { }); // Set up event listener for update button - const updateToggle = document.getElementById('updateToggleBtn'); - if (updateToggle) { - updateToggle.addEventListener('click', () => this.toggleUpdateModal()); - } + // const updateToggle = document.getElementById('updateToggleBtn'); + // if (updateToggle) { + // updateToggle.addEventListener('click', () => this.toggleUpdateModal()); + // } // Immediately update modal content with current values (even if from default) this.updateModalContent(); @@ -226,10 +226,6 @@ export class UpdateService { }); } - showUpdateModal() { - this.toggleUpdateModal(); - } - async manualCheckForUpdates() { this.lastCheckTime = 0; // Reset last check time to force check await this.checkForUpdates(); diff --git a/static/js/recipes.js b/static/js/recipes.js index 748df4c5..c7b35ebf 100644 --- a/static/js/recipes.js +++ b/static/js/recipes.js @@ -161,6 +161,7 @@ class RecipeManager { // Initialize components document.addEventListener('DOMContentLoaded', () => { initializeCommonComponents(); + window.headerManager = new HeaderManager(); window.recipeManager = new RecipeManager(); // Make importRecipes function available globally diff --git a/templates/components/header.html b/templates/components/header.html index 6e169cf9..833d6656 100644 --- a/templates/components/header.html +++ b/templates/components/header.html @@ -36,11 +36,11 @@
-
+
-
+
@@ -149,31 +149,5 @@ } else if (currentPath === '/checkpoints') { checkpointsNavItem.classList.add('active'); } - - // Initialize search options panel toggle - const searchOptionsToggle = document.getElementById('searchOptionsToggle'); - const searchOptionsPanel = document.getElementById('searchOptionsPanel'); - - if (searchOptionsToggle && searchOptionsPanel) { - searchOptionsToggle.addEventListener('click', function() { - const isHidden = searchOptionsPanel.classList.contains('hidden'); - if (isHidden) { - searchOptionsPanel.classList.remove('hidden'); - searchOptionsToggle.classList.add('active'); - } else { - searchOptionsPanel.classList.add('hidden'); - searchOptionsToggle.classList.remove('active'); - } - }); - - // Close search options panel when clicking the close button - const closeSearchOptions = document.getElementById('closeSearchOptions'); - if (closeSearchOptions) { - closeSearchOptions.addEventListener('click', function() { - searchOptionsPanel.classList.add('hidden'); - searchOptionsToggle.classList.remove('active'); - }); - } - } }); \ No newline at end of file