neuroalpha 0.5.8 → 0.5.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "neuroalpha",
-  "version": "0.5.8",
+  "version": "0.5.9",
   "description": "НейроАльфа — ИИ-автопилот для рынка акций Мосбиржи: эмбеддинги акций, самообучение правил, коннекторы Т-Банк / БКС / Финам / Алор и боты Telegram / MAX",
   "author": "Roman A. Perepelkin",
   "license": "UNLICENSED",

package/public/app.js

@@ -72,7 +72,9 @@ const md = (s) => {
       ? `${p1}<span class="sym-link" data-sym="${sym}" title="Открыть досье акции ${sym}"><b>${sym}</b></span>`
       : m
   ));
-  return DOMPurify.sanitize(withSyms, { FORBID_TAGS: ['style', 'form', 'input', 'button', 'textarea', 'select'], FORBID_ATTR: ['style'] });
+  // широкие таблицы листаются внутри своей обёртки, а не растягивают ленту чата
+  const withWraps = withSyms.replace(/<table>/g, '<div class="tbl-wrap"><table>').replace(/<\/table>/g, '</table></div>');
+  return DOMPurify.sanitize(withWraps, { FORBID_TAGS: ['style', 'form', 'input', 'button', 'textarea', 'select'], FORBID_ATTR: ['style'] });
 };
 const chartTime = (ts) => Math.floor((ts + MSK) / 1000);
 const debounce = (fn, ms) => { let t; return (...a) => { clearTimeout(t); t = setTimeout(() => fn(...a), ms); }; };
@@ -1115,18 +1117,58 @@ const TOOL_LABELS = {
   connect_broker_account: 'Подключение брокерского счёта',
 };
 const STATUS = { pending: 'ждёт вашего решения', approved: 'подтверждено', running: 'выполняется…', done: 'готово', error: 'не получилось', rejected: 'отклонено' };
+// Автопрокрутка ленты чата («прилипание к низу»):
+// • пока пользователь внизу, новые сообщения и потоковый ответ прокручивают ленту вниз;
+// • как только пользователь сам прокрутил вверх (колесо, тач, клавиши, полоса прокрутки) — лента его не дёргает;
+// • прилипание возвращается, когда пользователь сам дошёл до низа, нажал «↓» или отправил новый запрос.
 const feed = $('#feed');
-const nearBottom = () => feed.scrollHeight - feed.scrollTop - feed.clientHeight < 120;
-const scrollDown = (force) => { if (force || nearBottom()) requestAnimationFrame(() => { feed.scrollTop = feed.scrollHeight; }); };
 const feedDown = $('#feed-down');
+const BOTTOM_EPS = 24;
+const distFromBottom = () => feed.scrollHeight - feed.scrollTop - feed.clientHeight;
+let stickToBottom = true;
+let lastFeedTop = 0;
+let feedScrollRaf = 0;
 let unseen = 0;
 const updateDown = () => {
-  feedDown.hidden = !unseen || nearBottom();
-  feedDown.textContent = unseen ? `↓ ${unseen}` : '↓';
+  const show = !stickToBottom && distFromBottom() > BOTTOM_EPS;
+  feedDown.hidden = !show;
+  feedDown.textContent = unseen ? `↓ ${unseen} нов.` : '↓';
 };
-const toBottom = () => { unseen = 0; scrollDown(true); updateDown(); };
-feed.addEventListener('scroll', () => { if (nearBottom()) unseen = 0; updateDown(); });
-feedDown.addEventListener('click', toBottom);
+const scrollDown = (force = false, smooth = false) => {
+  if (force) stickToBottom = true;
+  if (!stickToBottom) { updateDown(); return; }
+  cancelAnimationFrame(feedScrollRaf);
+  feedScrollRaf = requestAnimationFrame(() => {
+    if (!stickToBottom) return;
+    if (smooth) feed.scrollTo({ top: feed.scrollHeight, behavior: 'smooth' });
+    else feed.scrollTop = feed.scrollHeight;
+    lastFeedTop = feed.scrollTop;
+    unseen = 0;
+    updateDown();
+  });
+};
+const toBottom = (smooth = false) => { unseen = 0; scrollDown(true, smooth); };
+const releaseStick = () => { if (distFromBottom() > 2) { stickToBottom = false; updateDown(); } };
+feed.addEventListener('wheel', (e) => {
+  if (e.deltaY >= 0) return;
+  // прокрутка внутри блока размышлений или таблицы, которые сами ещё листаются вверх, ленту не трогает
+  const inner = e.target.closest?.('.think-body, .md-c pre, .md-c .tbl-wrap');
+  if (inner && inner.scrollTop > 0) return;
+  stickToBottom = false;
+  updateDown();
+}, { passive: true });
+feed.addEventListener('touchmove', releaseStick, { passive: true });
+feed.addEventListener('keydown', (e) => { if (['ArrowUp', 'PageUp', 'Home'].includes(e.key)) { stickToBottom = false; updateDown(); } });
+feed.addEventListener('scroll', () => {
+  const top = feed.scrollTop;
+  // прокрутка вверх (в том числе мышью за полосу прокрутки) — пользователь читает историю
+  if (top < lastFeedTop - 4 && distFromBottom() > BOTTOM_EPS) stickToBottom = false;
+  // пользователь сам вернулся вниз — снова следим за новыми сообщениями
+  if (distFromBottom() <= BOTTOM_EPS) { stickToBottom = true; unseen = 0; }
+  lastFeedTop = top;
+  updateDown();
+}, { passive: true });
+feedDown.addEventListener('click', () => toBottom(true));
 const msgEls = new Map();
 const liveEls = new Map();
 
@@ -1199,7 +1241,7 @@ function renderMsg(m) {
 function upsertMsg(m) {
   state.chat.msgs.set(m.id, m);
   const old = msgEls.get(m.id);
-  const stick = nearBottom();
+  const stick = stickToBottom;
   const el = renderMsg(m);
   if (!el) { old?.remove(); msgEls.delete(m.id); return; }
   if (old) {
@@ -1232,7 +1274,7 @@ function onDelta(d) {
 
 function liveLine(key, html) {
   let el = liveEls.get(key);
-  const stick = nearBottom();
+  const stick = stickToBottom;
   if (!el) { el = document.createElement('div'); el.className = 'live'; liveEls.set(key, el); feed.append(el); }
   el.innerHTML = html;
   if (stick) scrollDown(true);
@@ -1347,6 +1389,8 @@ async function sendChat(text) {
   if (speechRec && speechActive) stopVoiceInput(false);
   text = (text ?? $('#chat-input').value).trim();
   if (!text) return;
+  // новый запрос — лента снова «прилипает» к низу и показывает вопрос и потоковый ответ
+  toBottom(true);
   try {
     await post('/api/chat/send', { text, mode: 'advisor' });
     $('#chat-input').value = '';

package/public/styles.css

@@ -96,17 +96,26 @@ body.dragging iframe, body.dragging canvas { pointer-events: none; }
 .feed, .tab, .think-body, .modal .md { scrollbar-width: thin; scrollbar-color: #2a3140 transparent; }
 
 /* ---------- чат ---------- */
-.chat { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
+.chat { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; }
 .chat-head { display: flex; align-items: center; gap: 6px; padding: 8px 12px; border-bottom: 1px solid var(--line); }
 .chat-head select { font-size: 12.5px; padding: 3px 6px; }
 .chat-head label { font-size: 12px; color: var(--muted); }
 .chat-head label input { width: 46px; padding: 2px 4px; }
 .feed-wrap { flex: 1; min-height: 0; position: relative; display: flex; flex-direction: column; }
-.feed { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 10px; min-height: 0; }
-.feed-down { position: absolute; right: 16px; bottom: 10px; font-size: 12px; padding: 2px 12px; border-radius: 999px; background: var(--panel); box-shadow: 0 4px 14px #0008; }
-.msg { max-width: 92%; }
+/* Лента чата: только вертикальная прокрутка; широкое содержимое (таблицы, код) листается внутри своего блока */
+.feed { flex: 1; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; padding: 14px; display: flex; flex-direction: column; gap: 10px; min-height: 0; min-width: 0; }
+.feed > * { min-width: 0; max-width: 100%; }
+.feed-down { position: absolute; right: 16px; bottom: 10px; font-size: 12px; padding: 2px 12px; border-radius: 999px; background: var(--panel); box-shadow: 0 4px 14px #0008; z-index: 2; }
+.msg { max-width: 92%; min-width: 0; overflow-wrap: anywhere; word-break: break-word; }
 .msg.user { align-self: flex-end; background: #1d3359; border-radius: 12px 12px 3px 12px; padding: 7px 12px; white-space: pre-wrap; }
-.msg.ai { align-self: stretch; }
+.msg.ai { align-self: stretch; max-width: 100%; }
+.md-c { min-width: 0; max-width: 100%; }
+.md-c pre { max-width: 100%; overflow-x: auto; white-space: pre; background: var(--panel); padding: 8px 10px; border-radius: 6px; }
+.md-c pre code { background: none; padding: 0; }
+.md-c .tbl-wrap { max-width: 100%; overflow-x: auto; margin: 6px 0; }
+.md-c .tbl-wrap table { margin: 0; }
+.md-c img { max-width: 100%; height: auto; }
+.ev, .live, .act { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
 .md-c > :first-child { margin-top: 0; }
 .md-c > :last-child { margin-bottom: 0; }
 .md-c p { margin: 6px 0; }