Fixed SD Promt
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 251 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 251 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 251 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 251 KiB |
+15
-1
@@ -283,7 +283,16 @@ header h1 { font-size: 1.1rem; color: #e94560; }
|
||||
.translate-btn:hover { background: #4a90d9; color: white; }
|
||||
.translate-btn:disabled { opacity: 0.5; cursor: default; }
|
||||
|
||||
.chat-image { margin-top: 8px; max-width: 100%; border-radius: 8px; border: 1px solid #0f3460; }
|
||||
.chat-image-wrap { margin-top: 8px; }
|
||||
.chat-image-label {
|
||||
font-size: 0.75rem;
|
||||
color: #888;
|
||||
margin-bottom: 4px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.04em;
|
||||
}
|
||||
.chat-image { max-width: 100%; border-radius: 8px; border: 1px solid #0f3460; display: block; }
|
||||
.image-prompt-blocks .image-prompt-block + .image-prompt-block { margin-top: 8px; }
|
||||
|
||||
.image-generating {
|
||||
display: flex;
|
||||
@@ -587,6 +596,11 @@ textarea:focus { border-color: #e94560; }
|
||||
flex-direction: row !important;
|
||||
padding: 8px 0;
|
||||
}
|
||||
.hint-text {
|
||||
font-size: 0.8rem;
|
||||
color: #888;
|
||||
margin: 0 0 8px;
|
||||
}
|
||||
.chat-settings-meta {
|
||||
margin-top: 12px; padding: 10px;
|
||||
background: #1a1a2e; border-radius: 8px;
|
||||
|
||||
@@ -0,0 +1,209 @@
|
||||
/* app.css sets body { overflow: hidden; height: 100vh } for chat layout */
|
||||
html:has(body.debug-page),
|
||||
body.debug-page {
|
||||
height: auto;
|
||||
min-height: 100vh;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.debug-page {
|
||||
background: #0f0f1a;
|
||||
color: #ddd;
|
||||
min-height: 100vh;
|
||||
padding-bottom: 48px;
|
||||
}
|
||||
|
||||
.debug-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
padding: 12px 20px;
|
||||
border-bottom: 1px solid #1a2744;
|
||||
background: #16213e;
|
||||
}
|
||||
|
||||
.debug-header a {
|
||||
color: #9b7fd4;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.debug-header h1 {
|
||||
flex: 1;
|
||||
margin: 0;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.debug-tabs {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
padding: 8px 16px;
|
||||
background: #12121f;
|
||||
border-bottom: 1px solid #1a2744;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.debug-tabs button {
|
||||
background: transparent;
|
||||
border: 1px solid #2a3a5c;
|
||||
color: #aaa;
|
||||
padding: 8px 14px;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.debug-tabs button.active {
|
||||
background: #1a2744;
|
||||
color: #e94560;
|
||||
border-color: #e94560;
|
||||
}
|
||||
|
||||
.debug-main {
|
||||
padding: 16px 20px 40px;
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.debug-panel {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.debug-panel.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.debug-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
|
||||
gap: 12px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.debug-grid label,
|
||||
.debug-main > label {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
font-size: 0.85rem;
|
||||
color: #aaa;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.debug-grid input,
|
||||
.debug-grid select,
|
||||
.debug-main textarea,
|
||||
.debug-main input,
|
||||
.debug-main select {
|
||||
background: #1a1a2e;
|
||||
border: 1px solid #0f3460;
|
||||
color: #eee;
|
||||
border-radius: 6px;
|
||||
padding: 8px;
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.debug-main textarea {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
font-family: ui-monospace, monospace;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.debug-btn {
|
||||
background: #1a2744;
|
||||
border: 1px solid #3a5080;
|
||||
color: #ccc;
|
||||
padding: 8px 16px;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.debug-btn.primary {
|
||||
background: #e94560;
|
||||
border-color: #e94560;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.debug-btn:hover {
|
||||
filter: brightness(1.1);
|
||||
}
|
||||
|
||||
.debug-row {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.debug-out {
|
||||
background: #0a0a14;
|
||||
border: 1px solid #1a2744;
|
||||
border-radius: 8px;
|
||||
padding: 12px;
|
||||
overflow: auto;
|
||||
max-height: 420px;
|
||||
font-size: 0.8rem;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.debug-out.compact {
|
||||
max-height: 160px;
|
||||
}
|
||||
|
||||
.debug-out.small {
|
||||
max-height: 240px;
|
||||
}
|
||||
|
||||
.debug-split {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
.debug-split {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
.debug-split h3,
|
||||
.debug-main h3 {
|
||||
font-size: 0.9rem;
|
||||
color: #9b7fd4;
|
||||
margin: 16px 0 8px;
|
||||
}
|
||||
|
||||
.debug-img-wrap {
|
||||
margin: 12px 0;
|
||||
}
|
||||
|
||||
.debug-img-wrap img {
|
||||
max-width: 100%;
|
||||
max-height: 512px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #333;
|
||||
}
|
||||
|
||||
.debug-img-wrap.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.model-list-block {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.model-list-block summary {
|
||||
cursor: pointer;
|
||||
color: #9b7fd4;
|
||||
}
|
||||
|
||||
.model-list-block ul {
|
||||
margin: 4px 0 0;
|
||||
padding-left: 1.2rem;
|
||||
font-size: 0.8rem;
|
||||
max-height: 120px;
|
||||
overflow: auto;
|
||||
}
|
||||
@@ -0,0 +1,134 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Debug — AI ChatBot</title>
|
||||
<link rel="stylesheet" href="/static/css/app.css">
|
||||
<link rel="stylesheet" href="/static/css/debug.css">
|
||||
</head>
|
||||
<body class="debug-page">
|
||||
<header class="debug-header">
|
||||
<a href="/">← Чат</a>
|
||||
<h1>Debug</h1>
|
||||
<button type="button" id="btnReloadConfig">↻ Config</button>
|
||||
</header>
|
||||
|
||||
<nav class="debug-tabs" id="debugTabs">
|
||||
<button type="button" class="active" data-tab="config">Config</button>
|
||||
<button type="button" data-tab="sdprompt">SD Prompt</button>
|
||||
<button type="button" data-tab="llm">LLM</button>
|
||||
<button type="button" data-tab="comfy">ComfyUI</button>
|
||||
</nav>
|
||||
|
||||
<main class="debug-main">
|
||||
<section class="debug-panel active" id="panel-config">
|
||||
<pre id="configOut" class="debug-out">Загрузка…</pre>
|
||||
</section>
|
||||
|
||||
<section class="debug-panel" id="panel-sdprompt">
|
||||
<div class="debug-grid">
|
||||
<label>Персонаж
|
||||
<select id="sdPersona"></select>
|
||||
</label>
|
||||
<label>Outfit JSON
|
||||
<input type="text" id="sdOutfit" value="[]" placeholder='["dress", "barefoot"]'>
|
||||
</label>
|
||||
<label>Appearance override (опц.)
|
||||
<input type="text" id="sdAppearance" placeholder="оставьте пустым — из карточки">
|
||||
</label>
|
||||
<label>
|
||||
<input type="checkbox" id="sdUseProse"> Использовать prose для Anima
|
||||
</label>
|
||||
</div>
|
||||
<label>Чат (user: / assistant:)
|
||||
<textarea id="sdChat" rows="8" placeholder="user: привет assistant: *улыбается*"></textarea>
|
||||
</label>
|
||||
<button type="button" class="debug-btn primary" id="btnSdPrompt">Собрать промпт (SD_PROMPT_MODEL)</button>
|
||||
<div class="debug-split">
|
||||
<div>
|
||||
<h3>Scene JSON</h3>
|
||||
<pre id="sdScene" class="debug-out">—</pre>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Теги / гибрид</h3>
|
||||
<pre id="sdPrompts" class="debug-out">—</pre>
|
||||
</div>
|
||||
</div>
|
||||
<details>
|
||||
<summary>LLM raw + builder</summary>
|
||||
<pre id="sdLlmRaw" class="debug-out small">—</pre>
|
||||
</details>
|
||||
</section>
|
||||
|
||||
<section class="debug-panel" id="panel-llm">
|
||||
<div class="debug-grid">
|
||||
<label>Model
|
||||
<input type="text" id="llmModel" placeholder="пусто = SD_PROMPT_MODEL / SYSTEM">
|
||||
</label>
|
||||
</div>
|
||||
<label>System
|
||||
<textarea id="llmSystem" rows="4"></textarea>
|
||||
</label>
|
||||
<label>User
|
||||
<textarea id="llmUser" rows="6"></textarea>
|
||||
</label>
|
||||
<button type="button" class="debug-btn primary" id="btnLlm">Отправить</button>
|
||||
<pre id="llmOut" class="debug-out">—</pre>
|
||||
</section>
|
||||
|
||||
<section class="debug-panel" id="panel-comfy">
|
||||
<div class="debug-row">
|
||||
<button type="button" class="debug-btn" id="btnComfyPing">Ping /system_stats</button>
|
||||
<button type="button" class="debug-btn" id="btnComfyModels">Загрузить модели (/object_info)</button>
|
||||
</div>
|
||||
<pre id="comfyPingOut" class="debug-out compact">—</pre>
|
||||
|
||||
<h3>Модели в Comfy</h3>
|
||||
<div class="debug-grid" id="comfyModelLists">—</div>
|
||||
|
||||
<h3>Генерация</h3>
|
||||
<div class="debug-grid">
|
||||
<label>UNET <select id="genUnet"><option value="">— env —</option></select></label>
|
||||
<label>CLIP <select id="genClip"><option value="">— env —</option></select></label>
|
||||
<label>VAE <select id="genVae"><option value="">— env —</option></select></label>
|
||||
<label>Checkpoint <select id="genCkpt"><option value="">— env / Anima —</option></select></label>
|
||||
</div>
|
||||
<label>Positive
|
||||
<textarea id="genPositive" rows="4"></textarea>
|
||||
</label>
|
||||
<label>Negative
|
||||
<textarea id="genNegative" rows="2"></textarea>
|
||||
</label>
|
||||
<button type="button" class="debug-btn primary" id="btnComfyGen">Сгенерировать</button>
|
||||
<div id="comfyImgWrap" class="debug-img-wrap hidden">
|
||||
<img id="comfyImg" alt="result">
|
||||
</div>
|
||||
<pre id="comfyGenOut" class="debug-out compact">—</pre>
|
||||
|
||||
<h3>Raw API</h3>
|
||||
<div class="debug-grid">
|
||||
<label>Method
|
||||
<select id="rawMethod">
|
||||
<option>GET</option>
|
||||
<option>POST</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>Path
|
||||
<input type="text" id="rawPath" value="/system_stats">
|
||||
</label>
|
||||
</div>
|
||||
<label>Query JSON
|
||||
<textarea id="rawParams" rows="2">{}</textarea>
|
||||
</label>
|
||||
<label>Body JSON (POST)
|
||||
<textarea id="rawBody" rows="4" placeholder="{}"></textarea>
|
||||
</label>
|
||||
<button type="button" class="debug-btn" id="btnComfyRaw">Выполнить</button>
|
||||
<pre id="comfyRawOut" class="debug-out">—</pre>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<script type="module" src="/static/js/debug.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
+5
-1
@@ -13,6 +13,7 @@
|
||||
<h1>🤖 AI Chat</h1>
|
||||
<span class="header-title" id="headerTitle">Новый чат</span>
|
||||
<span id="rpgBadge" class="rpg-badge hidden" title="RPG режим">RPG</span>
|
||||
<a href="/debug" class="header-icon-btn" title="Debug" style="text-decoration:none">🛠</a>
|
||||
<button id="chatSettingsBtn" type="button" class="header-icon-btn" title="Настройки чата">⚙️</button>
|
||||
<span id="affinityDisplay" class="affinity-display hidden"></span>
|
||||
</header>
|
||||
@@ -314,6 +315,9 @@
|
||||
<label>Название чата
|
||||
<input type="text" id="chatSettingsTitle">
|
||||
</label>
|
||||
<p class="wizard-page-title">Персонаж чата</p>
|
||||
<p class="hint-text">Смена персонажа перепривязывает этот чат. Историю можно сохранить или очистить.</p>
|
||||
<div class="persona-pick-grid" id="chatSettingsPersonaGrid"></div>
|
||||
<label class="rpg-mode-option">
|
||||
<input type="checkbox" id="chatSettingsRpg"> RPG режим
|
||||
</label>
|
||||
@@ -346,6 +350,6 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="module" src="/static/js/app.js?v=4"></script>
|
||||
<script type="module" src="/static/js/app.js?v=9"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
+73
-26
@@ -1,9 +1,9 @@
|
||||
import { sessionId, currentPersona, dom } from './state.js';
|
||||
import { parseImagePromptFromContent, copyToClipboard } from './utils.js';
|
||||
import { parseImagePromptFromContent, copyToClipboard, splitSdPromptForCopy } from './utils.js';
|
||||
|
||||
export async function initChat(options = {}) {
|
||||
if (!sessionId || !currentPersona) return;
|
||||
const payload = { message: '', session_id: sessionId, persona_id: currentPersona };
|
||||
if (!sessionId) return;
|
||||
const payload = { message: '', session_id: sessionId };
|
||||
if (options.first_mes_override?.trim()) payload.first_mes_override = options.first_mes_override.trim();
|
||||
const res = await fetch('/chat/init', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(payload) });
|
||||
if (!res.ok) return;
|
||||
@@ -16,19 +16,22 @@ export function updateEmptyState() {
|
||||
dom.emptyState?.classList.toggle('hidden', !!hasMessages);
|
||||
}
|
||||
|
||||
export function createImagePromptBlock(promptText) {
|
||||
function createImagePromptBlockSingle(label, promptText) {
|
||||
const block = document.createElement('div');
|
||||
block.className = 'image-prompt-block';
|
||||
const header = document.createElement('div');
|
||||
header.className = 'image-prompt-header';
|
||||
header.innerHTML = '<span>🎨 SD prompt</span>';
|
||||
header.innerHTML = `<span>🎨 ${label}</span>`;
|
||||
|
||||
const copyBtn = document.createElement('button');
|
||||
copyBtn.type = 'button';
|
||||
copyBtn.className = 'copy-prompt-btn';
|
||||
copyBtn.textContent = 'Копировать';
|
||||
copyBtn.addEventListener('click', async () => {
|
||||
const ok = await copyToClipboard(promptText);
|
||||
copyBtn.addEventListener('click', async (e) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
const full = textEl.textContent?.trim() || promptText || '';
|
||||
const ok = await copyToClipboard(splitSdPromptForCopy(full));
|
||||
copyBtn.textContent = ok ? 'Скопировано' : 'Ошибка';
|
||||
setTimeout(() => { copyBtn.textContent = 'Копировать'; }, 1500);
|
||||
});
|
||||
@@ -39,11 +42,10 @@ export function createImagePromptBlock(promptText) {
|
||||
regenBtn.className = 'copy-prompt-btn';
|
||||
regenBtn.textContent = '🖼 Перегенерировать';
|
||||
regenBtn.addEventListener('click', async () => {
|
||||
const wrapper = block.parentElement;
|
||||
const wrapper = block.closest('.message');
|
||||
regenBtn.disabled = true;
|
||||
regenBtn.textContent = '⏳…';
|
||||
wrapper?.querySelector('.chat-image')?.remove();
|
||||
wrapper?.querySelector('.image-error')?.remove();
|
||||
wrapper?.querySelectorAll('.chat-image-wrap, .chat-image, .image-error').forEach(el => el.remove());
|
||||
showImageGenerating(wrapper);
|
||||
try {
|
||||
const res = await fetch('/images/generate', {
|
||||
@@ -76,6 +78,26 @@ export function createImagePromptBlock(promptText) {
|
||||
return block;
|
||||
}
|
||||
|
||||
export function createImagePromptBlock(promptText, promptAlt = null) {
|
||||
const wrap = document.createElement('div');
|
||||
wrap.className = 'image-prompt-blocks';
|
||||
wrap.appendChild(createImagePromptBlockSingle('SD prompt', promptText));
|
||||
const alt = (promptAlt || '').trim();
|
||||
const main = (promptText || '').trim();
|
||||
if (alt && alt !== main) {
|
||||
wrap.appendChild(createImagePromptBlockSingle('SD prompt (только теги)', promptAlt));
|
||||
}
|
||||
return wrap;
|
||||
}
|
||||
|
||||
/** Replace or create tag + optional hybrid prompt blocks under a message. */
|
||||
export function ensureImagePromptBlocks(wrapper, tagPrompt, altPrompt = null) {
|
||||
if (!wrapper || !tagPrompt) return;
|
||||
wrapper.querySelector('.image-prompt-blocks')?.remove();
|
||||
wrapper.querySelectorAll('.image-prompt-block').forEach(el => el.remove());
|
||||
wrapper.appendChild(createImagePromptBlock(tagPrompt, altPrompt || null));
|
||||
}
|
||||
|
||||
const OUTCOME_CLASS = {
|
||||
'critical failure': 'outcome-crit-fail',
|
||||
'failure': 'outcome-fail',
|
||||
@@ -113,7 +135,7 @@ function renderNarratorMessage(narrator) {
|
||||
return el;
|
||||
}
|
||||
|
||||
function renderChoices(wrapper, choices) {
|
||||
export function renderChoices(wrapper, choices) {
|
||||
if (!choices?.length) return;
|
||||
const row = document.createElement('div');
|
||||
row.className = 'choice-row';
|
||||
@@ -169,12 +191,21 @@ export function updateAffinityDisplay(affinity) {
|
||||
el.className = `affinity-display ${affinity > 5 ? 'affinity-high' : affinity < -3 ? 'affinity-low' : ''}`;
|
||||
}
|
||||
|
||||
export function appendChatImage(wrapper, imagePath) {
|
||||
export function appendChatImage(wrapper, imagePath, label = '') {
|
||||
if (!imagePath) return;
|
||||
const figure = document.createElement('figure');
|
||||
figure.className = 'chat-image-wrap';
|
||||
if (label) {
|
||||
const cap = document.createElement('figcaption');
|
||||
cap.className = 'chat-image-label';
|
||||
cap.textContent = label;
|
||||
figure.appendChild(cap);
|
||||
}
|
||||
const img = document.createElement('img');
|
||||
img.className = 'chat-image';
|
||||
img.src = imagePath;
|
||||
wrapper.appendChild(img);
|
||||
figure.appendChild(img);
|
||||
wrapper.appendChild(figure);
|
||||
}
|
||||
|
||||
export function showImageGenerating(wrapper) {
|
||||
@@ -262,7 +293,7 @@ async function regenerateMessage(messageId, wrapper) {
|
||||
const res = await fetch('/chat/regenerate', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ session_id: sessionId, persona_id: currentPersona, message_id: messageId }),
|
||||
body: JSON.stringify({ session_id: sessionId, message_id: messageId }),
|
||||
});
|
||||
if (!res.ok) throw new Error('Ошибка: ' + res.status);
|
||||
removeTyping();
|
||||
@@ -303,6 +334,8 @@ export async function reloadChatFromServer(id) {
|
||||
m.image_prompt,
|
||||
m.image_path ? `/static/${m.image_path}` : null,
|
||||
m.id,
|
||||
m.image_prompt_alt,
|
||||
m.image_path_alt ? `/static/${m.image_path_alt}` : null,
|
||||
);
|
||||
});
|
||||
}
|
||||
@@ -344,8 +377,12 @@ async function consumeStream(res) {
|
||||
if (data.image_generating && bubble) {
|
||||
bubble.classList.remove('typing-active');
|
||||
const wrapper = bubble.parentElement;
|
||||
if (data.image_prompt && !wrapper.querySelector('.image-prompt-block')) {
|
||||
wrapper.appendChild(createImagePromptBlock(data.image_prompt));
|
||||
if (data.image_prompt) {
|
||||
ensureImagePromptBlocks(
|
||||
wrapper,
|
||||
data.image_prompt,
|
||||
data.image_prompt_alt || null,
|
||||
);
|
||||
}
|
||||
showImageGenerating(wrapper);
|
||||
dom.messagesEl.scrollTop = dom.messagesEl.scrollHeight;
|
||||
@@ -361,14 +398,15 @@ async function consumeStream(res) {
|
||||
bubble.textContent = bubble.textContent.replace(IMAGE_PROMPT_RE, '').trim();
|
||||
}
|
||||
|
||||
if (data.image_prompt && wrapper && !wrapper.querySelector('.image-prompt-block')) {
|
||||
wrapper.appendChild(createImagePromptBlock(data.image_prompt));
|
||||
if (data.image_prompt && wrapper) {
|
||||
ensureImagePromptBlocks(
|
||||
wrapper,
|
||||
data.image_prompt,
|
||||
data.image_prompt_alt || null,
|
||||
);
|
||||
}
|
||||
if (data.image_path && wrapper) {
|
||||
console.log('[image] appending', data.image_path, 'to', wrapper);
|
||||
appendChatImage(wrapper, data.image_path);
|
||||
} else {
|
||||
console.log('[image] skip: image_path=', data.image_path, 'wrapper=', wrapper);
|
||||
appendChatImage(wrapper, data.image_path, '');
|
||||
}
|
||||
if (data.image_error && wrapper) {
|
||||
const err = document.createElement('div');
|
||||
@@ -388,7 +426,15 @@ async function consumeStream(res) {
|
||||
}
|
||||
}
|
||||
|
||||
export function addMessage(role, content = '', imagePrompt = null, imagePath = null, messageId = null) {
|
||||
export function addMessage(
|
||||
role,
|
||||
content = '',
|
||||
imagePrompt = null,
|
||||
imagePath = null,
|
||||
messageId = null,
|
||||
imagePromptAlt = null,
|
||||
imagePathAlt = null,
|
||||
) {
|
||||
updateEmptyState();
|
||||
const wrapper = document.createElement('div');
|
||||
wrapper.className = `message ${role}`;
|
||||
@@ -446,8 +492,9 @@ export function addMessage(role, content = '', imagePrompt = null, imagePath = n
|
||||
wrapper.appendChild(translateBtn);
|
||||
}
|
||||
|
||||
if (prompt) wrapper.appendChild(createImagePromptBlock(prompt));
|
||||
if (imagePath) appendChatImage(wrapper, imagePath);
|
||||
if (prompt) wrapper.appendChild(createImagePromptBlock(prompt, imagePromptAlt));
|
||||
if (imagePath) appendChatImage(wrapper, imagePath, imagePathAlt ? 'Теги' : '');
|
||||
if (imagePathAlt) appendChatImage(wrapper, imagePathAlt, 'Гибрид');
|
||||
attachMessageActions(wrapper, messageId, role);
|
||||
dom.messagesEl.appendChild(wrapper);
|
||||
dom.messagesEl.scrollTop = dom.messagesEl.scrollHeight;
|
||||
@@ -487,7 +534,7 @@ export async function sendMessage(text, isNarratorChoice = false) {
|
||||
const res = await fetch('/chat/stream', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ message: text, session_id: sessionId, persona_id: currentPersona, is_narrator_choice: isNarratorChoice }),
|
||||
body: JSON.stringify({ message: text, session_id: sessionId, is_narrator_choice: isNarratorChoice }),
|
||||
});
|
||||
if (!res.ok) throw new Error('Ошибка сервера: ' + res.status);
|
||||
removeTyping();
|
||||
|
||||
@@ -1,7 +1,10 @@
|
||||
import { sessionId, currentPersona, dom } from './state.js';
|
||||
import { sessionId, currentPersona, setCurrentPersona, dom } from './state.js';
|
||||
import { GENRE_LABELS, bindGenreGrid, resetGenreGrid } from './utils.js';
|
||||
import { personaIndex } from './personas.js';
|
||||
|
||||
const chatSettingsGenres = new Set();
|
||||
let chatSettingsPersonaId = 'default';
|
||||
let chatSettingsInitialPersonaId = 'default';
|
||||
|
||||
function updateChatSettingsGenresLabel() {
|
||||
const el = document.getElementById('chatSettingsGenresLabel');
|
||||
@@ -15,6 +18,26 @@ function updateChatSettingsGenresLabel() {
|
||||
}
|
||||
}
|
||||
|
||||
function fillChatSettingsPersonaGrid() {
|
||||
const grid = document.getElementById('chatSettingsPersonaGrid');
|
||||
if (!grid) return;
|
||||
grid.innerHTML = '';
|
||||
for (const p of personaIndex.values()) {
|
||||
const card = document.createElement('button');
|
||||
card.type = 'button';
|
||||
card.className = 'persona-pick-card' + (p.persona_id === chatSettingsPersonaId ? ' selected' : '');
|
||||
card.dataset.id = p.persona_id;
|
||||
card.innerHTML = `<span class="emoji">${p.emoji || '🤖'}</span>${p.name}`;
|
||||
card.addEventListener('click', () => {
|
||||
chatSettingsPersonaId = p.persona_id;
|
||||
grid.querySelectorAll('.persona-pick-card').forEach(c => {
|
||||
c.classList.toggle('selected', c.dataset.id === chatSettingsPersonaId);
|
||||
});
|
||||
});
|
||||
grid.appendChild(card);
|
||||
}
|
||||
}
|
||||
|
||||
function loadRpgSettingsToDom(prefix, settings) {
|
||||
document.getElementById(`${prefix}SettingDice`).checked = settings.dice !== false;
|
||||
document.getElementById(`${prefix}SettingNarrator`).checked = settings.narrator !== false;
|
||||
@@ -67,6 +90,10 @@ export async function openChatSettings() {
|
||||
const s = await res.json();
|
||||
|
||||
document.getElementById('chatSettingsTitle').value = s.title || '';
|
||||
chatSettingsPersonaId = s.persona_id || 'default';
|
||||
chatSettingsInitialPersonaId = chatSettingsPersonaId;
|
||||
fillChatSettingsPersonaGrid();
|
||||
|
||||
const rpgOn = !!s.rpg_enabled;
|
||||
document.getElementById('chatSettingsRpg').checked = rpgOn;
|
||||
document.getElementById('chatSettingsRpgBlock').classList.toggle('hidden', !rpgOn);
|
||||
@@ -117,13 +144,45 @@ export function initChatSettings() {
|
||||
|
||||
document.getElementById('chatSettingsSave')?.addEventListener('click', async () => {
|
||||
if (!sessionId) return;
|
||||
const { loadSessions, applySessionUi } = await import('./sessions.js');
|
||||
const { loadSessions, applySessionUi, renderSystemBlob } = await import('./sessions.js');
|
||||
const { reloadChatFromServer } = await import('./chat.js');
|
||||
const { highlightPersonaBar } = await import('./personas.js');
|
||||
|
||||
const title = document.getElementById('chatSettingsTitle').value.trim();
|
||||
const rpgOn = document.getElementById('chatSettingsRpg').checked;
|
||||
const genreValue = [...chatSettingsGenres].join(',') || 'adventure';
|
||||
const settings = readRpgSettingsFromDom('cs');
|
||||
|
||||
if (chatSettingsPersonaId !== chatSettingsInitialPersonaId) {
|
||||
const pName = personaIndex.get(chatSettingsPersonaId)?.name || chatSettingsPersonaId;
|
||||
const keepHistory = confirm(
|
||||
`Перепривязать чат к «${pName}»?\n\n`
|
||||
+ 'OK — сохранить историю сообщений (персонаж в старых репликах может не совпадать).\n'
|
||||
+ 'Отмена — очистить историю и начать с приветствия нового персонажа.',
|
||||
);
|
||||
const clearHistory = !keepHistory;
|
||||
|
||||
const rebindRes = await fetch(`/sessions/${sessionId}/rebind-persona`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
persona_id: chatSettingsPersonaId,
|
||||
clear_history: clearHistory,
|
||||
}),
|
||||
});
|
||||
if (!rebindRes.ok) {
|
||||
const err = await rebindRes.json().catch(() => ({}));
|
||||
alert(err.detail || 'Не удалось сменить персонажа');
|
||||
return;
|
||||
}
|
||||
setCurrentPersona(chatSettingsPersonaId);
|
||||
chatSettingsInitialPersonaId = chatSettingsPersonaId;
|
||||
highlightPersonaBar(chatSettingsPersonaId);
|
||||
await reloadChatFromServer(sessionId);
|
||||
const blobRes = await fetch(`/chat/system/${sessionId}`);
|
||||
if (blobRes.ok) renderSystemBlob(await blobRes.json());
|
||||
}
|
||||
|
||||
await fetch(`/sessions/${sessionId}`, {
|
||||
method: 'PATCH',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
@@ -141,7 +200,7 @@ export function initChatSettings() {
|
||||
let arc = {};
|
||||
try { arc = JSON.parse(s.plot_arc_json || '{}'); } catch { /* ignore */ }
|
||||
if (!arc || !Object.keys(arc).length) {
|
||||
await bootstrapRpg(sessionId, currentPersona, genreValue, settings);
|
||||
await bootstrapRpg(sessionId, chatSettingsPersonaId, genreValue, settings);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,217 @@
|
||||
const $ = (id) => document.getElementById(id);
|
||||
|
||||
function fmt(obj) {
|
||||
return typeof obj === 'string' ? obj : JSON.stringify(obj, null, 2);
|
||||
}
|
||||
|
||||
async function api(path, opts = {}) {
|
||||
const res = await fetch(path, {
|
||||
headers: { 'Content-Type': 'application/json', ...(opts.headers || {}) },
|
||||
...opts,
|
||||
});
|
||||
const text = await res.text();
|
||||
let data;
|
||||
try {
|
||||
data = JSON.parse(text);
|
||||
} catch {
|
||||
data = text;
|
||||
}
|
||||
if (!res.ok) {
|
||||
const detail = data?.detail || text || res.statusText;
|
||||
throw new Error(`${res.status}: ${detail}`);
|
||||
}
|
||||
return data;
|
||||
}
|
||||
|
||||
function initTabs() {
|
||||
const tabs = document.querySelectorAll('#debugTabs button');
|
||||
tabs.forEach((btn) => {
|
||||
btn.addEventListener('click', () => {
|
||||
tabs.forEach((t) => t.classList.remove('active'));
|
||||
btn.classList.add('active');
|
||||
document.querySelectorAll('.debug-panel').forEach((p) => p.classList.remove('active'));
|
||||
$(`panel-${btn.dataset.tab}`).classList.add('active');
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
async function loadConfig() {
|
||||
const c = await api('/debug/config');
|
||||
$('configOut').textContent = fmt(c);
|
||||
$('llmModel').placeholder = c.sd_prompt_model || c.system_model;
|
||||
return c;
|
||||
}
|
||||
|
||||
async function loadPersonas() {
|
||||
const list = await api('/debug/personas');
|
||||
const sel = $('sdPersona');
|
||||
sel.innerHTML = '';
|
||||
for (const p of list) {
|
||||
const opt = document.createElement('option');
|
||||
opt.value = p.persona_id;
|
||||
opt.textContent = `${p.name} (${p.persona_id})`;
|
||||
sel.appendChild(opt);
|
||||
}
|
||||
}
|
||||
|
||||
async function runSdPrompt() {
|
||||
$('sdScene').textContent = '…';
|
||||
$('sdPrompts').textContent = '…';
|
||||
const body = {
|
||||
persona_id: $('sdPersona').value,
|
||||
chat_excerpt: $('sdChat').value,
|
||||
outfit_json: $('sdOutfit').value || '[]',
|
||||
use_prose: $('sdUseProse') ? $('sdUseProse').checked : false,
|
||||
};
|
||||
const app = $('sdAppearance').value.trim();
|
||||
if (app) body.appearance_override = app;
|
||||
|
||||
const data = await api('/debug/sd-prompt', { method: 'POST', body: JSON.stringify(body) });
|
||||
$('sdScene').textContent = data.scene ? fmt(data.scene) : (data.error || '—');
|
||||
const prompts = [];
|
||||
if (data.tags_only_full) prompts.push('=== TAGS + POV (no prose) ===\n' + data.tags_only_full);
|
||||
if (data.hybrid_full) prompts.push('\n=== HYBRID (Comfy) ===\n' + data.hybrid_full);
|
||||
if (!data.tags_only_full && data.tag_full) prompts.push('=== PROMPT ===\n' + data.tag_full);
|
||||
$('sdPrompts').textContent = prompts.join('\n') || data.error || '—';
|
||||
$('sdLlmRaw').textContent = [
|
||||
`model: ${data.sd_prompt_model}`,
|
||||
`dual: ${data.anima_dual}`,
|
||||
'',
|
||||
'--- system ---',
|
||||
data.builder_system || '',
|
||||
'',
|
||||
'--- user ---',
|
||||
data.builder_user || '',
|
||||
'',
|
||||
'--- raw ---',
|
||||
data.llm_raw || data.error || '',
|
||||
].join('\n');
|
||||
if (data.tag_full || data.hybrid_full) {
|
||||
const src = data.hybrid_full || data.tag_full;
|
||||
const parts = src.includes('__NEGATIVE_PROMPT__')
|
||||
? src.split('\n\n__NEGATIVE_PROMPT__\n\n')
|
||||
: src.includes('\n\nNegative prompt:')
|
||||
? src.split('\n\nNegative prompt:')
|
||||
: [src, ''];
|
||||
$('genPositive').value = parts[0] || '';
|
||||
$('genNegative').value = parts[1] || '';
|
||||
}
|
||||
}
|
||||
|
||||
async function runLlm() {
|
||||
$('llmOut').textContent = '…';
|
||||
const data = await api('/debug/llm', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({
|
||||
model: $('llmModel').value.trim(),
|
||||
system: $('llmSystem').value,
|
||||
user: $('llmUser').value,
|
||||
}),
|
||||
});
|
||||
$('llmOut').textContent = `model: ${data.model}\n\n${data.response}`;
|
||||
}
|
||||
|
||||
function fillModelSelect(sel, options, configured) {
|
||||
const current = sel.querySelector('option')?.value ?? '';
|
||||
sel.innerHTML = `<option value="">— env: ${configured || '—'} —</option>`;
|
||||
for (const name of options || []) {
|
||||
const opt = document.createElement('option');
|
||||
opt.value = name;
|
||||
opt.textContent = name;
|
||||
if (name === configured) opt.selected = true;
|
||||
sel.appendChild(opt);
|
||||
}
|
||||
}
|
||||
|
||||
async function loadComfyModels() {
|
||||
$('comfyModelLists').textContent = 'Загрузка object_info…';
|
||||
const data = await api('/debug/comfy/models');
|
||||
const { models, configured } = data;
|
||||
fillModelSelect($('genUnet'), models.unets, configured.unet);
|
||||
fillModelSelect($('genClip'), models.clips, configured.clip);
|
||||
fillModelSelect($('genVae'), models.vaes, configured.vae);
|
||||
fillModelSelect($('genCkpt'), models.checkpoints, configured.checkpoint);
|
||||
|
||||
const wrap = $('comfyModelLists');
|
||||
wrap.innerHTML = '';
|
||||
for (const [key, list] of Object.entries(models)) {
|
||||
const block = document.createElement('details');
|
||||
block.className = 'model-list-block';
|
||||
block.open = key === 'unets' || key === 'checkpoints';
|
||||
block.innerHTML = `<summary>${key} (${list.length})</summary>`;
|
||||
const ul = document.createElement('ul');
|
||||
for (const item of list) {
|
||||
const li = document.createElement('li');
|
||||
li.textContent = item;
|
||||
ul.appendChild(li);
|
||||
}
|
||||
block.appendChild(ul);
|
||||
wrap.appendChild(block);
|
||||
}
|
||||
}
|
||||
|
||||
async function comfyPing() {
|
||||
$('comfyPingOut').textContent = '…';
|
||||
const data = await api('/debug/comfy/ping');
|
||||
$('comfyPingOut').textContent = fmt(data);
|
||||
}
|
||||
|
||||
async function comfyGenerate() {
|
||||
$('comfyGenOut').textContent = 'Генерация…';
|
||||
$('comfyImgWrap').classList.add('hidden');
|
||||
const body = {
|
||||
positive: $('genPositive').value,
|
||||
negative: $('genNegative').value,
|
||||
};
|
||||
const u = $('genUnet').value;
|
||||
const c = $('genClip').value;
|
||||
const v = $('genVae').value;
|
||||
const ck = $('genCkpt').value;
|
||||
if (u) body.unet = u;
|
||||
if (c) body.clip = c;
|
||||
if (v) body.vae = v;
|
||||
if (ck) body.checkpoint = ck;
|
||||
|
||||
const data = await api('/debug/comfy/generate', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify(body),
|
||||
});
|
||||
$('comfyGenOut').textContent = fmt(data);
|
||||
if (data.image_path) {
|
||||
$('comfyImg').src = data.image_path + '?t=' + Date.now();
|
||||
$('comfyImgWrap').classList.remove('hidden');
|
||||
}
|
||||
}
|
||||
|
||||
async function comfyRaw() {
|
||||
$('comfyRawOut').textContent = '…';
|
||||
const data = await api('/debug/comfy/raw', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({
|
||||
method: $('rawMethod').value,
|
||||
path: $('rawPath').value,
|
||||
params_json: $('rawParams').value || '{}',
|
||||
body_json: $('rawBody').value || '',
|
||||
}),
|
||||
});
|
||||
$('comfyRawOut').textContent = fmt(data);
|
||||
}
|
||||
|
||||
function bind() {
|
||||
initTabs();
|
||||
$('btnReloadConfig').addEventListener('click', loadConfig);
|
||||
$('btnSdPrompt').addEventListener('click', () => runSdPrompt().catch(showErr));
|
||||
$('btnLlm').addEventListener('click', () => runLlm().catch(showErr));
|
||||
$('btnComfyPing').addEventListener('click', () => comfyPing().catch(showErr));
|
||||
$('btnComfyModels').addEventListener('click', () => loadComfyModels().catch(showErr));
|
||||
$('btnComfyGen').addEventListener('click', () => comfyGenerate().catch(showErr));
|
||||
$('btnComfyRaw').addEventListener('click', () => comfyRaw().catch(showErr));
|
||||
}
|
||||
|
||||
function showErr(e) {
|
||||
alert(e.message || String(e));
|
||||
}
|
||||
|
||||
bind();
|
||||
loadConfig().catch(showErr);
|
||||
loadPersonas().catch(showErr);
|
||||
+81
-45
@@ -1,4 +1,9 @@
|
||||
import { setSessionId, setCurrentPersona, currentPersona, dom } from './state.js';
|
||||
import {
|
||||
setSessionId,
|
||||
setCurrentPersona,
|
||||
getNewChatDefaultPersona,
|
||||
dom,
|
||||
} from './state.js';
|
||||
import {
|
||||
initWizard,
|
||||
GENRE_LABELS,
|
||||
@@ -7,9 +12,9 @@ import {
|
||||
fillGreetingSelect,
|
||||
getSelectedGreeting,
|
||||
} from './utils.js';
|
||||
import { personaIndex, highlightPersona } from './personas.js';
|
||||
import { personaIndex } from './personas.js';
|
||||
|
||||
let newChatPersonaId = currentPersona;
|
||||
let newChatPersonaId = getNewChatDefaultPersona();
|
||||
let newChatGreetingCtx = null;
|
||||
const newChatGenres = new Set();
|
||||
const newChatModalEl = document.getElementById('newChatModal');
|
||||
@@ -84,7 +89,7 @@ function fillNewChatPersonaGrid() {
|
||||
const grid = document.getElementById('newChatPersonaGrid');
|
||||
if (!grid) return;
|
||||
grid.innerHTML = '';
|
||||
newChatPersonaId = currentPersona;
|
||||
newChatPersonaId = getNewChatDefaultPersona();
|
||||
for (const p of personaIndex.values()) {
|
||||
const card = document.createElement('button');
|
||||
card.type = 'button';
|
||||
@@ -121,34 +126,8 @@ function updateNewChatGenresLabel() {
|
||||
}
|
||||
}
|
||||
|
||||
async function bootstrapRpg(sid, personaId, genreValue, settings) {
|
||||
const { updateQuestPanel, addMessage } = await import('./chat.js');
|
||||
await fetch(`/sessions/${sid}`, {
|
||||
method: 'PATCH',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
rpg_enabled: true,
|
||||
genre: genreValue,
|
||||
rpg_settings_json: JSON.stringify(settings),
|
||||
}),
|
||||
});
|
||||
const res = await fetch('/chat/rpg/bootstrap', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ session_id: sid, persona_id: personaId, genre: genreValue }),
|
||||
});
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
if (data.quests) updateQuestPanel(data.quests);
|
||||
if (data.plot_arc) {
|
||||
const title = data.plot_arc.title || '';
|
||||
const hint = data.plot_arc.next_beat_hint || '';
|
||||
if (title || hint) addMessage('assistant', `📖 ${title}${hint ? '\n' + hint : ''}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export function openNewChatWizard() {
|
||||
import('./personas.js').then(({ refreshPersonaBarHighlight }) => refreshPersonaBarHighlight());
|
||||
fillNewChatPersonaGrid();
|
||||
resetGenreGrid(document.getElementById('newChatGenreGrid'), newChatGenres);
|
||||
updateNewChatGenresLabel();
|
||||
@@ -161,8 +140,17 @@ export function openNewChatWizard() {
|
||||
}
|
||||
|
||||
export async function createNewChatFromWizard() {
|
||||
const { clearMessages, initChat, reloadChatFromServer } = await import('./chat.js');
|
||||
const { loadSessions, applySessionUi } = await import('./sessions.js');
|
||||
const {
|
||||
clearMessages,
|
||||
initChat,
|
||||
reloadChatFromServer,
|
||||
showImageGenerating,
|
||||
removeImageGenerating,
|
||||
updateQuestPanel,
|
||||
updateAffinityDisplay,
|
||||
renderChoices,
|
||||
} = await import('./chat.js');
|
||||
const { loadSessions, applySessionUi, renderSystemBlob } = await import('./sessions.js');
|
||||
|
||||
const sid = 'sess_' + Math.random().toString(36).slice(2, 10);
|
||||
setSessionId(sid);
|
||||
@@ -176,10 +164,22 @@ export async function createNewChatFromWizard() {
|
||||
newChatWizard?.reset();
|
||||
|
||||
try {
|
||||
const sessionPatch = { persona_id: newChatPersonaId, rpg_enabled: rpg };
|
||||
if (rpg) {
|
||||
sessionPatch.genre = [...newChatGenres].join(',') || 'adventure';
|
||||
sessionPatch.rpg_settings_json = JSON.stringify({
|
||||
dice: document.getElementById('ncSettingDice')?.checked ?? true,
|
||||
narrator: document.getElementById('ncSettingNarrator')?.checked ?? true,
|
||||
quests: document.getElementById('ncSettingQuests')?.checked ?? true,
|
||||
affinity: document.getElementById('ncSettingAffinity')?.checked ?? true,
|
||||
choices: document.getElementById('ncSettingChoices')?.checked ?? true,
|
||||
});
|
||||
}
|
||||
|
||||
await fetch(`/sessions/${sid}`, {
|
||||
method: 'PATCH',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ persona_id: newChatPersonaId, rpg_enabled: rpg }),
|
||||
body: JSON.stringify(sessionPatch),
|
||||
});
|
||||
|
||||
if (customTitle) {
|
||||
@@ -194,25 +194,61 @@ export async function createNewChatFromWizard() {
|
||||
dom.headerTitle.textContent = rpg ? `${pName} — RPG` : `${pName} — новый чат`;
|
||||
}
|
||||
|
||||
highlightPersona(newChatPersonaId);
|
||||
const { highlightPersonaBar } = await import('./personas.js');
|
||||
highlightPersonaBar(newChatPersonaId);
|
||||
const greetingOverride = getNewChatFirstMesOverride();
|
||||
await initChat(greetingOverride ? { first_mes_override: greetingOverride } : {});
|
||||
|
||||
if (rpg) {
|
||||
const genreValue = [...newChatGenres].join(',') || 'adventure';
|
||||
const settings = {
|
||||
dice: document.getElementById('ncSettingDice')?.checked ?? true,
|
||||
narrator: document.getElementById('ncSettingNarrator')?.checked ?? true,
|
||||
quests: document.getElementById('ncSettingQuests')?.checked ?? true,
|
||||
affinity: document.getElementById('ncSettingAffinity')?.checked ?? true,
|
||||
choices: document.getElementById('ncSettingChoices')?.checked ?? true,
|
||||
};
|
||||
await bootstrapRpg(sid, newChatPersonaId, genreValue, settings);
|
||||
const assistantWrapper = dom.messagesEl.querySelector('.message.assistant');
|
||||
showImageGenerating(assistantWrapper);
|
||||
|
||||
let openingData = null;
|
||||
try {
|
||||
const openingRes = await fetch('/chat/opening/process', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
session_id: sid,
|
||||
persona_id: newChatPersonaId,
|
||||
rpg,
|
||||
}),
|
||||
});
|
||||
openingData = await openingRes.json();
|
||||
if (!openingRes.ok) {
|
||||
console.error('opening/process failed:', openingData.detail || openingRes.statusText);
|
||||
}
|
||||
} finally {
|
||||
removeImageGenerating(assistantWrapper);
|
||||
}
|
||||
|
||||
await reloadChatFromServer(sid);
|
||||
|
||||
if (openingData?.quests?.length) {
|
||||
updateQuestPanel(openingData.quests);
|
||||
}
|
||||
if (openingData?.affinity !== undefined) {
|
||||
updateAffinityDisplay(openingData.affinity);
|
||||
}
|
||||
if (openingData?.choices?.length) {
|
||||
const wrapper = dom.messagesEl.querySelector('.message.assistant');
|
||||
if (wrapper) renderChoices(wrapper, openingData.choices);
|
||||
}
|
||||
if (openingData?.image_error) {
|
||||
const wrapper = dom.messagesEl.querySelector('.message.assistant');
|
||||
if (wrapper) {
|
||||
const err = document.createElement('div');
|
||||
err.className = 'image-error';
|
||||
err.textContent = '🖼 ' + openingData.image_error;
|
||||
wrapper.appendChild(err);
|
||||
}
|
||||
}
|
||||
|
||||
const sessionRes = await fetch(`/sessions/${sid}`);
|
||||
if (sessionRes.ok) applySessionUi(await sessionRes.json());
|
||||
|
||||
const blobRes = await fetch(`/chat/system/${sid}`);
|
||||
if (blobRes.ok) renderSystemBlob(await blobRes.json());
|
||||
|
||||
await loadSessions();
|
||||
} catch (e) {
|
||||
console.error('createNewChat error:', e);
|
||||
|
||||
+18
-14
@@ -1,5 +1,9 @@
|
||||
import { currentPersona, setCurrentPersona, sessionId } from './state.js';
|
||||
import { initChat } from './chat.js';
|
||||
import {
|
||||
currentPersona,
|
||||
sessionId,
|
||||
getNewChatDefaultPersona,
|
||||
setNewChatDefaultPersona,
|
||||
} from './state.js';
|
||||
import { initWizard, fillGreetingSelect, getSelectedGreeting } from './utils.js';
|
||||
|
||||
export let personaIndex = new Map();
|
||||
@@ -21,12 +25,18 @@ let cardImportWizard;
|
||||
let cardPreview = null;
|
||||
let cardImportFile = null;
|
||||
|
||||
export function highlightPersona(personaId) {
|
||||
export function highlightPersonaBar(personaId) {
|
||||
document.querySelectorAll('.persona-card').forEach(c => {
|
||||
c.classList.toggle('active', c.dataset.id === personaId);
|
||||
});
|
||||
}
|
||||
|
||||
/** Active session → session persona; otherwise new-chat preset. */
|
||||
export function refreshPersonaBarHighlight() {
|
||||
const id = sessionId ? currentPersona : getNewChatDefaultPersona();
|
||||
highlightPersonaBar(id);
|
||||
}
|
||||
|
||||
export async function loadPersonas() {
|
||||
const res = await fetch('/personas/');
|
||||
const personas = await res.json();
|
||||
@@ -37,9 +47,11 @@ export async function loadPersonas() {
|
||||
const bar = document.getElementById('personaBar');
|
||||
bar.innerHTML = '';
|
||||
|
||||
const barActiveId = sessionId ? currentPersona : getNewChatDefaultPersona();
|
||||
|
||||
personas.forEach(p => {
|
||||
const card = document.createElement('div');
|
||||
card.className = 'persona-card' + (p.persona_id === currentPersona ? ' active' : '');
|
||||
card.className = 'persona-card' + (p.persona_id === barActiveId ? ' active' : '');
|
||||
card.dataset.id = p.persona_id;
|
||||
const isCard = p.persona_id.startsWith('card_');
|
||||
const isCustomPersona = p.custom && !isCard;
|
||||
@@ -131,16 +143,8 @@ export async function loadPersonas() {
|
||||
}
|
||||
|
||||
export async function selectPersona(personaId) {
|
||||
setCurrentPersona(personaId);
|
||||
highlightPersona(personaId);
|
||||
if (sessionId) {
|
||||
await fetch(`/sessions/${sessionId}`, {
|
||||
method: 'PATCH',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ persona_id: personaId }),
|
||||
});
|
||||
await initChat();
|
||||
}
|
||||
setNewChatDefaultPersona(personaId);
|
||||
highlightPersonaBar(personaId);
|
||||
}
|
||||
|
||||
function fillImpCardForm(preview) {
|
||||
|
||||
@@ -2,7 +2,7 @@ import {
|
||||
sessionId, setSessionId, setCurrentPersona, currentPersona, dom, setRpgEnabled,
|
||||
} from './state.js';
|
||||
import { updateQuestPanel, updateAffinityDisplay } from './chat.js';
|
||||
import { highlightPersona, personaIndex } from './personas.js';
|
||||
import { highlightPersonaBar, personaIndex } from './personas.js';
|
||||
import { formatSessionDate } from './utils.js';
|
||||
import { openNewChatWizard } from './newChatWizard.js';
|
||||
|
||||
@@ -114,7 +114,7 @@ export async function loadChatHistory(id) {
|
||||
const s = await sessionRes.json();
|
||||
if (s.persona_id) {
|
||||
setCurrentPersona(s.persona_id);
|
||||
highlightPersona(s.persona_id);
|
||||
highlightPersonaBar(s.persona_id);
|
||||
}
|
||||
applySessionUi(s);
|
||||
}
|
||||
@@ -155,7 +155,7 @@ export async function initSessions() {
|
||||
|
||||
let _prevBlobSections = {};
|
||||
|
||||
function renderSystemBlob(blob) {
|
||||
export function renderSystemBlob(blob) {
|
||||
const tryFmt = (str, fallback = '') => {
|
||||
try { return JSON.stringify(JSON.parse(str), null, 2); } catch { return str || fallback; }
|
||||
};
|
||||
@@ -165,13 +165,18 @@ function renderSystemBlob(blob) {
|
||||
return ` ${icon} [${q.status}] ${q.title}`;
|
||||
}).join('\n');
|
||||
|
||||
const personaLine = blob.persona_id
|
||||
? `[persona] ${blob.persona_name || blob.persona_id} (${blob.persona_id})`
|
||||
: '';
|
||||
|
||||
const sections = {
|
||||
persona: personaLine,
|
||||
system_prompt: blob.system_prompt ? `[system_prompt]\n${blob.system_prompt}` : '',
|
||||
status_quo: blob.status_quo ? `[status_quo]\n${blob.status_quo}` : '',
|
||||
affinity: blob.affinity != null ? `[affinity] ${blob.affinity}` : '',
|
||||
genre: blob.genre ? `[genre] ${blob.genre}` : '',
|
||||
rpg_settings: blob.rpg_settings_json && blob.rpg_settings_json !== '{}' ? `[rpg_settings]\n${tryFmt(blob.rpg_settings_json)}` : '',
|
||||
outfit: blob.outfit_json && blob.outfit_json !== '[]' ? `[outfit]\n${tryFmt(blob.outfit_json)}` : '',
|
||||
outfit: `[outfit]\n${tryFmt(blob.outfit_json ?? '[]')}`,
|
||||
facts: blob.facts_json && blob.facts_json !== '[]' ? `[facts]\n${tryFmt(blob.facts_json)}` : '',
|
||||
plot_arc: blob.plot_arc_json && blob.plot_arc_json !== '{}' ? `[plot_arc]\n${tryFmt(blob.plot_arc_json)}` : '',
|
||||
quests: questLines ? `[quests]\n${questLines}` : '',
|
||||
|
||||
+17
-3
@@ -1,17 +1,31 @@
|
||||
export let sessionId = localStorage.getItem('chat_session_id') || null;
|
||||
export let currentPersona = localStorage.getItem('persona_id') || 'default';
|
||||
/** Persona bound to the active session (from server, not global preset). */
|
||||
export let currentPersona = 'default';
|
||||
export let sidebarOpen = true;
|
||||
export let rpgEnabled = false;
|
||||
|
||||
const NEW_CHAT_PERSONA_KEY = 'new_chat_persona_id';
|
||||
|
||||
export function toggleSidebar() { sidebarOpen = !sidebarOpen; return sidebarOpen; }
|
||||
|
||||
export function getNewChatDefaultPersona() {
|
||||
return localStorage.getItem(NEW_CHAT_PERSONA_KEY)
|
||||
|| localStorage.getItem('persona_id')
|
||||
|| 'default';
|
||||
}
|
||||
|
||||
export function setNewChatDefaultPersona(id) {
|
||||
const pid = id || 'default';
|
||||
localStorage.setItem(NEW_CHAT_PERSONA_KEY, pid);
|
||||
}
|
||||
|
||||
export function setSessionId(id) {
|
||||
sessionId = id;
|
||||
if (id) localStorage.setItem('chat_session_id', id);
|
||||
}
|
||||
|
||||
export function setCurrentPersona(id) {
|
||||
currentPersona = id;
|
||||
localStorage.setItem('persona_id', id);
|
||||
currentPersona = id || 'default';
|
||||
}
|
||||
|
||||
export function setRpgEnabled(v) { rpgEnabled = !!v; }
|
||||
|
||||
+21
-1
@@ -6,12 +6,32 @@ export function parseImagePromptFromContent(content) {
|
||||
return { text, prompt };
|
||||
}
|
||||
|
||||
export function splitSdPromptForCopy(fullPrompt) {
|
||||
if (!fullPrompt) return '';
|
||||
const marker = '\n\nNegative prompt:';
|
||||
const i = fullPrompt.indexOf(marker);
|
||||
return (i >= 0 ? fullPrompt.slice(0, i) : fullPrompt).trim();
|
||||
}
|
||||
|
||||
export async function copyToClipboard(text) {
|
||||
if (!text) return false;
|
||||
try {
|
||||
await navigator.clipboard.writeText(text);
|
||||
return true;
|
||||
} catch {
|
||||
return false;
|
||||
try {
|
||||
const ta = document.createElement('textarea');
|
||||
ta.value = text;
|
||||
ta.setAttribute('readonly', '');
|
||||
ta.style.cssText = 'position:fixed;left:-9999px;top:0';
|
||||
document.body.appendChild(ta);
|
||||
ta.select();
|
||||
const ok = document.execCommand('copy');
|
||||
document.body.removeChild(ta);
|
||||
return ok;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user