feat: typing indicator mit agent-name und random phrases
- typing-phrases.js in index.html eingebunden - startTypingIndicator() / stopTypingIndicator() in chat.js - Agent-Name via setCurrentAgentName() aus chat-page.js gesetzt - Phrase wechselt alle 3 Sekunden zufällig - Cleanup bei destroy() und finally-Block
This commit is contained in:
1 parent
c5f2ed54fd
commit
f941eae00a
5 files changed
+74
-6
No files matched your search
+36
-3
@@ -161,6 +161,38 @@ let _currentToolBox = null; // Aktuell laufende Tool-Box (für Stream-Events)
|
||||
let _chatAbandoned = false; // true wenn User weg-navigiert während Stream läuft
|
||||
let _abortController = null; // AbortController für laufenden Stream
|
||||
|
||||
// ── Typing Indicator ──
|
||||
|
||||
let _currentAgentName = null;
|
||||
let _typingInterval = null;
|
||||
|
||||
function setCurrentAgentName(name) {
|
||||
_currentAgentName = name;
|
||||
}
|
||||
|
||||
function _randomTypingPhrase() {
|
||||
return TYPING_PHRASES[Math.floor(Math.random() * TYPING_PHRASES.length)];
|
||||
}
|
||||
|
||||
function _buildTypingHtml(phrase) {
|
||||
var name = _currentAgentName || 'Agent';
|
||||
return '<span><i class="fa fa-hourglass-half"></i> ' + esc(name) + ' ' + esc(phrase) + '...</span>';
|
||||
}
|
||||
|
||||
function startTypingIndicator() {
|
||||
setMetaHtml(_buildTypingHtml(_randomTypingPhrase()));
|
||||
_typingInterval = setInterval(function() {
|
||||
setMetaHtml(_buildTypingHtml(_randomTypingPhrase()));
|
||||
}, 3000);
|
||||
}
|
||||
|
||||
function stopTypingIndicator() {
|
||||
if (_typingInterval) {
|
||||
clearInterval(_typingInterval);
|
||||
_typingInterval = null;
|
||||
}
|
||||
}
|
||||
|
||||
async function clearChat() {
|
||||
const archive = await apiArchive(getCurrentSessionId());
|
||||
if (!archive) return;
|
||||
@@ -213,7 +245,7 @@ async function _runStream(fetchPromise) {
|
||||
_currentToolBox = null;
|
||||
_chatAbandoned = false;
|
||||
_stopClickCount = 0;
|
||||
setMetaHtml('<span><i class="fa fa-hourglass-half"></i> Streaming...</span>');
|
||||
startTypingIndicator();
|
||||
|
||||
try {
|
||||
const resp = await fetchPromise(_abortController.signal);
|
||||
@@ -250,7 +282,7 @@ async function _runStream(fetchPromise) {
|
||||
try {
|
||||
const status = await apiIsStreaming(sid);
|
||||
if (status.streaming) {
|
||||
setMetaHtml('<span><i class="fa fa-hourglass-half"></i> Streaming... (Verbindung wiederhergestellt)</span>');
|
||||
startTypingIndicator();
|
||||
startStreamingPoll(sid, sendBtn, status.chainId);
|
||||
return;
|
||||
}
|
||||
@@ -259,6 +291,7 @@ async function _runStream(fetchPromise) {
|
||||
}
|
||||
} finally {
|
||||
if (_chatAbandoned) return;
|
||||
stopTypingIndicator();
|
||||
if (!isStreaming || !_streamingPollInterval) {
|
||||
sendBtn.disabled = false;
|
||||
sendBtn.hidden = false;
|
||||
@@ -269,7 +302,7 @@ async function _runStream(fetchPromise) {
|
||||
_abortController = null;
|
||||
// Meta zurücksetzen falls kein done-Event kam (z.B. nach Stop)
|
||||
var metaEl = $('#meta');
|
||||
if (metaEl && metaEl.textContent.includes('Streaming')) {
|
||||
if (metaEl && (metaEl.textContent.includes('Streaming') || metaEl.textContent.includes('...'))) {
|
||||
setMeta(_stopClickCount > 0 ? 'Gestoppt' : 'Bereit');
|
||||
}
|
||||
}
|
||||
|
||||
@@ -202,8 +202,11 @@ registerPage('chat', {
|
||||
if (session.agentId) {
|
||||
try {
|
||||
const agent = await apiGetAgent(session.agentId);
|
||||
if (agent && agent.customCommands) {
|
||||
agentCmds = JSON.parse(agent.customCommands) || [];
|
||||
if (agent) {
|
||||
setCurrentAgentName(agent.name || null);
|
||||
if (agent.customCommands) {
|
||||
agentCmds = JSON.parse(agent.customCommands) || [];
|
||||
}
|
||||
}
|
||||
} catch(e) {}
|
||||
}
|
||||
@@ -390,6 +393,8 @@ registerPage('chat', {
|
||||
// Stream nicht abbrechen (Backend soll weiterlaufen),
|
||||
// aber Frontend-Processing stoppen
|
||||
_chatAbandoned = true;
|
||||
stopTypingIndicator();
|
||||
setCurrentAgentName(null);
|
||||
closeEmojiPicker();
|
||||
if (this._closeMenu) {
|
||||
document.removeEventListener('click', this._closeMenu);
|
||||
|
||||
@@ -0,0 +1,29 @@
|
||||
const TYPING_PHRASES = [
|
||||
'denkt si wos',
|
||||
'grübelt',
|
||||
'schaut deppat drein',
|
||||
'brunzt',
|
||||
'scheißt an Kropfn',
|
||||
'krotzt si am Hirn',
|
||||
'hoit sei Goschn',
|
||||
'is am Schmäh fian',
|
||||
'raunzt leise vor si hi',
|
||||
'fladert a Idee',
|
||||
'schleicht si boid',
|
||||
'red mit si söba',
|
||||
'brettlt durch die Daten',
|
||||
'sudert',
|
||||
'bockts nimma',
|
||||
'schaut obs eh passt',
|
||||
'mocht a Hetz',
|
||||
'wuzelt si durch',
|
||||
'hod an Bickn',
|
||||
'zwickt si',
|
||||
'draht Dahma',
|
||||
'schnackselt mit der API',
|
||||
'is gonz narrisch',
|
||||
'hackelt',
|
||||
'sudert übers Wetter',
|
||||
'fetzt si mitn Code',
|
||||
'is am Wurschteln',
|
||||
];
|
||||
Reference in new issue
Block a user