Add dual-mode draw buttons and refine UI

modules/novel-draw/novel-draw.html

@@ -65,6 +65,13 @@ body {
     display: flex; background: var(--bg-input);
     border: 1px solid var(--border); border-radius: 16px; padding: 2px;
 }
+.header-toggles { display: flex; gap: 6px; margin-right: 8px; }
+.header-toggle {
+    display: flex; align-items: center; gap: 4px; padding: 4px 8px;
+    background: var(--bg-input); border: 1px solid var(--border); border-radius: 12px;
+    font-size: 11px; color: var(--text-secondary); cursor: pointer; transition: all 0.15s;
+}
+.header-toggle input { accent-color: var(--accent); }
 .header-mode button {
     padding: 6px 14px; border: none; border-radius: 14px;
     background: transparent; color: var(--text-secondary);
@@ -210,6 +217,7 @@ select.input { cursor: pointer; }
     border: 1px solid rgba(212, 165, 116, 0.2); border-radius: 8px;
     font-size: 12px; color: var(--text-secondary); line-height: 1.6;
 }
+.tip-text { display: flex; flex-direction: column; gap: 4px; }
 .tip-box i { color: var(--accent); flex-shrink: 0; margin-top: 2px; }
 .gallery-char-section { margin-bottom: 16px; }
 .gallery-char-header {
@@ -363,6 +371,16 @@ select.input { cursor: pointer; }
         <div id="nd_badge" class="header-badge"><i class="fa-solid fa-circle"></i><span>未启用</span></div>
         <span class="header-credit" id="nd_credits"></span>
         <div class="header-spacer"></div>
+        <div class="header-toggles">
+            <label class="header-toggle">
+                <input type="checkbox" id="nd_show_floor">
+                <span>楼层</span>
+            </label>
+            <label class="header-toggle">
+                <input type="checkbox" id="nd_show_floating">
+                <span>悬浮</span>
+            </label>
+        </div>
         <div class="header-mode">
             <button data-mode="manual" class="active">手动</button>
             <button data-mode="auto">自动</button>
@@ -410,7 +428,11 @@ select.input { cursor: pointer; }
                 </div>
                 <div class="tip-box">
                     <i class="fa-solid fa-lightbulb"></i>
-                    <div>聊天界面点击悬浮球 🎨 即可为最后一条AI消息生成配图。开启自动模式后，AI回复时会自动配图。</div>
+                    <div class="tip-text">
+                        <div>消息楼层按钮的 🎨 为对应消息生成配图。</div>
+                        <div>悬浮按钮的 🎨 仅作用于最后一条AI消息。</div>
+                        <div>开启自动模式后，AI回复时会自动配图。</div>
+                    </div>
                 </div>
             </div>
 
@@ -829,7 +851,9 @@ let state = {
     paramsPresets: [],
     llmApi: { provider: 'st', url: '', key: '', model: '', modelCache: [] },
     useStream: true,
-    characterTags: []
+    characterTags: [],
+    showFloorButton: true,
+    showFloatingButton: false
 };
 
 let gallerySummary = {};
@@ -1259,6 +1283,8 @@ function getCurrentLlmModel() {
 function applyStateToUI() {
     updateBadge(state.enabled);
     updateModeButtons(state.mode);
+    $('nd_show_floor').checked = state.showFloorButton !== false;
+    $('nd_show_floating').checked = state.showFloatingButton === true;
     
     $('nd_api_key').value = state.apiKey || '';
     $('nd_timeout').value = Math.round((state.timeout > 0 ? state.timeout : DEFAULTS.timeout) / 1000);
@@ -1489,6 +1515,22 @@ document.addEventListener('DOMContentLoaded', () => {
         postToParent({ type: 'SAVE_MODE', mode: state.mode });
     }));
 
+    $('nd_show_floor').addEventListener('change', () => {
+        postToParent({
+            type: 'SAVE_BUTTON_MODE',
+            showFloorButton: $('nd_show_floor').checked,
+            showFloatingButton: $('nd_show_floating').checked
+        });
+    });
+
+    $('nd_show_floating').addEventListener('change', () => {
+        postToParent({
+            type: 'SAVE_BUTTON_MODE',
+            showFloorButton: $('nd_show_floor').checked,
+            showFloatingButton: $('nd_show_floating').checked
+        });
+    });
+    
     // ═══════════════════════════════════════════════════════════════════════
     // 关闭按钮
     // ═══════════════════════════════════════════════════════════════════════

modules/novel-draw/novel-draw.js

@@ -87,6 +87,8 @@ const DEFAULT_SETTINGS = {
     useWorldInfo: false,    
     characterTags: [],
     overrideSize: 'default',
+    showFloorButton: true,
+    showFloatingButton: false,
 };
 
 // ═══════════════════════════════════════════════════════════════════════════
@@ -2097,6 +2099,8 @@ async function sendInitData() {
             useWorldInfo: settings.useWorldInfo,
             characterTags: settings.characterTags,
             overrideSize: settings.overrideSize,
+            showFloorButton: settings.showFloorButton !== false,
+            showFloatingButton: settings.showFloatingButton === true,
         },
         cacheStats: stats,
         gallerySummary,
@@ -2131,6 +2135,31 @@ async function handleFrameMessage(event) {
             break;
         }
 
+        case 'SAVE_BUTTON_MODE': {
+            const s = getSettings();
+            if (typeof data.showFloorButton === 'boolean') s.showFloorButton = data.showFloorButton;
+            if (typeof data.showFloatingButton === 'boolean') s.showFloatingButton = data.showFloatingButton;
+            const ok = await saveSettingsAndToast(s, '已保存');
+            if (ok) {
+                try {
+                    const fp = await import('./floating-panel.js');
+                    fp.updateButtonVisibility?.(s.showFloorButton !== false, s.showFloatingButton === true);
+                } catch {}
+                if (s.showFloorButton !== false && typeof ensureNovelDrawPanelRef === 'function') {
+                    const context = getContext();
+                    const chat = context.chat || [];
+                    chat.forEach((message, messageId) => {
+                        if (!message || message.is_user) return;
+                        const messageEl = document.querySelector(`.mes[mesid="${messageId}"]`);
+                        if (!messageEl) return;
+                        ensureNovelDrawPanelRef?.(messageEl, messageId);
+                    });
+                }
+                sendInitData();
+            }
+            break;
+        }
+
         case 'SAVE_API_KEY': {
             const s = getSettings();
             s.apiKey = typeof data.apiKey === 'string' ? data.apiKey : s.apiKey;
@@ -2471,8 +2500,9 @@ export async function initNovelDraw() {
     // 动态导入 floating-panel（避免循环依赖）
     // ════════════════════════════════════════════════════════════════════
     
-    const { ensureNovelDrawPanel: ensureNovelDrawPanelFn } = await import('./floating-panel.js');
+    const { ensureNovelDrawPanel: ensureNovelDrawPanelFn, initFloatingPanel } = await import('./floating-panel.js');
     ensureNovelDrawPanelRef = ensureNovelDrawPanelFn;
+    initFloatingPanel?.();
 
     // 为现有消息创建画图面板
     const renderExistingPanels = () => {