diff --git a/ARCHITECTURE.md b/ARCHITECTURE.md index c8987aa..f3d0a56 100644 --- a/ARCHITECTURE.md +++ b/ARCHITECTURE.md @@ -81,7 +81,7 @@ DOM or live LiteGraph state. primary model-browser surfaces, including the frosted-glass capsule parameter inspection button with lightweight vector SVG icons and GPU-accelerated micro-interactions; the sidebar bottom action bar (`#anomalous-sidebar-actions`) features intuitive, highly restrained glyphic vector SVG icons (`SIDEBAR_ICONS`): - (1) Toolbox Hub (`#anomalous-toolbox-btn`): Precision 18px vector toolbox icon (`TOOLBOX`) anchoring the leftmost action slot, triggering an elevated 236px zero-scrollbar micro-utility drawer popover (`#anomalous-toolbox-modal`, z-index 999999, `overflow: hidden`) anchored directly above the action bar in the bottom-left corner (`bottom: 50px; left: 10px;`, collapsed `left: 68px`), presenting a high-density 3-column app/utility icon grid palette (`.anomalous-toolbox-grid`, `.anomalous-toolbox-tile`) with instant tooltips, amber status indicator dots, extensible tool registry (`this.registerToolboxItem`), zero obstruction to the central model grid, and mutual exclusivity against Settings Hub; + (1) Toolbox Hub (`#anomalous-toolbox-btn`): Precision 18px vector toolbox icon (`TOOLBOX`) anchoring the leftmost action slot, triggering an elevated 236px zero-scrollbar micro-utility drawer popover (`#anomalous-toolbox-modal`, z-index 999999, `overflow: hidden`) anchored directly above the action bar in the bottom-left corner (`bottom: 50px; left: 10px;`, collapsed `left: 68px`), presenting a high-density 3-column app/utility icon grid palette (`.anomalous-toolbox-grid`, `.anomalous-toolbox-tile`) hosting the Prompt Studio (`🎛️ 提示词工坊`, `openPromptStudio`) as the primary active online tool alongside utility helpers, with instant tooltips, emerald ready indicator dots (`.is-ready`), amber planned status dots, extensible tool registry (`this.registerToolboxItem`), zero obstruction to the central model grid, and mutual exclusivity against Settings Hub; (2) Scan Wizard (`#anomalous-scan-btn`): Clean circular radar scope with range ring, crosshairs, and sweep beacon (`SCAN_RADAR_ICON_SVG`), animated only during active scanning; (3) Model Doctor (`#anomalous-doctor-btn`): Sleek diagnostic medical stethoscope, instantly conveying health check semantics; (4) AI Assistant (`#anomalous-assistant-btn`): Radiant AI copilot sparkles (`✦`), representing copilot intelligence; diff --git a/web/main.js b/web/main.js index 5afba4a..5a531a7 100644 --- a/web/main.js +++ b/web/main.js @@ -4,7 +4,7 @@ import { createDOM, renderSidebar, loadFolders, showHelp, hideAllPanels, openFol import { loadGalleryImages, refreshGalleryImages, showGeneratedGallery, showGallerySelectMode, showGalleryViewer } from './modules/ui_gallery.js'; import { showNotebooks, closeWorkspace, refreshNotebooks, saveCurrentNotebook, deleteCurrentNotebook, renderNotebookEditor, fillNotebookGalleries, sendNotebookToCanvas } from './modules/ui_notebooks.js'; import { showRecipes, refreshRecipes, renderRecipeList, handleSaveRecipe } from './modules/ui_recipes.js'; -import { showMaterials, refreshMaterials, openSavedMaterial, openMaterialLibrary } from './modules/ui_materials.js'; +import { showMaterials, refreshMaterials, openSavedMaterial, openMaterialLibrary, openPromptStudio } from './modules/ui_materials.js'; import { showImageWorkbench } from './modules/ui_gallery_detail.js'; import { initDoctorPanel, diagnoseNode, renderGlobalDashboard, initAssistantPanel, renderAssistantModelCard, _loadAssistantHistory, _openGalleryReplacer, openLoraInsertionPicker, runGlobalDoctorScan } from './modules/ui_doctor.js'; import { app } from "../../scripts/app.js"; @@ -664,6 +664,7 @@ AnomalousBrowser.prototype.handleSaveRecipe = handleSaveRecipe; AnomalousBrowser.prototype.showMaterials = showMaterials; AnomalousBrowser.prototype.openSavedMaterial = openSavedMaterial; AnomalousBrowser.prototype.openMaterialLibrary = openMaterialLibrary; +AnomalousBrowser.prototype.openPromptStudio = openPromptStudio; AnomalousBrowser.prototype.refreshMaterials = refreshMaterials; AnomalousBrowser.prototype.loadGalleryImages = loadGalleryImages; diff --git a/web/modules/locales.js b/web/modules/locales.js index fa7b36c..0955bb9 100644 --- a/web/modules/locales.js +++ b/web/modules/locales.js @@ -722,6 +722,9 @@ export const i18n = { toolboxPlanned: '规划中', toolboxReady: '就绪', toolboxHintFooter: '💡 持续扩展中：模型批量重整、孤立缓存清理、哈希重算等运维工具将在此聚合。', + toolPromptStudioTitle: '提示词工坊', + toolPromptStudioShort: '提示词工坊', + toolPromptStudioDesc: '可视化提示词调配工坊，支持结构化混音调配与画布节点应用。', toolOrphanCleanerTitle: '孤立缓存与临时文件清理', toolOrphanCleanerShort: '缓存清理', toolOrphanCleanerDesc: '扫描并清理已删除模型的未引用缩略图缓存与临时残余文件。', @@ -1812,6 +1815,9 @@ export const i18n = { toolboxPlanned: 'Planned', toolboxReady: 'Ready', toolboxHintFooter: '💡 Expanding: Batch organizer, orphan cache cleaner, and hash recalculation tools will be hosted here.', + toolPromptStudioTitle: 'Prompt Studio', + toolPromptStudioShort: 'Prompt Studio', + toolPromptStudioDesc: 'Visual prompt composer with block mixing and direct canvas apply.', toolOrphanCleanerTitle: 'Orphan Cache & Temp Cleaner', toolOrphanCleanerShort: 'Cache Clean', toolOrphanCleanerDesc: 'Scan and remove unreferenced thumbnails and temporary files for deleted models.', diff --git a/web/modules/ui_materials.js b/web/modules/ui_materials.js index 73c1982..224d268 100644 --- a/web/modules/ui_materials.js +++ b/web/modules/ui_materials.js @@ -1024,6 +1024,14 @@ export async function openMaterialLibrary() { await openSavedMaterial.call(this, null); } +export async function openPromptStudio() { + this.hideAllPanels?.(); + const tbModal = document.getElementById('anomalous-toolbox-modal'); + if (tbModal) tbModal.style.display = 'none'; + await openSavedMaterial.call(this, null); + await showPromptComposer(this); +} + function updateMaterialContext(owner) { const node = selectedMaterialNode(app); owner.materialTarget = node; diff --git a/web/modules/ui_sidebar.js b/web/modules/ui_sidebar.js index 354ef3c..3e4a65c 100644 --- a/web/modules/ui_sidebar.js +++ b/web/modules/ui_sidebar.js @@ -1945,6 +1945,23 @@ export function createDOM() { gridContainer.className = 'anomalous-toolbox-grid'; const defaultTools = [ + { + id: 'prompt-studio', + icon: '🎛️', + shortTitle: t('toolPromptStudioShort'), + title: t('toolPromptStudioTitle'), + desc: t('toolPromptStudioDesc'), + badge: null, + isReady: true, + action: () => { + toolboxModal.style.display = 'none'; + if (typeof this.openPromptStudio === 'function') { + this.openPromptStudio(); + } else if (typeof this.openMaterialLibrary === 'function') { + this.openMaterialLibrary(); + } + } + }, { id: 'orphan-cleaner', icon: '🧹', @@ -1984,14 +2001,6 @@ export function createDOM() { title: t('toolFormatConvertTitle'), desc: t('toolFormatConvertDesc'), badge: t('toolboxPlanned') - }, - { - id: 'custom-scripts', - icon: '🧩', - shortTitle: t('toolCustomScriptsShort'), - title: t('toolCustomScriptsTitle'), - desc: t('toolCustomScriptsDesc'), - badge: t('toolboxPlanned') } ]; @@ -2007,6 +2016,10 @@ export function createDOM() { const dot = document.createElement('span'); dot.className = 'anomalous-toolbox-tile-dot'; tile.appendChild(dot); + } else if (tool.isReady) { + const dot = document.createElement('span'); + dot.className = 'anomalous-toolbox-tile-dot is-ready'; + tile.appendChild(dot); } const iconEl = document.createElement('div'); diff --git a/web/styles.css b/web/styles.css index 7a31daa..e0ed7a8 100644 --- a/web/styles.css +++ b/web/styles.css @@ -1130,6 +1130,11 @@ html:not(.anomalous-floating-entry-enabled) [data-setting-id="Anomalous.ModelBro box-shadow: 0 0 4px rgba(245, 158, 11, 0.6); } +.anomalous-toolbox-tile-dot.is-ready { + background: #10b981; + box-shadow: 0 0 5px rgba(16, 185, 129, 0.75); +} + .anomalous-sidebar-closed #anomalous-sidebar-actions { flex-direction: column !important; }