PluginProbe
MxChat – AI Chatbot & Content Generation for WordPress / 2.6.0
MxChat – AI Chatbot & Content Generation for WordPress v2.6.0
3.2.21 3.2.20 3.2.19 3.2.18 3.2.17 3.2.16 3.2.15 3.2.14 3.2.12 3.2.13 3.2.11 3.2.10 3.2.9 3.2.8 3.2.7 3.2.6 3.2.5 3.2.4 3.2.3 3.2.2 3.2.1 2.0.3 2.0.4 2.0.5 2.0.6 All 152 releases
← All changes | js/chat-script.js +1149 -1621 3.2.4 → 2.6.0 View file →
@@ -1,228 +1,12 @@
1 1 jQuery(document).ready(function($) {
2 -
3 - // Nonce refresh is deferred until first user interaction (ensureSession)
4 - // to avoid admin-ajax calls on passive page loads.
5 - var nonceRefreshed = false;
6 - function refreshNonceIfNeeded(callback) {
7 - if (nonceRefreshed || typeof mxchatChat === 'undefined' || !mxchatChat.ajax_url) {
8 - if (callback) callback();
9 - return;
10 - }
11 - nonceRefreshed = true;
12 - $.post(mxchatChat.ajax_url, { action: 'mxchat_refresh_nonce' }, function(res) {
13 - if (res && res.success && res.data && res.data.nonce) {
14 - mxchatChat.nonce = res.data.nonce;
15 - }
16 - if (callback) callback();
17 - });
18 - }
19 -
2 +
20 3 // ====================================
21 - // MULTI-INSTANCE MANAGEMENT SYSTEM
22 - // ====================================
23 -
24 - // Instance registry - tracks all chatbot instances on the page
25 - const MxChatInstances = {
26 - instances: {},
27 -
28 - // Initialize an instance for a bot
29 - init: function(botId) {
30 - if (!this.instances[botId]) {
31 - // When persistence is OFF, track when this session started
32 - // so the AI only sees messages from this page load
33 - var chatPersistenceEnabled = typeof mxchatChat !== 'undefined' && mxchatChat.chat_persistence_toggle === 'on';
34 -
35 - this.instances[botId] = {
36 - botId: botId,
37 - sessionId: null,
38 - lastSeenMessageId: '',
39 - notificationCheckInterval: null,
40 - pollingInterval: null,
41 - processedMessageIds: new Set(),
42 - activePdfFile: null,
43 - activeWordFile: null,
44 - chatHistoryLoaded: false,
45 - isStreaming: false,
46 - // Fresh context timestamp - only used when persistence is OFF
47 - sessionStartTimestamp: chatPersistenceEnabled ? 0 : Date.now()
48 - };
49 - }
50 - return this.instances[botId];
51 - },
52 -
53 - // Get instance by botId
54 - get: function(botId) {
55 - return this.instances[botId] || this.init(botId);
56 - },
57 -
58 - // Get all active bot IDs
59 - getAllBotIds: function() {
60 - return Object.keys(this.instances);
61 - },
62 -
63 - // Session management per bot
64 - // Returns existing session ID from cookie or localStorage (with in-memory fallback),
65 - // or null if none exists. Does NOT create a new session — use ensureSession() for that.
66 - getChatSession: function(botId) {
67 - var cookieName = 'mxchat_session_id_' + botId;
68 - var storageKey = 'mxchat_session_id_' + botId;
69 - var sessionId = getCookie(cookieName);
70 -
71 - // Fallback to localStorage if cookie is missing (e.g. cleared by browser/consent)
72 - if (!sessionId) {
73 - try { sessionId = localStorage.getItem(storageKey); } catch (e) {}
74 - }
75 -
76 - // Fallback to in-memory instance when cookie AND localStorage are both blocked
77 - // (Safari ITP, strict tracking prevention, cross-origin iframes with partitioned
78 - // storage). Without this, ensureSession() can generate and store an ID that
79 - // getChatSession() then can't read back, causing null session_ids on send.
80 - if (!sessionId && this.instances[botId] && this.instances[botId].sessionId) {
81 - sessionId = this.instances[botId].sessionId;
82 - }
83 -
84 - // Guard against stored sentinel values that indicate earlier broken writes.
85 - if (sessionId === 'null' || sessionId === 'undefined') {
86 - sessionId = null;
87 - }
88 -
89 - // Re-sync cookie from localStorage if cookie was lost
90 - if (sessionId && !getCookie(cookieName)) {
91 - document.cookie = cookieName + "=" + sessionId + "; path=/; max-age=86400; SameSite=Lax";
92 - }
93 -
94 - return sessionId || null;
95 - },
96 -
97 - // Lazy session initializer — called on first user interaction
98 - ensureSession: function(botId) {
99 - botId = botId || 'default';
100 - var instance = this.instances[botId] || this.init(botId);
101 -
102 - if (instance.sessionId) {
103 - return instance.sessionId;
104 - }
105 -
106 - // Check for existing session from cookie or localStorage
107 - var existingSession = this.getChatSession(botId);
108 -
109 - if (existingSession) {
110 - instance.sessionId = existingSession;
111 - } else {
112 - // Brand new session
113 - var newId = generateSessionId();
114 - this.setChatSession(botId, newId);
115 - instance.sessionId = newId;
116 - }
117 -
118 - // Now that we have a session, do the deferred work
119 - refreshNonceIfNeeded();
120 - trackOriginatingPage();
121 -
122 - // Note: loadChatHistory is handled by showChatContainerForBot with loader UI,
123 - // so we do NOT call it here to avoid a race condition.
124 -
125 - return instance.sessionId;
126 - },
127 -
128 - setChatSession: function(botId, sessionId) {
129 - var cookieName = 'mxchat_session_id_' + botId;
130 - var storageKey = 'mxchat_session_id_' + botId;
131 - document.cookie = cookieName + "=" + sessionId + "; path=/; max-age=86400; SameSite=Lax";
132 - try { localStorage.setItem(storageKey, sessionId); } catch (e) {}
133 - if (this.instances[botId]) {
134 - this.instances[botId].sessionId = sessionId;
135 - }
136 - },
137 -
138 - resetChatSession: function(botId) {
139 - // Clear old session from localStorage before setting new one
140 - try { localStorage.removeItem('mxchat_session_id_' + botId); } catch (e) {}
141 - var newSessionId = generateSessionId();
142 - this.setChatSession(botId, newSessionId);
143 - var $chatBox = getElement(botId, 'chat-box');
144 - if ($chatBox.length) {
145 - $chatBox.find('.user-message, .bot-message:not(:first), .agent-message').remove();
146 - }
147 - if (this.instances[botId]) {
148 - this.instances[botId].chatHistoryLoaded = false;
149 - this.instances[botId].processedMessageIds = new Set();
150 - }
151 - },
152 -
153 - // Silent reset — new session ID without clearing the chat UI
154 - // Used when IP changes mid-conversation so the user doesn't see messages vanish
155 - silentResetSession: function(botId) {
156 - try { localStorage.removeItem('mxchat_session_id_' + botId); } catch (e) {}
157 - var newSessionId = generateSessionId();
158 - this.setChatSession(botId, newSessionId);
159 - if (this.instances[botId]) {
160 - this.instances[botId].sessionId = newSessionId;
161 - }
162 - return newSessionId;
163 - }
164 - };
165 -
166 - // ====================================
167 - // ELEMENT SELECTOR HELPERS
168 - // ====================================
169 -
170 - // Check if a specific bot has an AI theme assigned (skip inline colors)
171 - function shouldSkipInlineColors(botId) {
172 - // If global AI theme is active, skip inline colors for all bots
173 - if (mxchatChat.skip_inline_colors) {
174 - return true;
175 - }
176 - // Check if this specific bot has a theme assignment
177 - var botAssignments = mxchatChat.bot_theme_assignments || {};
178 - return botAssignments.hasOwnProperty(botId);
179 - }
180 -
181 - // Get element by ID with bot suffix - returns jQuery object
182 - function getElement(botId, elementName) {
183 - return $('#' + elementName + '-' + botId);
184 - }
185 -
186 - // Get element by ID with bot suffix - returns DOM element
187 - function getElementDOM(botId, elementName) {
188 - return document.getElementById(elementName + '-' + botId);
189 - }
190 -
191 - // Get bot ID from any element within a chatbot instance
192 - function getBotIdFromElement(element) {
193 - var $wrapper = $(element).closest('.mxchat-chatbot-wrapper');
194 - if ($wrapper.length) {
195 - return $wrapper.data('bot-id') || 'default';
196 - }
197 - // Fallback: try to find from floating container
198 - var $floating = $(element).closest('.floating-chatbot');
199 - if ($floating.length) {
200 - var id = $floating.attr('id') || '';
201 - var match = id.match(/floating-chatbot-(.+)/);
202 - if (match) return match[1];
203 - }
204 - // Fallback: check if element itself has an ID with bot suffix (e.g., floating-chatbot-button-{bot_id})
205 - var elementId = $(element).attr('id') || '';
206 - if (elementId) {
207 - // Match patterns like: floating-chatbot-button-{bot_id}, pre-chat-message-{bot_id}
208 - var idMatch = elementId.match(/^(?:floating-chatbot-button|pre-chat-message|chat-notification-badge)-(.+)$/);
209 - if (idMatch) return idMatch[1];
210 - }
211 - return 'default';
212 - }
213 -
214 - // Get wrapper element for a bot
215 - function getWrapper(botId) {
216 - return getElement(botId, 'mxchat-chatbot-wrapper');
217 - }
218 -
219 - // ====================================
220 4 // GLOBAL VARIABLES & CONFIGURATION
221 5 // ====================================
222 6 const toolbarIconColor = mxchatChat.toolbar_icon_color || '#212121';
223 -
224 - // Initialize color settings (these are global as they come from PHP)
7 +
8 + // Initialize color settings
225 9 var userMessageBgColor = mxchatChat.user_message_bg_color;
226 10 var userMessageFontColor = mxchatChat.user_message_font_color;
227 11 var botMessageBgColor = mxchatChat.bot_message_bg_color;
228 12 var botMessageFontColor = mxchatChat.bot_message_font_color;
@@ -227,64 +11,64 @@
227 11 var botMessageBgColor = mxchatChat.bot_message_bg_color;
228 12 var botMessageFontColor = mxchatChat.bot_message_font_color;
229 13 var liveAgentMessageBgColor = mxchatChat.live_agent_message_bg_color;
230 14 var liveAgentMessageFontColor = mxchatChat.live_agent_message_font_color;
231 -
15 +
232 16 var linkTarget = mxchatChat.link_target_toggle === 'on' ? '_blank' : '_self';
17 + let lastSeenMessageId = '';
18 + let notificationCheckInterval;
19 + let notificationBadge;
20 + var sessionId = getChatSession();
21 + let pollingInterval;
22 + let processedMessageIds = new Set();
23 + let activePdfFile = null;
24 + let activeWordFile = null;
25 + let chatHistoryLoaded = false;
233 26
234 27 // ====================================
235 - // SESSION MANAGEMENT (Legacy compatibility)
28 + // SESSION MANAGEMENT
236 29 // ====================================
237 -
30 +
31 + function getChatSession() {
32 + var sessionId = getCookie('mxchat_session_id');
33 + //console.log("Session ID retrieved from cookie: ", sessionId);
34 +
35 + if (!sessionId) {
36 + sessionId = generateSessionId();
37 + //console.log("Generated new session ID: ", sessionId);
38 + setChatSession(sessionId);
39 + }
40 +
41 + //console.log("Final session ID: ", sessionId);
42 + return sessionId;
43 + }
44 +
45 + function setChatSession(sessionId) {
46 + // Set the cookie with a 24-hour expiration (86400 seconds)
47 + document.cookie = "mxchat_session_id=" + sessionId + "; path=/; max-age=86400; SameSite=Lax";
48 + }
49 +
238 50 function getCookie(name) {
239 51 let value = "; " + document.cookie;
240 52 let parts = value.split("; " + name + "=");
241 53 if (parts.length == 2) return parts.pop().split(";").shift();
242 54 }
243 -
55 +
244 56 function generateSessionId() {
245 57 return 'mxchat_chat_' + Math.random().toString(36).substr(2, 9);
246 58 }
247 59
248 - // Legacy function - now delegates to instance manager
249 - function getChatSession(botId) {
250 - botId = botId || 'default';
251 - return MxChatInstances.getChatSession(botId);
60 + function resetChatSession() {
61 + // Generate a new session ID
62 + var newSessionId = generateSessionId();
63 + // Update the cookie with the new session
64 + setChatSession(newSessionId);
65 + // Clear the chat history display
66 + $('.mxchat-messages').empty();
67 + // Reset the chat history loaded flag
68 + chatHistoryLoaded = false;
252 69 }
253 70
254 - function setChatSession(sessionId, botId) {
255 - botId = botId || 'default';
256 - MxChatInstances.setChatSession(botId, sessionId);
257 - }
258 -
259 - function resetChatSession(botId) {
260 - botId = botId || 'default';
261 - MxChatInstances.resetChatSession(botId);
262 - }
263 -
264 - // ====================================
265 - // INITIALIZE ALL CHATBOT INSTANCES
266 - // ====================================
267 -
268 - function initializeAllInstances() {
269 - // Find all chatbot wrappers on the page
270 - $('.mxchat-chatbot-wrapper').each(function() {
271 - var botId = $(this).data('bot-id') || 'default';
272 - MxChatInstances.init(botId);
273 - initializeBotInstance(botId);
274 - });
275 - }
276 -
277 - function initializeBotInstance(botId) {
278 - var instance = MxChatInstances.get(botId);
279 -
280 - // Initialize quick questions state for this bot
281 - checkQuickQuestionsState(botId);
282 -
283 - // Note: Event handlers use event delegation with class selectors,
284 - // so they work automatically for all instances without per-bot setup
285 - }
286 -
287 71 // ====================================
288 72 // CONTEXTUAL AWARENESS FUNCTIONALITY
289 73 // ====================================
290 74
@@ -429,123 +213,70 @@
429 213
430 214 // ====================================
431 215 // CORE CHAT FUNCTIONALITY
432 216 // ====================================
433 -
434 -// Helper functions to disable/enable chat input while waiting for response
435 -function disableChatInput(botId) {
436 - botId = botId || 'default';
437 - var chatInput = getElementDOM(botId, 'chat-input');
438 - var sendButton = getElementDOM(botId, 'send-button');
439 - if (chatInput) {
440 - chatInput.disabled = true;
441 - chatInput.style.opacity = '0.6';
442 - }
443 - if (sendButton) {
444 - sendButton.disabled = true;
445 - sendButton.style.opacity = '0.5';
446 - sendButton.style.pointerEvents = 'none';
447 - }
448 -}
449 -
450 -function enableChatInput(botId) {
451 - botId = botId || 'default';
452 - var chatInput = getElementDOM(botId, 'chat-input');
453 - var sendButton = getElementDOM(botId, 'send-button');
454 - if (chatInput) {
455 - chatInput.disabled = false;
456 - chatInput.style.opacity = '1';
457 - chatInput.focus();
458 - }
459 - if (sendButton) {
460 - sendButton.disabled = false;
461 - sendButton.style.opacity = '1';
462 - sendButton.style.pointerEvents = 'auto';
463 - }
464 -}
465 -
466 217 // Update your existing sendMessage function
467 -function sendMessage(botId) {
468 - botId = botId || 'default';
469 - MxChatInstances.ensureSession(botId);
470 - var $chatInput = getElement(botId, 'chat-input');
471 - var message = $chatInput.val();
472 -
218 +function sendMessage() {
219 + var message = $('#chat-input').val();
220 +
473 221 // ADD PROMPT HOOK HERE
474 - if (typeof customMxChatFilter === 'function') {
475 - message = customMxChatFilter(message, "prompt");
222 + if (typeof customMxChatFilter === 'function') {
223 + message = customMxChatFilter(message, "prompt");
476 224 }
477 -
225 +
478 226 if (message) {
479 - // Don't disable input in live agent mode - let users chat freely
480 - var modeIndicator = getElementDOM(botId, 'chat-mode-indicator');
481 - var isAgentMode = modeIndicator && modeIndicator.textContent === 'Live Agent';
482 - if (!isAgentMode) {
483 - disableChatInput(botId);
484 - }
227 + appendMessage("user", message);
228 + $('#chat-input').val('');
229 + $('#chat-input').css('height', 'auto');
485 230
486 - appendMessage("user", message, '', [], false, botId);
487 - $chatInput.val('');
488 - $chatInput.css('height', 'auto');
489 -
490 - if (hasQuickQuestions(botId)) {
491 - collapseQuickQuestions(botId);
231 + if (hasQuickQuestions()) {
232 + collapseQuickQuestions();
492 233 }
493 - appendThinkingMessage(botId);
494 - scrollToBottom(botId);
234 + appendThinkingMessage();
235 + scrollToBottom();
495 236
496 - const currentModel = mxchatChat.model || 'gpt-5.1-chat-latest';
237 + const currentModel = mxchatChat.model || 'gpt-4o';
497 238
498 239 // Check if streaming is enabled AND supported for this model
499 240 if (shouldUseStreaming(currentModel)) {
500 241 callMxChatStream(message, function(response) {
501 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').removeClass('temporary-message');
502 - }, botId);
242 + $('.bot-message.temporary-message').removeClass('temporary-message');
243 + });
503 244 } else {
504 245 callMxChat(message, function(response) {
505 - replaceLastMessage("bot", response, '', [], botId);
506 - }, botId);
246 + replaceLastMessage("bot", response);
247 + });
507 248 }
508 249 }
509 250 }
510 251
511 252 // Update your existing sendMessageToChatbot function
512 -function sendMessageToChatbot(message, botId) {
513 - botId = botId || 'default';
514 - MxChatInstances.ensureSession(botId);
515 -
253 +function sendMessageToChatbot(message) {
516 254 // ADD PROMPT HOOK HERE
517 255 if (typeof customMxChatFilter === 'function') {
518 256 message = customMxChatFilter(message, "prompt");
519 257 }
258 +
259 + var sessionId = getChatSession();
520 260
521 - // Don't disable input in live agent mode - let users chat freely
522 - var modeIndicator = getElementDOM(botId, 'chat-mode-indicator');
523 - var isAgentMode = modeIndicator && modeIndicator.textContent === 'Live Agent';
524 - if (!isAgentMode) {
525 - disableChatInput(botId);
261 + if (hasQuickQuestions()) {
262 + collapseQuickQuestions();
526 263 }
264 + appendThinkingMessage();
265 + scrollToBottom();
527 266
528 - var sessionId = getChatSession(botId);
267 + const currentModel = mxchatChat.model || 'gpt-4o';
529 268
530 - if (hasQuickQuestions(botId)) {
531 - collapseQuickQuestions(botId);
532 - }
533 - appendThinkingMessage(botId);
534 - scrollToBottom(botId);
535 -
536 - const currentModel = mxchatChat.model || 'gpt-5.1-chat-latest';
537 -
538 269 // Check if streaming is enabled AND supported for this model
539 270 if (shouldUseStreaming(currentModel)) {
540 271 callMxChatStream(message, function(response) {
541 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').removeClass('temporary-message');
542 - }, botId);
272 + $('.bot-message.temporary-message').removeClass('temporary-message');
273 + });
543 274 } else {
544 275 callMxChat(message, function(response) {
545 - getElement(botId, 'chat-box').find('.temporary-message').remove();
546 - replaceLastMessage("bot", response, '', [], botId);
547 - }, botId);
276 + $('.temporary-message').remove();
277 + replaceLastMessage("bot", response);
278 + });
548 279 }
549 280 }
550 281
551 282 // Updated shouldUseStreaming function with debugging
@@ -588,53 +319,33 @@
588 319 updateChatModeIndicator('agent');
589 320 }
590 321 }
591 322
592 -// Function to get bot ID from any element or wrapper
593 -// If element is provided, finds the bot ID from its wrapper
594 -// If no element, returns 'default' (for backward compatibility)
595 -function getMxChatBotId(element) {
596 - if (element) {
597 - return getBotIdFromElement(element);
598 - }
599 - // Fallback: find first chatbot wrapper on page
600 - const chatbotWrapper = document.querySelector('.mxchat-chatbot-wrapper');
323 +//Function to get bot ID from the chatbot wrapper
324 +function getMxChatBotId() {
325 + const chatbotWrapper = document.getElementById('mxchat-chatbot-wrapper');
601 326 return chatbotWrapper ? chatbotWrapper.getAttribute('data-bot-id') || 'default' : 'default';
602 327 }
603 328
604 -function callMxChat(message, callback, botId) {
605 - botId = botId || getMxChatBotId();
606 -
329 +function callMxChat(message, callback) {
607 330 // Store the message in case we need to retry after session reset
608 - getElement(botId, 'mxchat-chatbot-wrapper').find('.mxchat-input-holder textarea').data('pending-message', message);
331 + $('.mxchat-input-holder textarea').data('pending-message', message);
609 332
610 333 // Get page context if contextual awareness is enabled
611 334 const pageContext = getPageContext();
612 335
613 - // Get instance for session start timestamp (used when persistence is OFF)
614 - var instance = MxChatInstances.get(botId);
336 + // Get bot ID
337 + const botId = getMxChatBotId();
615 338
616 - // Guarantee a non-null session_id before the AJAX leaves. ensureSession() is idempotent
617 - // and returns the guaranteed-present session id from the in-memory instance even when
618 - // cookie/localStorage writes are silently blocked by the browser.
619 - var sessionId = MxChatInstances.ensureSession(botId);
620 - if (!sessionId || sessionId === 'null' || sessionId === 'undefined') {
621 - // Last-resort generation to ensure we never POST a null marker.
622 - sessionId = generateSessionId();
623 - MxChatInstances.setChatSession(botId, sessionId);
624 - }
625 -
626 339 // Prepare AJAX data
627 340 const ajaxData = {
628 341 action: 'mxchat_handle_chat_request',
629 342 message: message,
630 - session_id: sessionId,
343 + session_id: getChatSession(),
631 344 nonce: mxchatChat.nonce,
632 345 current_page_url: window.location.href,
633 346 current_page_title: document.title,
634 - bot_id: botId,
635 - // Pass session start timestamp so AI context matches what user sees
636 - session_start_timestamp: instance.sessionStartTimestamp || 0
347 + bot_id: botId // Include bot ID
637 348 };
638 349
639 350 // Add page context if available
640 351 if (pageContext) {
@@ -657,18 +368,29 @@
657 368 type: 'POST',
658 369 dataType: 'json',
659 370 data: ajaxData,
660 371 success: function(response) {
661 - // IMMEDIATE CHAT MODE UPDATE - This should be FIRST
372 +
373 + // IMMEDIATE CHAT MODE UPDATE - This should be FIRST
374 + if (response.chat_mode) {
375 + //console.log("Updating chat mode to:", response.chat_mode);
376 + updateChatModeIndicator(response.chat_mode);
377 + }
378 +
379 + // Also check in data property if response is wrapped
380 + if (response.data && response.data.chat_mode) {
381 + //console.log("Updating chat mode from data to:", response.data.chat_mode);
382 + updateChatModeIndicator(response.data.chat_mode);
383 + }
384 + // Log the full response for debugging
385 + //console.log("API Response:", response);
386 +
387 + // IMMEDIATE CHAT MODE UPDATE - Handle this first, before any other processing
662 388 if (response.chat_mode) {
663 - updateChatModeIndicator(response.chat_mode, botId);
389 + //console.log("Updating chat mode immediately to:", response.chat_mode);
390 + updateChatModeIndicator(response.chat_mode);
664 391 }
665 392
666 - // Also check in data property if response is wrapped
667 - if (response.data && response.data.chat_mode) {
668 - updateChatModeIndicator(response.data.chat_mode, botId);
669 - }
670 -
671 393 // SECURITY FIX: Check for errors FIRST before checking for success
672 394 // This ensures API errors (quota exceeded, invalid key, rate limit) are properly displayed
673 395 if (response.success === false || (response.data && response.data.error_message)) {
674 396 let errorMessage = "";
@@ -690,29 +412,40 @@
690 412 errorMessage = "An error occurred. Please try again or contact support.";
691 413 }
692 414
693 415 // Handle session reset action (IP changed, session expired, etc.)
694 - // Silent reset — keep chat UI intact, just get a new session and retry
695 416 if (response.data && response.data.action === 'reset_session') {
696 - MxChatInstances.silentResetSession(botId);
697 - // Re-send the original message with the new session (user message is already displayed)
698 - var originalMessage = getElement(botId, 'mxchat-chatbot-wrapper').find('.mxchat-input-holder textarea').data('pending-message');
417 + // Clear the old session and generate a new one
418 + resetChatSession();
419 + // Remove the temporary loading message
420 + $('.bot-message.temporary-message').remove();
421 + // Re-send the original message with the new session
422 + var originalMessage = $('.mxchat-input-holder textarea').data('pending-message');
699 423 if (originalMessage) {
700 - getElement(botId, 'mxchat-chatbot-wrapper').find('.mxchat-input-holder textarea').data('pending-message', null);
701 - var currentModel = mxchatChat.model || 'gpt-5.1-chat-latest';
424 + $('.mxchat-input-holder textarea').data('pending-message', null);
425 + // Re-add the user message and thinking indicator
426 + appendMessage("user", originalMessage);
427 + appendThinkingMessage();
428 + scrollToBottom();
429 + // Determine whether to use streaming
430 + const currentModel = mxchatChat.model || 'gpt-4o';
702 431 if (shouldUseStreaming(currentModel)) {
703 432 callMxChatStream(originalMessage, function(response) {
704 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').removeClass('temporary-message');
705 - }, botId);
433 + $('.bot-message.temporary-message').removeClass('temporary-message');
434 + });
706 435 } else {
707 436 callMxChat(originalMessage, function(response) {
708 - replaceLastMessage("bot", response, '', [], botId);
709 - }, botId);
437 + replaceLastMessage("bot", response);
438 + });
710 439 }
711 440 }
712 441 return;
713 442 }
714 443
444 + // Log the error with code for debugging
445 + //console.log("Response data:", response.data);
446 + //console.error("API Error:", errorMessage, "Code:", errorCode);
447 +
715 448 // Format user-friendly error message
716 449 let displayMessage = errorMessage;
717 450
718 451 // Customize message for admin users
@@ -720,9 +453,9 @@
720 453 // For admin users, show more technical details including error code
721 454 displayMessage = errorMessage + (errorCode ? " (Error code: " + errorCode + ")" : "");
722 455 }
723 456
724 - replaceLastMessage("bot", displayMessage, '', [], botId);
457 + replaceLastMessage("bot", displayMessage);
725 458 return; // Exit early for errors
726 459 }
727 460
728 461 // NOW check if this is a successful response by looking for text, html, or message fields
@@ -738,17 +471,16 @@
738 471 let responseMessage = response.message || '';
739 472
740 473 // Add PDF filename handling
741 474 if (response.data && response.data.filename) {
742 - showActivePdf(response.data.filename, botId);
743 - var instance = MxChatInstances.get(botId);
744 - instance.activePdfFile = response.data.filename;
475 + showActivePdf(response.data.filename);
476 + activePdfFile = response.data.filename;
745 477 }
746 478
747 479 // Add redirect check here
748 480 if (response.redirect_url) {
749 481 if (responseText) {
750 - replaceLastMessage("bot", responseText, '', [], botId);
482 + replaceLastMessage("bot", responseText);
751 483 }
752 484 setTimeout(() => {
753 485 window.location.href = response.redirect_url;
754 486 }, 1500);
@@ -756,11 +488,9 @@
756 488 }
757 489
758 490 // Check for live agent response
759 491 if (response.success && response.data && response.data.status === 'waiting_for_agent') {
760 - removeThinkingDots(botId);
761 - updateChatModeIndicator('agent', botId);
762 - enableChatInput(botId);
492 + updateChatModeIndicator('agent');
763 493 return;
764 494 }
765 495
766 496 // Handle the message and show notification if chat is hidden
@@ -775,36 +505,32 @@
775 505 }
776 506
777 507 // Update the messages as before
778 508 if (responseText && responseHtml) {
779 - replaceLastMessage("bot", responseText, responseHtml, [], botId);
509 + replaceLastMessage("bot", responseText, responseHtml);
780 510 } else if (responseText) {
781 - replaceLastMessage("bot", responseText, '', [], botId);
511 + replaceLastMessage("bot", responseText);
782 512 } else if (responseHtml) {
783 - replaceLastMessage("bot", "", responseHtml, [], botId);
513 + replaceLastMessage("bot", "", responseHtml);
784 514 } else if (responseMessage) {
785 - replaceLastMessage("bot", responseMessage, '', [], botId);
515 + replaceLastMessage("bot", responseMessage);
786 516 }
787 517
788 518 // Check if chat is hidden and show notification
789 - var $floatingChatbot = getElement(botId, 'floating-chatbot');
790 - if ($floatingChatbot.hasClass('hidden')) {
791 - var $badge = getElement(botId, 'chat-notification-badge');
792 - if ($badge.length) {
793 - $badge.show();
519 + if ($('#floating-chatbot').hasClass('hidden')) {
520 + const badge = $('#chat-notification-badge');
521 + if (badge.length) {
522 + badge.show();
794 523 }
795 524 }
796 525 } else {
797 - var emptyMsg = "I received an empty response. Please try again or contact support if this persists.";
798 - if (response.vectorstore_error) {
799 - emptyMsg = "I received an empty response. Debug info: " + response.vectorstore_error;
800 - }
801 - replaceLastMessage("bot", emptyMsg, '', [], botId);
526 + // This should rarely happen now that errors are handled above
527 + ////console.error("Unexpected response format:", response);
528 + replaceLastMessage("bot", "I received an empty response. Please try again or contact support if this persists.");
802 529 }
803 530
804 531 if (response.message_id) {
805 - var instance = MxChatInstances.get(botId);
806 - instance.lastSeenMessageId = response.message_id;
532 + lastSeenMessageId = response.message_id;
807 533 }
808 534
809 535 return;
810 536 }
@@ -809,16 +535,20 @@
809 535 return;
810 536 }
811 537
812 538 // Fallback for truly unexpected response formats
813 - replaceLastMessage("bot", "Unexpected response format. Please try again or contact support.", '', [], botId);
539 + replaceLastMessage("bot", "Unexpected response format. Please try again or contact support.");
814 540 },
815 541 error: function(xhr, status, error) {
542 + //console.error("AJAX Error:", status, error);
543 + //console.log("Response Text:", xhr.responseText);
544 +
816 545 let errorMessage = "An unexpected error occurred.";
817 546
818 547 // Try to parse the response if it's JSON
819 548 try {
820 549 const responseJson = JSON.parse(xhr.responseText);
550 + //console.log("Parsed error response:", responseJson);
821 551
822 552 if (responseJson.data && responseJson.data.error_message) {
823 553 errorMessage = responseJson.data.error_message;
824 554 } else if (responseJson.message) {
@@ -838,52 +568,41 @@
838 568 errorMessage = "Server error: The server encountered an issue. Please try again later.";
839 569 }
840 570 }
841 571
842 - replaceLastMessage("bot", errorMessage, '', [], botId);
572 + replaceLastMessage("bot", errorMessage);
843 573 }
844 574 });
845 575 }
846 576
847 -function callMxChatStream(message, callback, botId) {
848 - botId = botId || getMxChatBotId();
577 +function callMxChatStream(message, callback) {
578 + // Store the message in case we need to retry after session reset
579 + $('.mxchat-input-holder textarea').data('pending-message', message);
849 580
850 - // Store the message in case we need to retry after session reset
851 - getElement(botId, 'mxchat-chatbot-wrapper').find('.mxchat-input-holder textarea').data('pending-message', message);
581 + //console.log("Using streaming for message:", message);
852 582
853 - const currentModel = mxchatChat.model || 'gpt-5.1-chat-latest';
583 + const currentModel = mxchatChat.model || 'gpt-4o';
854 584 if (!isStreamingSupported(currentModel)) {
855 - callMxChat(message, callback, botId);
585 + //console.log("Streaming not supported, falling back to regular call");
586 + callMxChat(message, callback);
856 587 return;
857 588 }
858 589
859 590 // Get page context if contextual awareness is enabled
860 591 const pageContext = getPageContext();
592 +
593 + // Get bot ID
594 + const botId = getMxChatBotId();
861 595
862 - // Get instance for session start timestamp (used when persistence is OFF)
863 - var instance = MxChatInstances.get(botId);
864 -
865 - // Guarantee a non-null session_id before the fetch. FormData.append() stringifies any
866 - // non-string value via String(), so passing `null` would POST the literal string "null"
867 - // and land in the transcripts table as a ghost session. ensureSession() always returns
868 - // a real string even when cookies/localStorage are blocked.
869 - var streamSessionId = MxChatInstances.ensureSession(botId);
870 - if (!streamSessionId || streamSessionId === 'null' || streamSessionId === 'undefined') {
871 - streamSessionId = generateSessionId();
872 - MxChatInstances.setChatSession(botId, streamSessionId);
873 - }
874 -
875 596 const formData = new FormData();
876 597 formData.append('action', 'mxchat_stream_chat');
877 598 formData.append('message', message);
878 - formData.append('session_id', streamSessionId);
599 + formData.append('session_id', getChatSession());
879 600 formData.append('nonce', mxchatChat.nonce);
880 601 formData.append('current_page_url', window.location.href);
881 602 formData.append('current_page_title', document.title);
882 - formData.append('bot_id', botId);
883 - // Pass session start timestamp so AI context matches what user sees
884 - formData.append('session_start_timestamp', instance.sessionStartTimestamp || 0);
885 -
603 + formData.append('bot_id', botId); // Include bot ID
604 +
886 605 // Add page context if available
887 606 if (pageContext) {
888 607 formData.append('page_context', JSON.stringify(pageContext));
889 608 }
@@ -908,14 +627,17 @@
908 627 body: formData,
909 628 credentials: 'same-origin'
910 629 })
911 630 .then(response => {
631 + //console.log("Streaming response received:", response);
632 +
912 633 // Store the response for potential fallback handling
913 634 const responseClone = response.clone();
914 -
635 +
915 636 if (!response.ok) {
916 637 // Try to get error details from response
917 638 return responseClone.json().then(errorData => {
639 + //console.log("Server returned error response:", errorData);
918 640 throw { isServerError: true, data: errorData };
919 641 }).catch(() => {
920 642 throw new Error('Network response was not ok');
921 643 });
@@ -923,21 +645,26 @@
923 645
924 646 // Check if response is JSON instead of streaming
925 647 const contentType = response.headers.get('content-type');
926 648 if (contentType && contentType.includes('application/json')) {
649 + //console.log("Received JSON response instead of stream");
927 650 return responseClone.json().then(data => {
651 + //console.log("Processing JSON response:", data);
652 +
928 653 // IMMEDIATE CHAT MODE UPDATE for JSON response
929 654 if (data.chat_mode) {
930 - updateChatModeIndicator(data.chat_mode, botId);
655 + //console.log("JSON Response: Updating chat mode to:", data.chat_mode);
656 + updateChatModeIndicator(data.chat_mode);
931 657 }
932 -
658 +
933 659 // Check for testing panel
934 660 if (window.mxchatTestPanelInstance && data.testing_data) {
661 + //console.log('Testing data found in streaming JSON response:', data.testing_data);
935 662 window.mxchatTestPanelInstance.handleTestingData(data.testing_data);
936 663 }
937 -
664 +
938 665 // Handle the JSON response directly
939 - handleNonStreamResponse(data, callback, botId);
666 + handleNonStreamResponse(data, callback);
940 667 return Promise.resolve(); // Prevent further processing
941 668 });
942 669 }
943 670
@@ -948,44 +675,37 @@
948 675
949 676 function processStream() {
950 677 reader.read().then(({ done, value }) => {
951 678 if (done) {
679 + //console.log("Streaming completed, final content:", accumulatedContent);
680 +
952 681 // If streaming completed but no content was received, try to get response as fallback
953 682 if (!streamingStarted || !accumulatedContent) {
683 + //console.log("Stream completed with no content, checking for fallback data");
684 +
954 685 // Try to read the response as JSON
955 686 responseClone.text().then(text => {
956 687 try {
957 688 const data = JSON.parse(text);
958 - if (data.text || data.message || data.html) {
959 - handleNonStreamResponse(data, callback, botId);
689 + if (data.text || data.message) {
690 + handleNonStreamResponse(data, callback);
960 691 } else {
961 692 // No valid data, fall back to regular call
962 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').remove();
963 - callMxChat(message, callback, botId);
693 + $('.bot-message.temporary-message').remove();
694 + callMxChat(message, callback);
964 695 }
965 696 } catch (e) {
966 697 // Could not parse, fall back to regular call
967 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').remove();
968 - callMxChat(message, callback, botId);
698 + $('.bot-message.temporary-message').remove();
699 + callMxChat(message, callback);
969 700 }
970 701 }).catch(() => {
971 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').remove();
972 - callMxChat(message, callback, botId);
702 + $('.bot-message.temporary-message').remove();
703 + callMxChat(message, callback);
973 704 });
974 705 return;
975 706 }
976 -
977 - // Re-enable chat input when stream ends with content
978 - enableChatInput(botId);
979 -
980 - // Scroll the user's last message to the top now that the
981 - // bot's full reply has rendered (gives max reading room).
982 - var $chatBoxDone = getElement(botId, 'chat-box');
983 - var $lastUserMsgDone = $chatBoxDone.find('.user-message').last();
984 - if ($lastUserMsgDone.length) {
985 - scrollElementToTop($lastUserMsgDone, botId);
986 - }
987 -
707 +
988 708 if (callback) {
989 709 callback(accumulatedContent);
990 710 }
991 711 return;
@@ -999,25 +719,17 @@
999 719 if (line.startsWith('data: ')) {
1000 720 const data = line.substring(6);
1001 721
1002 722 if (data === '[DONE]') {
723 + //console.log("Received [DONE] signal");
724 +
1003 725 if (!accumulatedContent) {
1004 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').remove();
1005 - callMxChat(message, callback, botId);
726 + //console.log("No content received before [DONE]");
727 + $('.bot-message.temporary-message').remove();
728 + callMxChat(message, callback);
1006 729 return;
1007 730 }
1008 -
1009 - // Re-enable chat input after streaming completes
1010 - enableChatInput(botId);
1011 -
1012 - // Scroll the user's last message to the top now
1013 - // that the bot's full reply has rendered.
1014 - var $chatBoxStreamDone = getElement(botId, 'chat-box');
1015 - var $lastUserMsgStreamDone = $chatBoxStreamDone.find('.user-message').last();
1016 - if ($lastUserMsgStreamDone.length) {
1017 - scrollElementToTop($lastUserMsgStreamDone, botId);
1018 - }
1019 -
731 +
1020 732 if (callback) {
1021 733 callback(accumulatedContent);
1022 734 }
1023 735 return;
@@ -1024,16 +736,18 @@
1024 736 }
1025 737
1026 738 try {
1027 739 const json = JSON.parse(data);
1028 -
740 +
1029 741 // IMMEDIATE CHAT MODE UPDATE FOR STREAMING
1030 742 if (json.chat_mode) {
1031 - updateChatModeIndicator(json.chat_mode, botId);
743 + //console.log("Stream: Updating chat mode immediately to:", json.chat_mode);
744 + updateChatModeIndicator(json.chat_mode);
1032 745 }
1033 -
746 +
1034 747 // Handle testing data
1035 748 if (json.testing_data && !testingDataReceived) {
749 + //console.log('Testing data received in stream:', json.testing_data);
1036 750 if (window.mxchatTestPanelInstance) {
1037 751 window.mxchatTestPanelInstance.handleTestingData(json.testing_data);
1038 752 testingDataReceived = true;
1039 753 }
@@ -1041,27 +755,26 @@
1041 755 // Handle content streaming
1042 756 else if (json.content) {
1043 757 streamingStarted = true;
1044 758 accumulatedContent += json.content;
1045 - updateStreamingMessage(accumulatedContent, botId);
1046 - }
759 + updateStreamingMessage(accumulatedContent);
760 + }
1047 761 // Handle complete response in stream (fallback response)
1048 - else if (json.text || json.message || json.html) {
1049 - handleNonStreamResponse(json, callback, botId);
762 + else if (json.text || json.message) {
763 + //console.log("Received complete response in stream:", json);
764 + handleNonStreamResponse(json, callback);
1050 765 return;
1051 766 }
1052 - // Handle errors
767 + // Handle errors - UPDATED to properly display API errors
1053 768 else if (json.error) {
769 + //console.error("Streaming error:", json.error);
1054 770
1055 771 // Get error message from various possible fields
1056 772 let errorMessage = json.error_message || json.message || json.text ||
1057 773 (typeof json.error === 'string' ? json.error : 'An error occurred. Please try again.');
1058 774
1059 - // Re-enable chat input on error
1060 - enableChatInput(botId);
1061 -
1062 775 // Display the error directly in the chat
1063 - replaceLastMessage("bot", errorMessage, '', [], botId);
776 + replaceLastMessage("bot", errorMessage);
1064 777
1065 778 if (callback) {
1066 779 callback(errorMessage);
1067 780 }
@@ -1067,9 +780,9 @@
1067 780 }
1068 781 return;
1069 782 }
1070 783 } catch (e) {
1071 - // SSE data parsing error - silently continue
784 + //console.error('Error parsing SSE data:', e, 'Data:', data);
1072 785 }
1073 786 }
1074 787 }
1075 788
@@ -1074,10 +787,11 @@
1074 787 }
1075 788
1076 789 processStream();
1077 790 }).catch(streamError => {
1078 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').remove();
1079 - callMxChat(message, callback, botId);
791 + //console.error('Error reading stream:', streamError);
792 + $('.bot-message.temporary-message').remove();
793 + callMxChat(message, callback);
1080 794 });
1081 795 }
1082 796
1083 797 processStream();
@@ -1082,40 +796,48 @@
1082 796
1083 797 processStream();
1084 798 })
1085 799 .catch(error => {
800 + //console.log('Streaming failed:', error);
801 +
1086 802 // Check if we have server error data with chat mode
1087 803 if (error && error.isServerError && error.data) {
804 + //console.log('Using server error response data');
805 +
1088 806 // Check for chat mode in error data
1089 807 if (error.data.chat_mode) {
1090 - updateChatModeIndicator(error.data.chat_mode, botId);
808 + //console.log("Error Response: Updating chat mode to:", error.data.chat_mode);
809 + updateChatModeIndicator(error.data.chat_mode);
1091 810 }
1092 -
1093 - handleNonStreamResponse(error.data, callback, botId);
811 +
812 + handleNonStreamResponse(error.data, callback);
1094 813 } else {
1095 814 // Only fall back to regular call if we don't have any response data
1096 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').remove();
1097 - callMxChat(message, callback, botId);
815 + //console.log('No response data available, falling back to regular call');
816 + $('.bot-message.temporary-message').remove();
817 + callMxChat(message, callback);
1098 818 }
1099 819 });
1100 820 }
1101 821
1102 -// Helper function to handle non-streaming responses
1103 -function handleNonStreamResponse(data, callback, botId) {
1104 - botId = botId || 'default';
822 +// Helper function to handle non-streaming responses (updated to include immediate chat mode handling)
823 +function handleNonStreamResponse(data, callback) {
824 + //console.log("Handling non-stream response:", data);
1105 825
1106 826 // IMMEDIATE CHAT MODE UPDATE FOR NON-STREAMING RESPONSES
1107 827 if (data.chat_mode) {
1108 - updateChatModeIndicator(data.chat_mode, botId);
828 + //console.log("Non-Stream: Updating chat mode immediately to:", data.chat_mode);
829 + updateChatModeIndicator(data.chat_mode);
1109 830 }
1110 831
1111 832 // Also check in data property if response is wrapped
1112 833 if (data.data && data.data.chat_mode) {
1113 - updateChatModeIndicator(data.data.chat_mode, botId);
834 + //console.log("Non-Stream: Updating chat mode from data to:", data.data.chat_mode);
835 + updateChatModeIndicator(data.data.chat_mode);
1114 836 }
1115 837
1116 - // NOTE: Don't remove temporary message here - let replaceLastMessage handle it
1117 - // This prevents a visual gap between thinking dots disappearing and content appearing
838 + // Remove temporary message
839 + $('.bot-message.temporary-message').remove();
1118 840
1119 841 // SECURITY FIX: Check for errors FIRST
1120 842 if (data.success === false || (data.data && data.data.error_message)) {
1121 843 let errorMessage = "";
@@ -1136,20 +858,25 @@
1136 858 errorMessage = "An error occurred. Please try again or contact support.";
1137 859 }
1138 860
1139 861 // Handle session reset action (IP changed, session expired, etc.)
1140 - // Silent reset — keep chat UI intact, just get a new session and retry
1141 862 if (data.data && data.data.action === 'reset_session') {
1142 - MxChatInstances.silentResetSession(botId);
1143 - // Re-send the original message with the new session (user message is already displayed)
1144 - var originalMessage = getElement(botId, 'mxchat-chatbot-wrapper').find('.mxchat-input-holder textarea').data('pending-message');
863 + // Clear the old session and generate a new one
864 + resetChatSession();
865 + // Re-send the original message with the new session
866 + var originalMessage = $('.mxchat-input-holder textarea').data('pending-message');
1145 867 if (originalMessage) {
1146 - getElement(botId, 'mxchat-chatbot-wrapper').find('.mxchat-input-holder textarea').data('pending-message', null);
1147 - var currentModel = mxchatChat.model || 'gpt-5.1-chat-latest';
868 + $('.mxchat-input-holder textarea').data('pending-message', null);
869 + // Re-add the user message and thinking indicator
870 + appendMessage("user", originalMessage);
871 + appendThinkingMessage();
872 + scrollToBottom();
873 + // Determine whether to use streaming
874 + const currentModel = mxchatChat.model || 'gpt-4o';
1148 875 if (shouldUseStreaming(currentModel)) {
1149 - callMxChatStream(originalMessage, callback, botId);
876 + callMxChatStream(originalMessage, callback);
1150 877 } else {
1151 - callMxChat(originalMessage, callback, botId);
878 + callMxChat(originalMessage, callback);
1152 879 }
1153 880 }
1154 881 return;
1155 882 }
@@ -1159,9 +886,9 @@
1159 886 if (mxchatChat.is_admin) {
1160 887 displayMessage = errorMessage + (errorCode ? " (Error code: " + errorCode + ")" : "");
1161 888 }
1162 889
1163 - replaceLastMessage("bot", displayMessage, '', [], botId);
890 + replaceLastMessage("bot", displayMessage);
1164 891
1165 892 if (callback) {
1166 893 callback('');
1167 894 }
@@ -1167,22 +894,8 @@
1167 894 }
1168 895 return; // Exit early for errors
1169 896 }
1170 897
1171 - // Check for live agent response
1172 - if (data.success && data.data && data.data.status === 'waiting_for_agent') {
1173 - removeThinkingDots(botId);
1174 - // Also remove any leftover bot-message that lost its temporary-message class
1175 - var $chatBox = getElement(botId, 'chat-box');
1176 - $chatBox.find('.bot-message .thinking-dots').closest('.bot-message').remove();
1177 - updateChatModeIndicator('agent', botId);
1178 - enableChatInput(botId);
1179 - if (callback) {
1180 - callback('');
1181 - }
1182 - return;
1183 - }
1184 -
1185 898 // Handle different response formats
1186 899 if (data.text || data.html || data.message) {
1187 900
1188 901 // Apply response hooks
@@ -1194,23 +907,22 @@
1194 907 }
1195 908
1196 909 // Display the response
1197 910 if (data.text && data.html) {
1198 - replaceLastMessage("bot", data.text, data.html, [], botId);
911 + replaceLastMessage("bot", data.text, data.html);
1199 912 } else if (data.text) {
1200 - replaceLastMessage("bot", data.text, '', [], botId);
913 + replaceLastMessage("bot", data.text);
1201 914 } else if (data.html) {
1202 - replaceLastMessage("bot", "", data.html, [], botId);
915 + replaceLastMessage("bot", "", data.html);
1203 916 } else if (data.message) {
1204 - replaceLastMessage("bot", data.message, '', [], botId);
917 + replaceLastMessage("bot", data.message);
1205 918 }
1206 919 }
1207 920
1208 921 // Handle other response properties
1209 922 if (data.data && data.data.filename) {
1210 - showActivePdf(data.data.filename, botId);
1211 - var instance = MxChatInstances.get(botId);
1212 - instance.activePdfFile = data.data.filename;
923 + showActivePdf(data.data.filename);
924 + activePdfFile = data.data.filename;
1213 925 }
1214 926
1215 927 if (data.redirect_url) {
1216 928 setTimeout(() => {
@@ -1217,33 +929,31 @@
1217 929 window.location.href = data.redirect_url;
1218 930 }, 1500);
1219 931 }
1220 932
1221 - // Ensure chat input is re-enabled (safety net for edge cases)
1222 - enableChatInput(botId);
1223 -
1224 933 if (callback) {
1225 934 callback(data.text || data.message || '');
1226 935 }
1227 936 }
1228 -
1229 937 // Enhanced updateChatModeIndicator function for immediate DOM updates
1230 -function updateChatModeIndicator(mode, botId) {
1231 - botId = botId || 'default';
1232 - const indicator = getElementDOM(botId, 'chat-mode-indicator');
938 +function updateChatModeIndicator(mode) {
939 + //console.log("updateChatModeIndicator called with mode:", mode);
940 + const indicator = document.getElementById('chat-mode-indicator');
1233 941 if (indicator) {
1234 942 const oldText = indicator.textContent;
1235 -
943 +
1236 944 if (mode === 'agent') {
1237 945 indicator.textContent = 'Live Agent';
1238 - startPolling(botId);
946 + startPolling();
947 + //console.log("Set indicator to Live Agent");
1239 948 } else {
1240 949 // Everything else is AI mode
1241 950 const customAiText = indicator.getAttribute('data-ai-text') || 'AI Agent';
1242 951 indicator.textContent = customAiText;
1243 - stopPolling(botId);
952 + stopPolling();
953 + //console.log("Set indicator to AI Agent:", customAiText);
1244 954 }
1245 -
955 +
1246 956 // Force immediate DOM update and reflow
1247 957 if (oldText !== indicator.textContent) {
1248 958 // Force a reflow to ensure the change is visible immediately
1249 959 indicator.style.display = 'none';
@@ -1248,36 +958,88 @@
1248 958 // Force a reflow to ensure the change is visible immediately
1249 959 indicator.style.display = 'none';
1250 960 indicator.offsetHeight; // Trigger reflow
1251 961 indicator.style.display = '';
1252 -
962 +
1253 963 // Double-check after a brief moment to ensure the change stuck
1254 964 setTimeout(() => {
965 + //console.log("Final indicator text:", indicator.textContent);
1255 966 if (mode === 'agent' && indicator.textContent !== 'Live Agent') {
967 + //console.warn("Mode indicator update failed, forcing update");
1256 968 indicator.textContent = 'Live Agent';
1257 969 } else if (mode !== 'agent' && indicator.textContent === 'Live Agent') {
970 + //console.warn("Mode indicator stuck on Live Agent, forcing AI update");
1258 971 const customAiText = indicator.getAttribute('data-ai-text') || 'AI Agent';
1259 972 indicator.textContent = customAiText;
1260 973 }
1261 974 }, 50);
1262 975 }
976 + } else {
977 + //console.error("Chat mode indicator element not found!");
1263 978 }
1264 979 }
1265 980
981 +// Helper function to handle non-streaming responses (updated to include chat mode handling)
982 +function handleNonStreamResponse(data, callback) {
983 + //console.log("Handling non-stream response:", data);
984 +
985 + // Remove temporary message
986 + $('.bot-message.temporary-message').remove();
987 +
988 + // Handle different response formats
989 + if (data.text || data.html || data.message) {
990 +
991 + // Apply response hooks
992 + if (data.text && typeof customMxChatFilter === 'function') {
993 + data.text = customMxChatFilter(data.text, "response");
994 + }
995 + if (data.message && typeof customMxChatFilter === 'function') {
996 + data.message = customMxChatFilter(data.message, "response");
997 + }
998 +
999 + // Handle chat mode updates for streaming responses too
1000 + handleChatModeUpdates(data, data.text || data.message);
1001 +
1002 + // Display the response
1003 + if (data.text && data.html) {
1004 + replaceLastMessage("bot", data.text, data.html);
1005 + } else if (data.text) {
1006 + replaceLastMessage("bot", data.text);
1007 + } else if (data.html) {
1008 + replaceLastMessage("bot", "", data.html);
1009 + } else if (data.message) {
1010 + replaceLastMessage("bot", data.message);
1011 + }
1012 + }
1013 +
1014 + // Handle other response properties
1015 + if (data.data && data.data.filename) {
1016 + showActivePdf(data.data.filename);
1017 + activePdfFile = data.data.filename;
1018 + }
1019 +
1020 + if (data.redirect_url) {
1021 + setTimeout(() => {
1022 + window.location.href = data.redirect_url;
1023 + }, 1500);
1024 + }
1025 +
1026 + if (callback) {
1027 + callback(data.text || data.message || '');
1028 + }
1029 +}
1030 +
1266 1031 // Function to update message during streaming
1267 -function updateStreamingMessage(content, botId) {
1268 - botId = botId || 'default';
1269 -
1032 +function updateStreamingMessage(content) {
1270 1033 // ADD RESPONSE HOOK FOR REAL-TIME STREAMING
1271 1034 if (typeof customMxChatFilter === 'function') {
1272 1035 content = customMxChatFilter(content, "response");
1273 1036 }
1274 -
1037 +
1275 1038 const formattedContent = linkify(content);
1276 1039
1277 - // Find the temporary message in this bot's chat box
1278 - var $chatBox = getElement(botId, 'chat-box');
1279 - const tempMessage = $chatBox.find('.bot-message.temporary-message').last();
1040 + // Find the temporary message
1041 + const tempMessage = $('.bot-message.temporary-message').last();
1280 1042
1281 1043 if (tempMessage.length) {
1282 1044 // Update existing message
1283 1045 tempMessage.html(formattedContent);
@@ -1282,9 +1044,9 @@
1282 1044 // Update existing message
1283 1045 tempMessage.html(formattedContent);
1284 1046 } else {
1285 1047 // Create new temporary message if it doesn't exist
1286 - appendMessage("bot", content, '', [], true, botId);
1048 + appendMessage("bot", content, '', [], true);
1287 1049 }
1288 1050 }
1289 1051
1290 1052 function isStreamingSupported(model) {
@@ -1302,34 +1064,23 @@
1302 1064
1303 1065 return isSupported;
1304 1066 }
1305 1067
1306 -// Update the event handlers to use the correct function names (using event delegation)
1307 -// Use class-based selectors for multi-instance support
1308 -$(document).on('click', '.send-button', function() {
1309 - var botId = getBotIdFromElement(this);
1310 - var modeIndicator = getElementDOM(botId, 'chat-mode-indicator');
1311 - if (!(modeIndicator && modeIndicator.textContent === 'Live Agent')) {
1312 - disableChatInput(botId);
1313 - }
1314 - sendMessage(botId);
1068 +// Update the event handlers to use the correct function names
1069 +$('#send-button').off('click').on('click', function() {
1070 + sendMessage(); // Use the updated sendMessage function
1315 1071 });
1316 1072
1317 -// Override enter key handler (using event delegation)
1318 -$(document).on('keypress', '.chat-input', function(e) {
1073 +// Override enter key handler
1074 +$('#chat-input').off('keypress').on('keypress', function(e) {
1319 1075 if (e.which == 13 && !e.shiftKey) {
1320 1076 e.preventDefault();
1321 - var botId = getBotIdFromElement(this);
1322 - var modeIndicator = getElementDOM(botId, 'chat-mode-indicator');
1323 - if (!(modeIndicator && modeIndicator.textContent === 'Live Agent')) {
1324 - disableChatInput(botId);
1325 - }
1326 - sendMessage(botId);
1077 + sendMessage(); // Use the updated sendMessage function
1327 1078 }
1328 1079 });
1329 1080
1330 1081
1331 -function appendMessage(sender, messageText = '', messageHtml = '', images = [], isTemporary = false, botId = 'default') {
1082 +function appendMessage(sender, messageText = '', messageHtml = '', images = [], isTemporary = false) {
1332 1083 try {
1333 1084 // Determine styles based on sender type
1334 1085 let messageClass, bgColor, fontColor;
1335 1086
@@ -1350,29 +1101,25 @@
1350 1101 }
1351 1102
1352 1103 const messageDiv = $('<div>')
1353 1104 .addClass(messageClass)
1354 - .attr('dir', 'auto');
1355 -
1356 - // Only apply inline colors if AI theme is not active (let CSS handle it)
1357 - var skipColors = shouldSkipInlineColors(botId);
1358 - if (skipColors) {
1359 - messageDiv.css({
1360 - 'margin-bottom': '1em'
1361 - });
1362 - } else {
1363 - messageDiv.css({
1105 + .attr('dir', 'auto')
1106 + .css({
1364 1107 'background': bgColor,
1365 1108 'color': fontColor,
1366 1109 'margin-bottom': '1em'
1367 1110 });
1111 +
1112 + // Process the message content based on sender
1113 + let fullMessage;
1114 + if (sender === "user") {
1115 + // For user messages, apply linkify after sanitization
1116 + fullMessage = linkify(messageText);
1117 + } else {
1118 + // For bot/agent messages, preserve HTML
1119 + fullMessage = messageText;
1368 1120 }
1369 1121
1370 - // Process the message content - always run linkify to convert markdown
1371 - // links and format text. linkify() handles existing HTML safely via
1372 - // negative lookaheads that skip URLs already inside <a> tags.
1373 - let fullMessage = linkify(messageText);
1374 -
1375 1122 // Add images if provided
1376 1123 if (images && images.length > 0) {
1377 1124 fullMessage += '<div class="image-gallery" dir="auto">';
1378 1125 images.forEach(img => {
@@ -1378,9 +1125,9 @@
1378 1125 images.forEach(img => {
1379 1126 const safeTitle = sanitizeUserInput(img.title);
1380 1127 const safeUrl = encodeURI(img.image_url);
1381 1128 const safeThumbnail = encodeURI(img.thumbnail_url);
1382 -
1129 +
1383 1130 fullMessage += `
1384 1131 <div style="margin-bottom: 10px;">
1385 1132 <strong>${safeTitle}</strong><br>
1386 1133 <a href="${safeUrl}" target="_blank">
@@ -1392,14 +1139,9 @@
1392 1139 }
1393 1140
1394 1141 // Append HTML content if provided
1395 1142 if (messageHtml && sender !== "user") {
1396 - // Only add line breaks if there's actual text content before the HTML
1397 - if (fullMessage && fullMessage.trim()) {
1398 - fullMessage += '<br><br>' + messageHtml;
1399 - } else {
1400 - fullMessage = messageHtml;
1401 - }
1143 + fullMessage += '<br><br>' + messageHtml;
1402 1144 }
1403 1145
1404 1146 messageDiv.html(fullMessage);
1405 1147
@@ -1406,62 +1148,58 @@
1406 1148 if (isTemporary) {
1407 1149 messageDiv.addClass('temporary-message');
1408 1150 }
1409 1151
1410 - // Append to the correct chatbot instance's chat-box
1411 - var $chatBox = getElement(botId, 'chat-box');
1412 - messageDiv.hide().appendTo($chatBox).fadeIn(300, function() {
1152 + messageDiv.hide().appendTo('#chat-box').fadeIn(300, function() {
1413 1153 // FIXED: Use event delegation for link tracking
1414 1154 if (sender === "bot" || sender === "agent") {
1415 - attachLinkTracking(messageDiv, messageText, botId);
1155 + attachLinkTracking(messageDiv, messageText);
1416 1156 }
1417 -
1157 +
1418 1158 if (sender === "bot") {
1419 - const lastUserMessage = $chatBox.find('.user-message').last();
1159 + const lastUserMessage = $('#chat-box').find('.user-message').last();
1420 1160 if (lastUserMessage.length) {
1421 - scrollElementToTop(lastUserMessage, botId);
1161 + scrollElementToTop(lastUserMessage);
1422 1162 }
1423 1163 }
1424 1164 });
1425 1165
1426 1166 if (messageText.id) {
1427 - var instance = MxChatInstances.get(botId);
1428 - instance.lastSeenMessageId = messageText.id;
1429 - hideNotification(botId);
1167 + lastSeenMessageId = messageText.id;
1168 + hideNotification();
1430 1169 }
1431 1170 } catch (error) {
1432 - // Error rendering message - silently continue
1171 + //console.error("Error rendering message:", error);
1433 1172 }
1434 1173 }
1435 1174
1436 1175 // Helper function to attach link tracking with proper event handling
1437 -function attachLinkTracking(messageDiv, messageText, botId) {
1438 - botId = botId || 'default';
1176 +function attachLinkTracking(messageDiv, messageText) {
1439 1177 // Use a slight delay to ensure DOM is ready
1440 1178 setTimeout(function() {
1441 1179 const links = messageDiv.find('a[href]').not('[data-tracked]');
1442 -
1180 +
1443 1181 links.each(function() {
1444 1182 const $link = $(this);
1445 1183 const originalHref = $link.attr('href');
1446 -
1184 +
1447 1185 // Mark as tracked to avoid duplicate handlers
1448 1186 $link.attr('data-tracked', 'true');
1449 -
1187 +
1450 1188 // Only track external URLs
1451 1189 if (originalHref && (originalHref.startsWith('http://') || originalHref.startsWith('https://'))) {
1452 1190 // Remove any existing click handlers first
1453 1191 $link.off('click.tracking');
1454 -
1192 +
1455 1193 // Add new click handler with namespace
1456 1194 $link.on('click.tracking', function(e) {
1457 1195 e.preventDefault();
1458 1196 e.stopPropagation();
1459 -
1460 - const messageContext = typeof messageText === 'string'
1461 - ? messageText.substring(0, 200)
1197 +
1198 + const messageContext = typeof messageText === 'string'
1199 + ? messageText.substring(0, 200)
1462 1200 : '';
1463 -
1201 +
1464 1202 // Track the click
1465 1203 $.ajax({
1466 1204 url: mxchatChat.ajax_url,
1467 1205 type: 'POST',
@@ -1466,9 +1204,9 @@
1466 1204 url: mxchatChat.ajax_url,
1467 1205 type: 'POST',
1468 1206 data: {
1469 1207 action: 'mxchat_track_url_click',
1470 - session_id: getChatSession(botId),
1208 + session_id: getChatSession(),
1471 1209 url: originalHref,
1472 1210 message_context: messageContext,
1473 1211 nonce: mxchatChat.nonce
1474 1212 },
@@ -1480,9 +1218,9 @@
1480 1218 window.location.href = originalHref;
1481 1219 }
1482 1220 }
1483 1221 });
1484 -
1222 +
1485 1223 return false; // Extra insurance to prevent default
1486 1224 });
1487 1225 }
1488 1226 });
@@ -1488,12 +1226,11 @@
1488 1226 });
1489 1227 }, 100); // Small delay to ensure DOM is ready
1490 1228 }
1491 1229
1492 -function replaceLastMessage(sender, responseText, responseHtml = '', images = [], botId = 'default') {
1230 +function replaceLastMessage(sender, responseText, responseHtml = '', images = []) {
1493 1231 var messageClass = sender === "user" ? "user-message" : sender === "agent" ? "agent-message" : "bot-message";
1494 - var $chatBox = getElement(botId, 'chat-box');
1495 - var lastMessageDiv = $chatBox.find('.bot-message.temporary-message, .agent-message.temporary-message').last();
1232 + var lastMessageDiv = $('#chat-box').find('.bot-message.temporary-message, .agent-message.temporary-message').last();
1496 1233
1497 1234 // Determine styles
1498 1235 let bgColor, fontColor;
1499 1236 if (sender === "user") {
@@ -1506,13 +1243,27 @@
1506 1243 bgColor = botMessageBgColor;
1507 1244 fontColor = botMessageFontColor;
1508 1245 }
1509 1246
1510 - // Always run linkify to convert markdown links and format text.
1511 - // linkify() already handles existing HTML (its URL patterns use negative lookaheads
1512 - // to avoid double-processing URLs that are already inside <a> tags).
1513 - var fullMessage = linkify(responseText);
1514 -
1247 + // FIXED: Only linkify if response doesn't already contain HTML links or tags
1248 + // This prevents double-processing of URLs that are already formatted as HTML
1249 + var fullMessage;
1250 + if (sender === "user") {
1251 + // Always linkify user messages (they're plain text)
1252 + fullMessage = linkify(responseText);
1253 + } else {
1254 + // For bot/agent messages, check if HTML already exists
1255 + if (responseText.includes('<a href=') || responseText.includes('</a>') ||
1256 + responseText.includes('<img') || responseText.includes('<div') ||
1257 + responseText.includes('<p>') || responseText.includes('<br>')) {
1258 + // Response already has HTML, don't process it
1259 + fullMessage = responseText;
1260 + } else {
1261 + // Plain text response, apply linkify
1262 + fullMessage = linkify(responseText);
1263 + }
1264 + }
1265 +
1515 1266 if (responseHtml) {
1516 1267 // Only add line breaks if there's actual text content before the HTML
1517 1268 if (fullMessage && fullMessage.trim()) {
1518 1269 fullMessage += '<br><br>' + responseHtml;
@@ -1535,92 +1286,67 @@
1535 1286 fullMessage += '</div>';
1536 1287 }
1537 1288
1538 1289 if (lastMessageDiv.length) {
1539 - // Replace content immediately to prevent visual gap between thinking dots and response
1540 - lastMessageDiv
1541 - .html(fullMessage)
1542 - .removeClass('bot-message user-message temporary-message')
1543 - .addClass(messageClass)
1544 - .attr('dir', 'auto');
1545 -
1546 - // Only apply inline colors if AI theme is not active (let CSS handle it)
1547 - var skipColors = mxchatChat.skip_inline_colors || shouldSkipInlineColors(botId);
1548 - if (!skipColors) {
1549 - lastMessageDiv.css({
1550 - 'background-color': bgColor,
1551 - 'color': fontColor,
1552 - });
1553 - }
1554 -
1555 - // Handle link tracking and scroll
1556 - if (sender === "bot" || sender === "agent") {
1557 - attachLinkTracking(lastMessageDiv, responseText, botId);
1558 -
1559 - const lastUserMessage = $chatBox.find('.user-message').last();
1560 - if (lastUserMessage.length) {
1561 - scrollElementToTop(lastUserMessage, botId);
1562 - }
1563 - // Show notification if chat is hidden
1564 - var $floatingChatbot = getElement(botId, 'floating-chatbot');
1565 - if ($floatingChatbot.hasClass('hidden')) {
1566 - showNotification(botId);
1567 - }
1568 - }
1569 -
1570 - // Re-enable chat input after response is displayed
1571 - enableChatInput(botId);
1290 + lastMessageDiv.fadeOut(200, function() {
1291 + $(this)
1292 + .html(fullMessage)
1293 + .removeClass('bot-message user-message')
1294 + .addClass(messageClass)
1295 + .attr('dir', 'auto')
1296 + .css({
1297 + 'background-color': bgColor,
1298 + 'color': fontColor,
1299 + })
1300 + .removeClass('temporary-message')
1301 + .fadeIn(200, function() {
1302 + // FIXED: Use the helper function for link tracking
1303 + if (sender === "bot" || sender === "agent") {
1304 + attachLinkTracking($(this), responseText);
1305 + }
1306 +
1307 + if (sender === "bot" || sender === "agent") {
1308 + const lastUserMessage = $('#chat-box').find('.user-message').last();
1309 + if (lastUserMessage.length) {
1310 + scrollElementToTop(lastUserMessage);
1311 + }
1312 + // Show notification if chat is hidden
1313 + if ($('#floating-chatbot').hasClass('hidden')) {
1314 + showNotification();
1315 + }
1316 + }
1317 + });
1318 + });
1572 1319 } else {
1573 - appendMessage(sender, responseText, responseHtml, images, false, botId);
1574 - // Re-enable chat input after response is displayed
1575 - enableChatInput(botId);
1320 + appendMessage(sender, responseText, responseHtml, images);
1576 1321 }
1577 1322 }
1578 1323
1579 1324
1580 - function appendThinkingMessage(botId) {
1581 - botId = botId || 'default';
1325 + function appendThinkingMessage() {
1326 + // Remove any existing thinking dots first
1327 + $('.thinking-dots').remove();
1582 1328
1583 - // Don't show thinking dots in live agent mode - message is just forwarded to a human
1584 - var indicator = getElementDOM(botId, 'chat-mode-indicator');
1585 - if (indicator && indicator.textContent === 'Live Agent') {
1586 - return;
1587 - }
1588 -
1589 - var $chatBox = getElement(botId, 'chat-box');
1590 -
1591 - // Remove any existing thinking dots in this bot's chat first
1592 - $chatBox.find('.thinking-dots').remove();
1593 -
1594 - // Check if we should skip inline colors (AI theme is active)
1595 - var skipColors = shouldSkipInlineColors(botId);
1596 -
1597 1329 // Retrieve the bot message font color and background color
1598 1330 var botMessageFontColor = mxchatChat.bot_message_font_color;
1599 1331 var botMessageBgColor = mxchatChat.bot_message_bg_color;
1600 1332
1601 - // Build thinking dots HTML - skip inline colors if AI theme is active
1602 - var dotStyle = skipColors ? '' : ' style="background-color: ' + botMessageFontColor + ';"';
1333 +
1603 1334 var thinkingHtml = '<div class="thinking-dots-container">' +
1604 1335 '<div class="thinking-dots">' +
1605 - '<span class="dot"' + dotStyle + '></span>' +
1606 - '<span class="dot"' + dotStyle + '></span>' +
1607 - '<span class="dot"' + dotStyle + '></span>' +
1336 + '<span class="dot" style="background-color: ' + botMessageFontColor + ';"></span>' +
1337 + '<span class="dot" style="background-color: ' + botMessageFontColor + ';"></span>' +
1338 + '<span class="dot" style="background-color: ' + botMessageFontColor + ';"></span>' +
1608 1339 '</div>' +
1609 1340 '</div>';
1610 1341
1611 - // Append the thinking dots to this bot's chat container - skip inline colors if AI theme is active
1612 - var messageStyle = skipColors ? '' : ' style="background-color: ' + botMessageBgColor + '; color: ' + botMessageFontColor + ';"';
1613 - $chatBox.append('<div class="bot-message temporary-message"' + messageStyle + '>' + thinkingHtml + '</div>');
1614 - scrollToBottom(botId);
1342 + // Append the thinking dots to the chat container (or within the temporary message div)
1343 + $("#chat-box").append('<div class="bot-message temporary-message" style="background-color: ' + botMessageBgColor + ';">' + thinkingHtml + '</div>');
1344 + scrollToBottom();
1615 1345 }
1616 -
1617 - function removeThinkingDots(botId) {
1618 - botId = botId || 'default';
1619 - var $chatBox = getElement(botId, 'chat-box');
1620 - // Remove by temporary-message class first, then fall back to any bot-message containing thinking dots
1621 - $chatBox.find('.thinking-dots').closest('.temporary-message').remove();
1622 - $chatBox.find('.bot-message .thinking-dots').closest('.bot-message').remove();
1346 +
1347 + function removeThinkingDots() {
1348 + $('.thinking-dots').closest('.temporary-message').remove();
1623 1349 }
1624 1350
1625 1351 // ====================================
1626 1352 // TEXT FORMATTING & PROCESSING
@@ -1654,12 +1380,9 @@
1654 1380 processedText = formatTextStyling(processedText);
1655 1381
1656 1382 // Process code blocks BEFORE processing links
1657 1383 processedText = formatCodeBlocks(processedText);
1658 -
1659 - // Process markdown tables BEFORE converting newlines to paragraphs
1660 - processedText = formatMarkdownTables(processedText);
1661 -
1384 +
1662 1385 // NOW convert to paragraphs
1663 1386 processedText = convertNewlinesToBreaks(processedText);
1664 1387
1665 1388 // IMPORTANT: Handle citation-style brackets FIRST [URL]
@@ -1672,63 +1395,37 @@
1672 1395 // Return as a proper link without the brackets
1673 1396 return `<a href="${safeUrl}" target="${linkTarget}">${cleanUrl}</a>`;
1674 1397 });
1675 1398
1676 - // Process markdown links: [text](url) and [](url)
1677 - // Uses balanced parenthesis matching to handle URLs containing parens
1678 - // (e.g. PDF filenames with dates like (2025-08-28).pdf)
1679 - processedText = (function(input) {
1680 - var result = '';
1681 - var i = 0;
1682 - while (i < input.length) {
1683 - // Look for [ at current position
1684 - if (input[i] === '[') {
1685 - // Find closing ]
1686 - var closeBracket = input.indexOf(']', i + 1);
1687 - if (closeBracket === -1 || closeBracket + 1 >= input.length || input[closeBracket + 1] !== '(') {
1688 - result += input[i];
1689 - i++;
1690 - continue;
1691 - }
1692 - var linkText = input.substring(i + 1, closeBracket);
1693 - // Check if URL starts with http
1694 - var urlStart = closeBracket + 2;
1695 - if (!input.substring(urlStart).match(/^https?:\/\//)) {
1696 - result += input[i];
1697 - i++;
1698 - continue;
1699 - }
1700 - // Find balanced closing paren
1701 - var depth = 1;
1702 - var j = urlStart;
1703 - while (j < input.length && depth > 0) {
1704 - if (input[j] === '(') depth++;
1705 - else if (input[j] === ')') depth--;
1706 - if (depth > 0) j++;
1707 - }
1708 - if (depth !== 0) {
1709 - result += input[i];
1710 - i++;
1711 - continue;
1712 - }
1713 - var url = input.substring(urlStart, j);
1714 - var cleanUrl = url.replace(/[\].,;!?]+$/, '');
1715 - var encodedUrl = safeEncodeUrl(cleanUrl);
1716 - if (!linkText || !linkText.trim()) {
1717 - result += '<a href="' + encodedUrl + '" target="' + linkTarget + '">' + cleanUrl + '</a>';
1718 - } else {
1719 - var safeText = sanitizeUserInput(linkText);
1720 - result += '<a href="' + encodedUrl + '" target="' + linkTarget + '">' + safeText + '</a>';
1721 - }
1722 - i = j + 1; // Skip past the closing )
1723 - } else {
1724 - result += input[i];
1725 - i++;
1726 - }
1399 + // Process proper markdown links with text: [text](url)
1400 + // This MUST have non-empty text in the first brackets
1401 + const markdownLinkPattern = /\[([^\]]+)\]\((https?:\/\/[^\s)]+)\)/g;
1402 + processedText = processedText.replace(markdownLinkPattern, (match, text, url) => {
1403 + // Make sure we have actual text (not just whitespace)
1404 + if (!text || !text.trim()) {
1405 + // If no text, treat the URL as the text
1406 + let cleanUrl = url.replace(/[.,;!?]+$/, '');
1407 + const safeUrl = safeEncodeUrl(cleanUrl);
1408 + return `<a href="${safeUrl}" target="${linkTarget}">${cleanUrl}</a>`;
1727 1409 }
1728 - return result;
1729 - })(processedText);
1410 +
1411 + // Clean the URL
1412 + let cleanUrl = url.replace(/[\].,;!?]+$/, '');
1413 + const safeUrl = safeEncodeUrl(cleanUrl);
1414 + const safeText = sanitizeUserInput(text);
1415 + return `<a href="${safeUrl}" target="${linkTarget}">${safeText}</a>`;
1416 + });
1730 1417
1418 + // Handle empty markdown links: [](url)
1419 + // This is a specific case where there's no text
1420 + const emptyMarkdownPattern = /\[\]\((https?:\/\/[^\s)]+)\)/g;
1421 + processedText = processedText.replace(emptyMarkdownPattern, (match, url) => {
1422 + let cleanUrl = url.replace(/[.,;!?]+$/, '');
1423 + const safeUrl = safeEncodeUrl(cleanUrl);
1424 + // Use the URL itself as the link text
1425 + return `<a href="${safeUrl}" target="${linkTarget}">${cleanUrl}</a>`;
1426 + });
1427 +
1731 1428 // Process phone numbers: [text](tel:number)
1732 1429 const phonePattern = /\[([^\]]+)\]\((tel:[\d+\-\s()]+)\)/g;
1733 1430 processedText = processedText.replace(phonePattern, (match, text, phone) => {
1734 1431 const safePhone = safeEncodeUrl(phone);
@@ -1880,78 +1577,9 @@
1880 1577 });
1881 1578
1882 1579 return text;
1883 1580 }
1884 -
1885 - function formatMarkdownTables(text) {
1886 - var lines = text.split('\n');
1887 - var result = [];
1888 - var i = 0;
1889 -
1890 - while (i < lines.length) {
1891 - // Check for a table: current line has pipes AND next line is a separator row
1892 - if (i + 1 < lines.length &&
1893 - lines[i].indexOf('|') !== -1 &&
1894 - /^\s*\|?[\s\-:]+(\|[\s\-:]+)+\|?\s*$/.test(lines[i + 1])) {
1895 -
1896 - var tableLines = [];
1897 - var headerLine = lines[i];
1898 - var separatorLine = lines[i + 1];
1899 - tableLines.push(headerLine);
1900 - tableLines.push(separatorLine);
1901 -
1902 - // Collect remaining table rows
1903 - var j = i + 2;
1904 - while (j < lines.length && lines[j].indexOf('|') !== -1 && lines[j].trim() !== '') {
1905 - tableLines.push(lines[j]);
1906 - j++;
1907 - }
1908 -
1909 - // Parse alignment from separator row
1910 - var sepCells = separatorLine.split('|').filter(function(c) { return c.trim() !== ''; });
1911 - var alignments = sepCells.map(function(cell) {
1912 - var trimmed = cell.trim();
1913 - if (trimmed.charAt(0) === ':' && trimmed.charAt(trimmed.length - 1) === ':') return 'center';
1914 - if (trimmed.charAt(trimmed.length - 1) === ':') return 'right';
1915 - return 'left';
1916 - });
1917 -
1918 - // Build HTML table
1919 - var html = '<div class="mxchat-table-wrapper"><table class="mxchat-table">';
1920 -
1921 - // Header row
1922 - var headerCells = tableLines[0].split('|').filter(function(c) { return c.trim() !== ''; });
1923 - html += '<thead><tr>';
1924 - headerCells.forEach(function(cell, idx) {
1925 - var align = alignments[idx] || 'left';
1926 - html += '<th style="text-align:' + align + '">' + cell.trim() + '</th>';
1927 - });
1928 - html += '</tr></thead>';
1929 -
1930 - // Body rows
1931 - html += '<tbody>';
1932 - for (var r = 2; r < tableLines.length; r++) {
1933 - var rowCells = tableLines[r].split('|').filter(function(c) { return c.trim() !== ''; });
1934 - html += '<tr>';
1935 - rowCells.forEach(function(cell, idx) {
1936 - var align = alignments[idx] || 'left';
1937 - html += '<td style="text-align:' + align + '">' + cell.trim() + '</td>';
1938 - });
1939 - html += '</tr>';
1940 - }
1941 - html += '</tbody></table></div>';
1942 -
1943 - result.push(html);
1944 - i = j;
1945 - } else {
1946 - result.push(lines[i]);
1947 - i++;
1948 - }
1949 - }
1950 -
1951 - return result.join('\n');
1952 - }
1953 -
1581 +
1954 1582 function sanitizeUserInput(text) {
1955 1583 const div = document.createElement('div');
1956 1584 div.textContent = text;
1957 1585 return div.innerHTML;
@@ -1981,21 +1609,10 @@
1981 1609 // ====================================
1982 1610 // UI & SCROLLING CONTROLS
1983 1611 // ====================================
1984 1612
1985 - function scrollToBottom(botIdOrInstant, instant) {
1986 - // Handle backward compatibility: scrollToBottom() or scrollToBottom(true/false)
1987 - var botId = 'default';
1988 - if (typeof botIdOrInstant === 'string') {
1989 - botId = botIdOrInstant;
1990 - instant = instant || false;
1991 - } else if (typeof botIdOrInstant === 'boolean') {
1992 - instant = botIdOrInstant;
1993 - } else {
1994 - instant = false;
1995 - }
1996 -
1997 - var chatBox = getElement(botId, 'chat-box');
1613 + function scrollToBottom(instant = false) {
1614 + var chatBox = $('#chat-box');
1998 1615 if (instant) {
1999 1616 // Instantly set the scroll position to the bottom
2000 1617 chatBox.scrollTop(chatBox.prop("scrollHeight"));
2001 1618 } else {
@@ -2004,15 +1621,15 @@
2004 1621 const scrollHeight = chatBox.prop("scrollHeight");
2005 1622 const initialScroll = chatBox.scrollTop();
2006 1623 const distance = scrollHeight - initialScroll;
2007 1624 const duration = 500; // Duration in ms
2008 -
1625 +
2009 1626 function smoothScroll(timestamp) {
2010 1627 if (!start) start = timestamp;
2011 1628 const progress = timestamp - start;
2012 1629 const currentScroll = initialScroll + (distance * (progress / duration));
2013 1630 chatBox.scrollTop(currentScroll);
2014 -
1631 +
2015 1632 if (progress < duration) {
2016 1633 requestAnimationFrame(smoothScroll);
2017 1634 } else {
2018 1635 chatBox.scrollTop(scrollHeight); // Ensure it's exactly at the bottom
@@ -2017,37 +1634,33 @@
2017 1634 } else {
2018 1635 chatBox.scrollTop(scrollHeight); // Ensure it's exactly at the bottom
2019 1636 }
2020 1637 }
2021 -
1638 +
2022 1639 requestAnimationFrame(smoothScroll);
2023 1640 }
2024 1641 }
2025 -
2026 - function scrollElementToTop(element, botId, topOffset) {
2027 - botId = botId || 'default';
2028 - topOffset = (typeof topOffset === 'number') ? topOffset : 2;
2029 - var chatBox = getElement(botId, 'chat-box');
1642 +
1643 + function scrollElementToTop(element) {
1644 + var chatBox = $('#chat-box');
2030 1645 var elementTop = element.position().top + chatBox.scrollTop();
2031 - chatBox.animate({ scrollTop: Math.max(0, elementTop - topOffset) }, 500);
1646 + chatBox.animate({ scrollTop: elementTop }, 500);
2032 1647 }
2033 -
2034 - function showChatWidget(botId) {
2035 - botId = botId || 'default';
2036 - var $button = getElement(botId, 'floating-chatbot-button');
1648 +
1649 + function showChatWidget() {
2037 1650 // First ensure display is set
2038 - $button.css('display', 'flex');
1651 + $('#floating-chatbot-button').css('display', 'flex');
2039 1652 // Then handle the fade
2040 - $button.fadeTo(500, 1);
1653 + $('#floating-chatbot-button').fadeTo(500, 1);
2041 1654 // Force visibility
2042 - $button.removeClass('hidden');
1655 + $('#floating-chatbot-button').removeClass('hidden');
1656 + //console.log('Showing widget');
2043 1657 }
2044 -
2045 - function hideChatWidget(botId) {
2046 - botId = botId || 'default';
2047 - var $button = getElement(botId, 'floating-chatbot-button');
2048 - $button.css('display', 'none');
2049 - $button.addClass('hidden');
1658 +
1659 + function hideChatWidget() {
1660 + $('#floating-chatbot-button').css('display', 'none');
1661 + $('#floating-chatbot-button').addClass('hidden');
1662 + //console.log('Hiding widget');
2050 1663 }
2051 1664
2052 1665 function disableScroll() {
2053 1666 if (isMobile()) {
@@ -2076,15 +1689,18 @@
2076 1689 // NOTIFICATION SYSTEM
2077 1690 // ====================================
2078 1691
2079 1692 function createNotificationBadge() {
1693 + //console.log("Creating notification badge...");
2080 1694 const chatButton = document.getElementById('floating-chatbot-button');
2081 -
1695 + //console.log("Chat button found:", !!chatButton);
1696 +
2082 1697 if (!chatButton) return;
2083 -
1698 +
2084 1699 // Remove any existing badge first
2085 1700 const existingBadge = chatButton.querySelector('.chat-notification-badge');
2086 1701 if (existingBadge) {
1702 + //console.log("Removing existing badge");
2087 1703 existingBadge.remove();
2088 1704 }
2089 1705
2090 1706 notificationBadge = document.createElement('div');
@@ -2106,43 +1722,34 @@
2106 1722 chatButton.appendChild(notificationBadge);
2107 1723
2108 1724 }
2109 1725
2110 - function showNotification(botId) {
2111 - botId = botId || 'default';
2112 - const badge = getElementDOM(botId, 'chat-notification-badge');
2113 - var $floatingChatbot = getElement(botId, 'floating-chatbot');
2114 - if (badge && $floatingChatbot.hasClass('hidden')) {
1726 + function showNotification() {
1727 + const badge = document.getElementById('chat-notification-badge');
1728 + if (badge && $('#floating-chatbot').hasClass('hidden')) {
2115 1729 badge.style.display = 'block';
2116 1730 badge.textContent = '1';
2117 1731 }
2118 1732 }
2119 -
2120 - function hideNotification(botId) {
2121 - botId = botId || 'default';
2122 - const badge = getElementDOM(botId, 'chat-notification-badge');
1733 +
1734 + function hideNotification() {
1735 + const badge = document.getElementById('chat-notification-badge');
2123 1736 if (badge) {
2124 1737 badge.style.display = 'none';
2125 1738 }
2126 1739 }
2127 -
2128 - function startNotificationChecking(botId) {
2129 - botId = botId || 'default';
1740 +
1741 + function startNotificationChecking() {
2130 1742 const chatPersistenceEnabled = mxchatChat.chat_persistence_toggle === 'on';
2131 1743 if (!chatPersistenceEnabled) return;
2132 -
2133 - createNotificationBadge(botId);
2134 - var instance = MxChatInstances.get(botId);
2135 - instance.notificationCheckInterval = setInterval(function() {
2136 - checkForNewMessages(botId);
2137 - }, 30000); // Check every 30 seconds
1744 +
1745 + createNotificationBadge();
1746 + notificationCheckInterval = setInterval(checkForNewMessages, 30000); // Check every 30 seconds
2138 1747 }
2139 -
2140 - function stopNotificationChecking(botId) {
2141 - botId = botId || 'default';
2142 - var instance = MxChatInstances.get(botId);
2143 - if (instance.notificationCheckInterval) {
2144 - clearInterval(instance.notificationCheckInterval);
1748 +
1749 + function stopNotificationChecking() {
1750 + if (notificationCheckInterval) {
1751 + clearInterval(notificationCheckInterval);
2145 1752 }
2146 1753 }
2147 1754
2148 1755 function checkForNewMessages() {
@@ -2168,35 +1775,63 @@
2168 1775 });
2169 1776 }
2170 1777
2171 1778
2172 -// ====================================
2173 -// LIVE AGENT FUNCTIONALITY
2174 -// ====================================
2175 -
2176 -function startPolling(botId) {
2177 - botId = botId || 'default';
2178 - var instance = MxChatInstances.get(botId);
2179 - // Clear any existing interval first
2180 - stopPolling(botId);
2181 - instance.pollingInterval = setInterval(function() {
2182 - checkForAgentMessages(botId);
2183 - }, 5000);
1779 + // ====================================
1780 + // LIVE AGENT FUNCTIONALITY
1781 + // ====================================
1782 +
1783 +function updateChatModeIndicator(mode) {
1784 + //console.log("updateChatModeIndicator called with mode:", mode);
1785 + const indicator = document.getElementById('chat-mode-indicator');
1786 + if (indicator) {
1787 + const oldText = indicator.textContent;
1788 +
1789 + if (mode === 'agent') {
1790 + indicator.textContent = 'Live Agent';
1791 + startPolling();
1792 + //console.log("Set indicator to Live Agent");
1793 + } else {
1794 + // Everything else is AI mode
1795 + const customAiText = indicator.getAttribute('data-ai-text') || 'AI Agent';
1796 + indicator.textContent = customAiText;
1797 + stopPolling();
1798 + //console.log("Set indicator to AI Agent:", customAiText);
1799 + }
1800 +
1801 + // Force immediate DOM update
1802 + if (oldText !== indicator.textContent) {
1803 + // Force a reflow to ensure the change is visible immediately
1804 + indicator.offsetHeight;
1805 +
1806 + // Double-check after a brief moment
1807 + setTimeout(() => {
1808 + //console.log("Final indicator text:", indicator.textContent);
1809 + }, 50);
1810 + }
1811 + } else {
1812 + //console.error("Chat mode indicator element not found!");
1813 + }
2184 1814 }
2185 1815
2186 -function stopPolling(botId) {
2187 - botId = botId || 'default';
2188 - var instance = MxChatInstances.get(botId);
2189 - if (instance.pollingInterval) {
2190 - clearInterval(instance.pollingInterval);
2191 - instance.pollingInterval = null;
1816 + function startPolling() {
1817 + // Clear any existing interval first
1818 + stopPolling();
1819 + // Start new polling interval
1820 + pollingInterval = setInterval(checkForAgentMessages, 5000);
1821 + //console.log("Started agent message polling");
2192 1822 }
2193 -}
2194 -
2195 -function checkForAgentMessages(botId) {
2196 - botId = botId || 'default';
2197 - var instance = MxChatInstances.get(botId);
2198 - const sessionId = getChatSession(botId);
1823 +
1824 + function stopPolling() {
1825 + if (pollingInterval) {
1826 + clearInterval(pollingInterval);
1827 + pollingInterval = null;
1828 + //console.log("Stopped agent message polling");
1829 + }
1830 + }
1831 +
1832 +function checkForAgentMessages() {
1833 + const sessionId = getChatSession();
2199 1834 $.ajax({
2200 1835 url: mxchatChat.ajax_url,
2201 1836 type: 'POST',
2202 1837 dataType: 'json',
@@ -2202,44 +1837,35 @@
2202 1837 dataType: 'json',
2203 1838 data: {
2204 1839 action: 'mxchat_fetch_new_messages',
2205 1840 session_id: sessionId,
2206 - last_seen_id: instance.lastSeenMessageId,
2207 - persistence_enabled: 'true',
1841 + last_seen_id: lastSeenMessageId,
1842 + persistence_enabled: 'true', // Add this too
2208 1843 nonce: mxchatChat.nonce
2209 1844 },
2210 1845 success: function (response) {
2211 1846 if (response.success && response.data?.new_messages) {
2212 1847 let hasNewMessage = false;
2213 -
1848 +
2214 1849 response.data.new_messages.forEach(function (message) {
2215 - if (message.role === "agent" && !instance.processedMessageIds.has(message.id)) {
1850 + if (message.role === "agent" && !processedMessageIds.has(message.id)) {
2216 1851 hasNewMessage = true;
2217 - appendMessage("agent", message.content, '', [], false, botId);
2218 - instance.lastSeenMessageId = message.id;
2219 - instance.processedMessageIds.add(message.id);
1852 + // CHANGE THIS LINE:
1853 + appendMessage("agent", message.content); // Instead of replaceLastMessage
1854 + lastSeenMessageId = message.id;
1855 + processedMessageIds.add(message.id);
2220 1856 }
2221 1857 });
2222 1858
2223 - if (hasNewMessage) {
2224 - enableChatInput(botId);
1859 + if (hasNewMessage && $('#floating-chatbot').hasClass('hidden')) {
1860 + showNotification();
2225 1861 }
2226 -
2227 - var $floatingChatbot = getElement(botId, 'floating-chatbot');
2228 - if (hasNewMessage && $floatingChatbot.hasClass('hidden')) {
2229 - showNotification(botId);
2230 - }
2231 -
2232 - scrollToBottom(botId, true);
1862 +
1863 + scrollToBottom(true);
2233 1864 }
2234 -
2235 - // Handle chat mode transitions (e.g. agent ended chat via !endchat)
2236 - if (response.success && response.data?.chat_mode) {
2237 - updateChatModeIndicator(response.data.chat_mode, botId);
2238 - }
2239 1865 },
2240 1866 error: function (xhr, status, error) {
2241 - // Polling error - silently continue
1867 + //console.error("Polling error:", xhr, status, error);
2242 1868 }
2243 1869 });
2244 1870 }
2245 1871
@@ -2245,30 +1871,19 @@
2245 1871
2246 1872 // ====================================
2247 1873 // CHAT HISTORY & PERSISTENCE
2248 1874 // ====================================
2249 -
2250 -function loadChatHistory(botId, onComplete) {
2251 - botId = botId || 'default';
2252 - var instance = MxChatInstances.get(botId);
2253 -
1875 +// Update the loadChatHistory function:
1876 +function loadChatHistory() {
2254 1877 // Prevent duplicate loading
2255 - if (instance.chatHistoryLoaded) {
2256 - if (onComplete) onComplete();
1878 + if (chatHistoryLoaded) {
1879 + // console.log('Chat history already loaded, skipping...');
2257 1880 return;
2258 1881 }
2259 -
2260 - // Use getChatSession which returns null if no session exists (does NOT create one)
2261 - var sessionId = getChatSession(botId);
1882 +
1883 + var sessionId = getChatSession();
2262 1884 var chatPersistenceEnabled = mxchatChat.chat_persistence_toggle === 'on';
2263 1885
2264 - // No session yet — nothing to load. History will load after first message via ensureSession.
2265 - if (!sessionId) {
2266 - instance.chatHistoryLoaded = true;
2267 - if (onComplete) onComplete();
2268 - return;
2269 - }
2270 -
2271 1886 if (chatPersistenceEnabled && sessionId) {
2272 1887 $.ajax({
2273 1888 url: mxchatChat.ajax_url,
2274 1889 type: 'POST',
@@ -2279,12 +1894,11 @@
2279 1894 },
2280 1895 success: function(response) {
2281 1896 // Handle session reset (IP changed while user was away)
2282 1897 if (response.success === false && response.data && response.data.action === 'reset_session') {
2283 - // Silent reset — new session but don't clear UI
2284 - MxChatInstances.silentResetSession(botId);
2285 - instance.chatHistoryLoaded = true; // Prevent retry loop
2286 - if (onComplete) onComplete();
1898 + // Silently reset session - user will start fresh
1899 + resetChatSession();
1900 + chatHistoryLoaded = true; // Prevent retry loop
2287 1901 return;
2288 1902 }
2289 1903
2290 1904 // Check if the response indicates success
@@ -2290,15 +1904,15 @@
2290 1904 // Check if the response indicates success
2291 1905 if (response.success) {
2292 1906 // Handle case where conversation data exists and is an array
2293 1907 if (response.data && Array.isArray(response.data.conversation)) {
2294 - var $chatBox = getElement(botId, 'chat-box');
1908 + var $chatBox = $('#chat-box');
2295 1909 var $fragment = $(document.createDocumentFragment());
2296 - let highestMessageId = instance.lastSeenMessageId;
1910 + let highestMessageId = lastSeenMessageId;
2297 1911
2298 1912 // Update chat mode if provided
2299 1913 if (response.data.chat_mode) {
2300 - updateChatModeIndicator(response.data.chat_mode, botId);
1914 + updateChatModeIndicator(response.data.chat_mode);
2301 1915 }
2302 1916
2303 1917 // Only process if there are actual messages
2304 1918 if (response.data.conversation.length > 0) {
@@ -2303,9 +1917,9 @@
2303 1917 // Only process if there are actual messages
2304 1918 if (response.data.conversation.length > 0) {
2305 1919 // IMPORTANT: Clear existing messages before loading history
2306 1920 $chatBox.empty();
2307 -
1921 +
2308 1922 $.each(response.data.conversation, function(index, message) {
2309 1923 // Skip agent messages if persistence is off
2310 1924 if (!chatPersistenceEnabled && message.role === 'agent') {
2311 1925 return;
@@ -2340,19 +1954,9 @@
2340 1954 var content = message.content;
2341 1955 content = content.replace(/\\'/g, "'").replace(/\\"/g, '"');
2342 1956 content = decodeHTMLEntities(content);
2343 1957
2344 - // Skip linkify for messages containing structured HTML
2345 - // (forms, product cards, galleries, etc.) to avoid
2346 - // markdown formatting corrupting HTML attributes
2347 - // (e.g. underscores in name="field_name" becoming <em> tags)
2348 - if (content.includes("mxchat-product-card") ||
2349 - content.includes("mxchat-image-gallery") ||
2350 - content.includes("mxchat-featured-products") ||
2351 - content.includes("<form") ||
2352 - content.includes("<input") ||
2353 - content.includes("<select") ||
2354 - content.includes("<textarea")) {
1958 + if (content.includes("mxchat-product-card") || content.includes("mxchat-image-gallery")) {
2355 1959 messageElement.html(content);
2356 1960 } else {
2357 1961 var formattedContent = linkify(content);
2358 1962 messageElement.html(formattedContent);
@@ -2362,47 +1966,42 @@
2362 1966
2363 1967 // Track message IDs
2364 1968 if (message.id) {
2365 1969 highestMessageId = Math.max(highestMessageId, message.id);
2366 - instance.processedMessageIds.add(message.id);
1970 + processedMessageIds.add(message.id);
2367 1971 }
2368 1972 });
2369 1973
2370 1974 // Only append messages and scroll if we have content
2371 1975 $chatBox.append($fragment);
2372 - scrollToBottom(botId, true);
1976 + scrollToBottom(true);
2373 1977
2374 1978 // Collapse quick questions if we have conversation history
2375 - // BUT skip auto-collapse for embedded bots (they should stay expanded)
2376 - if (hasQuickQuestions(botId) && !isEmbeddedBot(botId)) {
2377 - collapseQuickQuestions(botId);
1979 + if (hasQuickQuestions()) {
1980 + collapseQuickQuestions();
2378 1981 }
2379 1982
2380 1983 // Update lastSeenMessageId after history loads
2381 - instance.lastSeenMessageId = highestMessageId;
1984 + lastSeenMessageId = highestMessageId;
2382 1985
2383 1986 // Only update chat mode if persistence is enabled and we have messages
2384 1987 if (chatPersistenceEnabled) {
2385 1988 var lastMessage = response.data.conversation[response.data.conversation.length - 1];
2386 1989 if (lastMessage.role === 'agent') {
2387 - updateChatModeIndicator('agent', botId);
1990 + updateChatModeIndicator('agent');
2388 1991 }
2389 1992 }
2390 -
1993 +
2391 1994 // Mark as loaded ONLY after successful load
2392 - instance.chatHistoryLoaded = true;
1995 + chatHistoryLoaded = true;
2393 1996 }
2394 1997 }
2395 1998 }
2396 - if (onComplete) onComplete();
2397 1999 },
2398 2000 error: function(xhr, status, error) {
2399 - // Error loading chat history - silently continue
2400 - if (onComplete) onComplete();
2001 + //console.error("AJAX error loading chat history:", status, error);
2401 2002 }
2402 2003 });
2403 - } else {
2404 - if (onComplete) onComplete();
2405 2004 }
2406 2005 }
2407 2006
2408 2007
@@ -2416,42 +2015,40 @@
2416 2015 element.addEventListener(eventType, handler);
2417 2016 }
2418 2017 }
2419 2018
2420 - function showActivePdf(filename, botId) {
2421 - botId = botId || 'default';
2422 - const container = getElementDOM(botId, 'active-pdf-container');
2423 - const nameElement = getElementDOM(botId, 'active-pdf-name');
2424 -
2019 + function showActivePdf(filename) {
2020 + const container = document.getElementById('active-pdf-container');
2021 + const nameElement = document.getElementById('active-pdf-name');
2022 +
2425 2023 if (!container || !nameElement) {
2024 + //console.error('PDF container elements not found');
2426 2025 return;
2427 2026 }
2428 -
2027 +
2429 2028 nameElement.textContent = filename;
2430 2029 container.style.display = 'flex';
2431 2030 }
2432 -
2433 - function showActiveWord(filename, botId) {
2434 - botId = botId || 'default';
2435 - const container = getElementDOM(botId, 'active-word-container');
2436 - const nameElement = getElementDOM(botId, 'active-word-name');
2437 -
2031 +
2032 + function showActiveWord(filename) {
2033 + const container = document.getElementById('active-word-container');
2034 + const nameElement = document.getElementById('active-word-name');
2035 +
2438 2036 if (!container || !nameElement) {
2037 + //console.error('Word document container elements not found');
2439 2038 return;
2440 2039 }
2441 -
2040 +
2442 2041 nameElement.textContent = filename;
2443 2042 container.style.display = 'flex';
2444 2043 }
2445 -
2446 - function removeActivePdf(botId) {
2447 - botId = botId || 'default';
2448 - var instance = MxChatInstances.get(botId);
2449 - const container = getElementDOM(botId, 'active-pdf-container');
2450 - const nameElement = getElementDOM(botId, 'active-pdf-name');
2451 -
2452 - if (!container || !nameElement || !instance.activePdfFile) return;
2453 -
2044 +
2045 + function removeActivePdf() {
2046 + const container = document.getElementById('active-pdf-container');
2047 + const nameElement = document.getElementById('active-pdf-name');
2048 +
2049 + if (!container || !nameElement || !activePdfFile) return;
2050 +
2454 2051 fetch(mxchatChat.ajax_url, {
2455 2052 method: 'POST',
2456 2053 headers: {
2457 2054 'Content-Type': 'application/x-www-form-urlencoded',
@@ -2457,9 +2054,9 @@
2457 2054 'Content-Type': 'application/x-www-form-urlencoded',
2458 2055 },
2459 2056 body: new URLSearchParams({
2460 2057 'action': 'mxchat_remove_pdf',
2461 - 'session_id': getChatSession(botId),
2058 + 'session_id': sessionId,
2462 2059 'nonce': mxchatChat.nonce
2463 2060 })
2464 2061 })
2465 2062 .then(response => response.json())
@@ -2471,12 +2068,12 @@
2471 2068 appendMessage('bot', 'PDF removed.');
2472 2069 }
2473 2070 })
2474 2071 .catch(error => {
2475 - // Error removing PDF - silently continue
2072 + //console.error('Error removing PDF:', error);
2476 2073 });
2477 2074 }
2478 -
2075 +
2479 2076 function removeActiveWord() {
2480 2077 const container = document.getElementById('active-word-container');
2481 2078 const nameElement = document.getElementById('active-word-name');
2482 2079
@@ -2502,53 +2099,56 @@
2502 2099 appendMessage('bot', 'Word document removed.');
2503 2100 }
2504 2101 })
2505 2102 .catch(error => {
2506 - // Error removing Word document - silently continue
2103 + //console.error('Error removing Word document:', error);
2507 2104 });
2508 2105 }
2509 -
2106 +
2510 2107 // ====================================
2511 2108 // CONSENT & COMPLIANCE (GDPR)
2512 2109 // ====================================
2513 -
2514 - function initializeChatVisibility(botId) {
2515 - botId = botId || 'default';
2516 - const complianzEnabled = mxchatChat.complianz_toggle === 'on' ||
2517 - mxchatChat.complianz_toggle === '1' ||
2110 +
2111 + function initializeChatVisibility() {
2112 + //console.log('Initializing chat visibility');
2113 + const complianzEnabled = mxchatChat.complianz_toggle === 'on' ||
2114 + mxchatChat.complianz_toggle === '1' ||
2518 2115 mxchatChat.complianz_toggle === 1;
2519 -
2116 +
2520 2117 if (complianzEnabled && typeof cmplz_has_consent === "function" && typeof complianz !== 'undefined') {
2521 2118 // Initial check
2522 - checkConsentAndShowChat(botId);
2523 -
2119 + checkConsentAndShowChat();
2120 +
2524 2121 // Listen for consent changes
2525 2122 $(document).on('cmplz_status_change', function(event) {
2526 - checkConsentAndShowChat(botId);
2123 + //console.log('Status change detected');
2124 + checkConsentAndShowChat();
2527 2125 });
2528 2126 } else {
2529 2127 // If Complianz is not enabled, always show
2530 - getElement(botId, 'floating-chatbot-button')
2128 + $('#floating-chatbot-button')
2531 2129 .css('display', 'flex')
2532 2130 .removeClass('hidden no-consent')
2533 2131 .fadeTo(500, 1);
2534 -
2132 +
2535 2133 // Also check pre-chat message when Complianz is not enabled
2536 - checkPreChatDismissal(botId);
2134 + checkPreChatDismissal();
2537 2135 }
2538 2136 }
2539 2137
2540 -
2541 - function checkConsentAndShowChat(botId) {
2542 - botId = botId || 'default';
2138 +
2139 + function checkConsentAndShowChat() {
2543 2140 var consentStatus = cmplz_has_consent('marketing');
2544 2141 var consentType = complianz.consenttype;
2545 -
2546 - let $widget = getElement(botId, 'floating-chatbot-button');
2547 - let $chatbot = getElement(botId, 'floating-chatbot');
2548 - let $preChat = getElement(botId, 'pre-chat-message');
2549 -
2142 +
2143 + //console.log('Checking consent:', {status: consentStatus,type: consentType});
2144 +
2145 + let $widget = $('#floating-chatbot-button');
2146 + let $chatbot = $('#floating-chatbot');
2147 + let $preChat = $('#pre-chat-message');
2148 +
2550 2149 if (consentStatus === true) {
2150 + //console.log('Consent granted - showing widget');
2551 2151 $widget
2552 2152 .removeClass('no-consent')
2553 2153 .css('display', 'flex')
2554 2154 .removeClass('hidden')
@@ -2553,12 +2153,13 @@
2553 2153 .css('display', 'flex')
2554 2154 .removeClass('hidden')
2555 2155 .fadeTo(500, 1);
2556 2156 $chatbot.removeClass('no-consent');
2557 -
2157 +
2558 2158 // Show pre-chat message if not dismissed
2559 - checkPreChatDismissal(botId);
2159 + checkPreChatDismissal();
2560 2160 } else {
2161 + //console.log('No consent - hiding widget');
2561 2162 $widget
2562 2163 .addClass('no-consent')
2563 2164 .fadeTo(500, 0, function() {
2564 2165 $(this)
@@ -2565,9 +2166,9 @@
2565 2166 .css('display', 'none')
2566 2167 .addClass('hidden');
2567 2168 });
2568 2169 $chatbot.addClass('no-consent');
2569 -
2170 +
2570 2171 // Hide pre-chat message when no consent
2571 2172 $preChat.hide();
2572 2173 }
2573 2174 }
@@ -2575,38 +2176,46 @@
2575 2176
2576 2177 // ====================================
2577 2178 // PRE-CHAT MESSAGE HANDLING
2578 2179 // ====================================
2579 -
2580 - function checkPreChatDismissal(botId) {
2581 - botId = botId || 'default';
2582 - try {
2583 - var dismissedAt = localStorage.getItem('mxchat_pre_chat_dismissed_' + botId);
2584 - if (dismissedAt) {
2585 - // Re-show after 24 hours
2586 - var elapsed = Date.now() - parseInt(dismissedAt, 10);
2587 - if (elapsed < 86400000) {
2588 - getElement(botId, 'pre-chat-message').hide();
2589 - return;
2180 +
2181 + function checkPreChatDismissal() {
2182 + $.ajax({
2183 + url: mxchatChat.ajax_url,
2184 + type: 'POST',
2185 + data: {
2186 + action: 'mxchat_check_pre_chat_message_status',
2187 + _ajax_nonce: mxchatChat.nonce
2188 + },
2189 + success: function(response) {
2190 + if (response.success && !response.data.dismissed) {
2191 + $('#pre-chat-message').fadeIn(250);
2192 + } else {
2193 + $('#pre-chat-message').hide();
2590 2194 }
2591 - // Expired — clear and show again
2592 - localStorage.removeItem('mxchat_pre_chat_dismissed_' + botId);
2195 + },
2196 + error: function() {
2197 + //console.error('Failed to check pre-chat message dismissal status.');
2593 2198 }
2594 - getElement(botId, 'pre-chat-message').fadeIn(250);
2595 - } catch (e) {
2596 - // localStorage unavailable — show the message
2597 - getElement(botId, 'pre-chat-message').fadeIn(250);
2598 - }
2199 + });
2599 2200 }
2600 -
2601 - function handlePreChatDismissal(botId) {
2602 - botId = botId || 'default';
2603 - getElement(botId, 'pre-chat-message').fadeOut(200);
2604 - try {
2605 - localStorage.setItem('mxchat_pre_chat_dismissed_' + botId, String(Date.now()));
2606 - } catch (e) {
2607 - // localStorage unavailable — dismissal won't persist
2608 - }
2201 +
2202 + function handlePreChatDismissal() {
2203 + $('#pre-chat-message').fadeOut(200);
2204 + $.ajax({
2205 + url: mxchatChat.ajax_url,
2206 + type: 'POST',
2207 + data: {
2208 + action: 'mxchat_dismiss_pre_chat_message',
2209 + _ajax_nonce: mxchatChat.nonce
2210 + },
2211 + success: function() {
2212 + $('#pre-chat-message').hide();
2213 + },
2214 + error: function() {
2215 + //console.error('Failed to dismiss pre-chat message.');
2216 + }
2217 + });
2609 2218 }
2610 2219
2611 2220
2612 2221 // ====================================
@@ -2632,104 +2241,78 @@
2632 2241 // ====================================
2633 2242
2634 2243 $(document).on('click', '.mxchat-popular-question', function () {
2635 2244 var question = $(this).text();
2636 - var botId = getBotIdFromElement(this);
2637 -
2245 +
2638 2246 // Append the question as if the user typed it
2639 - appendMessage("user", question, '', [], false, botId);
2640 -
2247 + appendMessage("user", question);
2248 +
2641 2249 // Only collapse if there are questions
2642 - if (hasQuickQuestions(botId)) {
2643 - collapseQuickQuestions(botId);
2250 + if (hasQuickQuestions()) {
2251 + collapseQuickQuestions();
2644 2252 }
2645 -
2253 +
2646 2254 // Send the question to the server
2647 - sendMessageToChatbot(question, botId);
2255 + sendMessageToChatbot(question);
2648 2256 });
2649 2257
2650 2258 $(document).on('click', '.questions-toggle-btn', function(e) {
2651 2259 e.preventDefault();
2652 2260 e.stopPropagation();
2653 - var botId = getBotIdFromElement(this);
2654 - expandQuickQuestions(botId);
2261 + expandQuickQuestions();
2655 2262 });
2656 2263
2657 2264 $(document).on('click', '.questions-collapse-btn', function(e) {
2658 2265 e.preventDefault();
2659 2266 e.stopPropagation();
2660 - var botId = getBotIdFromElement(this);
2661 - collapseQuickQuestions(botId);
2267 + collapseQuickQuestions();
2662 2268 });
2663 2269
2664 - // Chatbot visibility toggle handlers - use class selector for multi-instance support
2665 - $(document).on('click', '.floating-chatbot-button', function() {
2666 - var botId = getBotIdFromElement(this);
2667 - var $chatbot = getElement(botId, 'floating-chatbot');
2668 - var $badge = getElement(botId, 'chat-notification-badge');
2669 - var $preChat = getElement(botId, 'pre-chat-message');
2670 -
2671 - if ($chatbot.hasClass('hidden')) {
2672 - $chatbot.removeClass('hidden').addClass('visible');
2270 + // Chatbot visibility toggle handlers
2271 + $(document).on('click', '#floating-chatbot-button', function() {
2272 + var chatbot = $('#floating-chatbot');
2273 + if (chatbot.hasClass('hidden')) {
2274 + chatbot.removeClass('hidden').addClass('visible');
2673 2275 $(this).addClass('hidden');
2674 - $badge.hide(); // Hide notification when opening chat
2276 + $('#chat-notification-badge').hide(); // Hide notification when opening chat
2675 2277 disableScroll();
2676 - $preChat.fadeOut(250);
2677 -
2678 - // Load chat history for returning visitors (persistence)
2679 - var chatPersistenceEnabled = typeof mxchatChat !== 'undefined' && mxchatChat.chat_persistence_toggle === 'on';
2680 - if (chatPersistenceEnabled) {
2681 - MxChatInstances.ensureSession(botId);
2682 - }
2683 -
2684 - // Deferred email check — only on first widget open
2685 - var emailBlocker = getElementDOM(botId, 'email-blocker');
2686 - var instance = MxChatInstances.get(botId);
2687 - if (emailBlocker && !instance.emailCheckDone) {
2688 - instance.emailCheckDone = true;
2689 - resolveEmailState(botId);
2690 - } else if (!emailBlocker) {
2691 - // No email collection — still route through showChatContainerForBot
2692 - // so the loader is shown while chat history loads
2693 - showChatContainerForBot(botId);
2694 - }
2278 + $('#pre-chat-message').fadeOut(250);
2695 2279 } else {
2696 - $chatbot.removeClass('visible').addClass('hidden');
2280 + chatbot.removeClass('visible').addClass('hidden');
2697 2281 $(this).removeClass('hidden');
2698 2282 enableScroll();
2699 - checkPreChatDismissal(botId);
2283 + checkPreChatDismissal();
2700 2284 }
2701 2285 });
2702 -
2703 - // Allow clicking anywhere on the title bar to close the chatbot
2704 - $(document).on('click', '.chatbot-top-bar', function() {
2705 - var botId = getBotIdFromElement(this);
2706 - getElement(botId, 'floating-chatbot').addClass('hidden').removeClass('visible');
2707 - getElement(botId, 'floating-chatbot-button').removeClass('hidden');
2286 +
2287 + $(document).on('click', '#exit-chat-button', function() {
2288 + $('#floating-chatbot').addClass('hidden').removeClass('visible');
2289 + $('#floating-chatbot-button').removeClass('hidden');
2708 2290 enableScroll();
2709 2291 });
2710 -
2292 +
2711 2293 $(document).on('click', '.close-pre-chat-message', function(e) {
2712 2294 e.stopPropagation(); // Prevent triggering the parent .pre-chat-message click
2713 - var botId = getBotIdFromElement(this);
2714 - handlePreChatDismissal(botId);
2295 + $('#pre-chat-message').fadeOut(200, function() {
2296 + $(this).remove();
2297 + });
2715 2298 });
2299 +
2716 2300
2717 -
2718 - // PDF upload button handlers - use class selector
2719 - $(document).on('click', '.pdf-upload-btn', function() {
2720 - var botId = getBotIdFromElement(this);
2721 - var pdfInput = getElementDOM(botId, 'pdf-upload');
2722 - if (pdfInput) pdfInput.click();
2723 - });
2724 -
2725 - // Word upload button handlers - use class selector
2726 - $(document).on('click', '.word-upload-btn', function() {
2727 - var botId = getBotIdFromElement(this);
2728 - var wordInput = getElementDOM(botId, 'word-upload');
2729 - if (wordInput) wordInput.click();
2730 - });
2301 + // PDF upload button handlers
2302 + if (document.getElementById('pdf-upload-btn')) {
2303 + document.getElementById('pdf-upload-btn').addEventListener('click', function() {
2304 + document.getElementById('pdf-upload').click();
2305 + });
2306 + }
2731 2307
2308 + // Word upload button handlers
2309 + if (document.getElementById('word-upload-btn')) {
2310 + document.getElementById('word-upload-btn').addEventListener('click', function() {
2311 + document.getElementById('word-upload').click();
2312 + });
2313 + }
2314 +
2732 2315 // PDF file input change handler
2733 2316 addSafeEventListener('pdf-upload', 'change', async function(e) {
2734 2317 const file = e.target.files[0];
2735 2318
@@ -2738,13 +2321,15 @@
2738 2321 return;
2739 2322 }
2740 2323
2741 2324 if (!sessionId) {
2325 + //console.error('No session ID found');
2742 2326 alert('Error: No session ID found');
2743 2327 return;
2744 2328 }
2745 -
2329 +
2746 2330 if (!mxchatChat || !mxchatChat.ajax_url || !mxchatChat.nonce) {
2331 + //console.error('mxchatChat not properly configured:', mxchatChat);
2747 2332 alert('Error: Ajax configuration missing');
2748 2333 return;
2749 2334 }
2750 2335
@@ -2786,11 +2371,13 @@
2786 2371 appendMessage('bot', data.data.message);
2787 2372 scrollToBottom();
2788 2373 activePdfFile = data.data.filename;
2789 2374 } else {
2375 + //console.error('Upload failed:', data.data);
2790 2376 alert('Failed to upload PDF. Please try again.');
2791 2377 }
2792 2378 } catch (error) {
2379 + //console.error('Upload error:', error);
2793 2380 alert('Error uploading file. Please try again.');
2794 2381 } finally {
2795 2382 uploadBtn.disabled = false;
2796 2383 sendBtn.disabled = false;
@@ -2808,12 +2395,13 @@
2808 2395 return;
2809 2396 }
2810 2397
2811 2398 if (!sessionId) {
2399 + //console.error('No session ID found');
2812 2400 alert('Error: No session ID found');
2813 2401 return;
2814 2402 }
2815 -
2403 +
2816 2404 // Disable buttons and show loading state
2817 2405 const uploadBtn = document.getElementById('word-upload-btn');
2818 2406 const sendBtn = document.getElementById('send-button');
2819 2407 const originalBtnContent = uploadBtn.innerHTML;
@@ -2851,11 +2439,13 @@
2851 2439 appendMessage('bot', data.data.message);
2852 2440 scrollToBottom();
2853 2441 activeWordFile = data.data.filename;
2854 2442 } else {
2443 + //console.error('Upload failed:', data.data);
2855 2444 alert('Failed to upload Word document. Please try again.');
2856 2445 }
2857 2446 } catch (error) {
2447 + //console.error('Upload error:', error);
2858 2448 alert('Error uploading file. Please try again.');
2859 2449 } finally {
2860 2450 uploadBtn.disabled = false;
2861 2451 sendBtn.disabled = false;
@@ -2913,497 +2503,454 @@
2913 2503 });
2914 2504
2915 2505
2916 2506 // ====================================
2917 -// INIT LOADER & CHAT CONTAINER HELPERS
2507 +// EMAIL COLLECTION SETUP - FIXED VERSION
2918 2508 // ====================================
2919 -// These must be outside the email collection block so they're always available
2920 -// (used by persistence loading even when email collection is off)
2921 -
2922 -function showInitLoader(botId) {
2923 - var loader = getElementDOM(botId, 'mxchat-init-loader');
2924 - if (loader) loader.style.display = 'flex';
2925 -}
2926 -
2927 -function hideInitLoader(botId) {
2928 - var loader = getElementDOM(botId, 'mxchat-init-loader');
2929 - if (loader) loader.style.display = 'none';
2930 -}
2931 -
2932 -function showEmailFormForBot(botId) {
2933 - hideInitLoader(botId);
2934 - var emailBlocker = getElementDOM(botId, 'email-blocker');
2935 - var chatContainer = getElementDOM(botId, 'chat-container');
2936 - if (emailBlocker) emailBlocker.style.display = 'flex';
2937 - if (chatContainer) chatContainer.style.display = 'none';
2938 -}
2939 -
2940 -function showChatContainerForBot(botId) {
2941 - var emailBlocker = getElementDOM(botId, 'email-blocker');
2942 - var chatContainer = getElementDOM(botId, 'chat-container');
2943 - if (emailBlocker) emailBlocker.style.display = 'none';
2944 -
2945 - var instance = MxChatInstances.get(botId);
2946 - var chatPersistenceEnabled = mxchatChat.chat_persistence_toggle === 'on';
2947 -
2948 - // If persistence is on and history hasn't loaded yet, show loader
2949 - // while history loads to prevent flash of empty chat
2950 - if (chatPersistenceEnabled && !instance.chatHistoryLoaded) {
2951 - if (chatContainer) chatContainer.style.display = 'none';
2952 - showInitLoader(botId);
2953 - loadChatHistory(botId, function() {
2954 - hideInitLoader(botId);
2955 - if (chatContainer) chatContainer.style.display = 'flex';
2956 - scrollToBottom(botId, true);
2957 - });
2958 - } else {
2959 - hideInitLoader(botId);
2960 - if (chatContainer) chatContainer.style.display = 'flex';
2961 - if (typeof loadChatHistory === 'function') {
2962 - loadChatHistory(botId);
2963 - }
2964 - }
2965 -}
2966 -
2967 -// ====================================
2968 -// EMAIL COLLECTION SETUP - MULTI-INSTANCE VERSION
2969 -// ====================================
2970 2509 // Only run email collection setup if it's enabled
2971 2510 if (mxchatChat && mxchatChat.email_collection_enabled === 'on') {
2511 + //console.log('Email collection is enabled, setting up handlers...');
2512 +
2513 + // Email collection form setup and handlers
2514 + const emailForm = document.getElementById('email-collection-form');
2515 + const emailBlocker = document.getElementById('email-blocker');
2516 + const chatbotWrapper = document.getElementById('chat-container');
2972 2517
2973 - // Track submitting state per bot
2974 - const emailSubmittingState = {};
2518 + if (emailForm && emailBlocker && chatbotWrapper) {
2519 +
2520 + // Add loading state management
2521 + let isSubmitting = false;
2522 +
2523 + // Optimized UI transition functions
2524 + function showEmailForm() {
2525 + emailBlocker.style.display = 'flex';
2526 + chatbotWrapper.style.display = 'none';
2527 + }
2975 2528
2976 - // Add CSS animations for email form (once globally)
2977 - if (!document.getElementById('email-error-styles')) {
2978 - const style = document.createElement('style');
2979 - style.id = 'email-error-styles';
2980 - style.textContent = `
2981 - @keyframes fadeInError {
2982 - from { opacity: 0; transform: translateY(-5px); }
2983 - to { opacity: 1; transform: translateY(0); }
2529 + function showChatContainer() {
2530 + // Show chat immediately without delay
2531 + emailBlocker.style.display = 'none';
2532 + chatbotWrapper.style.display = 'flex';
2533 +
2534 + // Load chat history only after showing chat container
2535 + if (typeof loadChatHistory === 'function') {
2536 + loadChatHistory();
2984 2537 }
2985 - .email-input-shake {
2986 - animation: shake 0.5s ease-in-out;
2987 - }
2988 - @keyframes shake {
2989 - 0%, 100% { transform: translateX(0); }
2990 - 25% { transform: translateX(-5px); }
2991 - 75% { transform: translateX(5px); }
2992 - }
2993 - @keyframes spin {
2994 - from { transform: rotate(0deg); }
2995 - to { transform: rotate(360deg); }
2996 - }
2997 - .email-spinner {
2998 - display: inline-block;
2999 - vertical-align: middle;
3000 - }
3001 - `;
3002 - document.head.appendChild(style);
3003 - }
2538 + }
3004 2539
3005 - function isValidEmailAddress(email) {
3006 - const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
3007 - return emailRegex.test(email.trim()) && email.length <= 254;
3008 - }
2540 + // Enhanced email validation
2541 + function isValidEmail(email) {
2542 + const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
2543 + return emailRegex.test(email.trim()) && email.length <= 254; // RFC 5321 limit
2544 + }
3009 2545
3010 - function isValidNameInput(name) {
3011 - return name && name.trim().length >= 2 && name.trim().length <= 100;
3012 - }
2546 + // Enhanced name validation
2547 + function isValidName(name) {
2548 + return name && name.trim().length >= 2 && name.trim().length <= 100;
2549 + }
3013 2550
3014 - /**
3015 - * Replace {visitor_name} placeholder in intro message with actual visitor name
3016 - * @param {string} botId - The bot instance ID
3017 - * @param {string} visitorName - The visitor's name to insert
3018 - */
3019 - function replaceVisitorNamePlaceholder(botId, visitorName) {
3020 - var chatBox = getElementDOM(botId, 'chat-box');
3021 - if (!chatBox) return;
3022 -
3023 - // Find the first bot message (intro message)
3024 - var introMessage = chatBox.querySelector('.bot-message');
3025 - if (!introMessage) return;
3026 -
3027 - var messageContent = introMessage.querySelector('div[dir="auto"]');
3028 - if (!messageContent) return;
3029 -
3030 - var html = messageContent.innerHTML;
3031 -
3032 - // Replace {visitor_name} placeholder (case-insensitive)
3033 - if (visitorName && visitorName.trim()) {
3034 - // Escape HTML to prevent XSS
3035 - var safeName = $('<div>').text(visitorName.trim()).html();
3036 - html = html.replace(/\{visitor_name\}/gi, safeName);
3037 - } else {
3038 - // Remove placeholder and clean up spacing if no name provided
3039 - html = html.replace(/\{visitor_name\}/gi, '');
3040 - // Clean up any double spaces that might result
3041 - html = html.replace(/\s{2,}/g, ' ').trim();
2551 + // Show loading state with spinner
2552 + function setSubmissionState(loading) {
2553 + const submitButton = document.getElementById('email-submit-button');
2554 + const emailInput = document.getElementById('user-email');
2555 + const nameInput = document.getElementById('user-name');
2556 +
2557 + if (loading) {
2558 + isSubmitting = true;
2559 + if (submitButton) submitButton.disabled = true;
2560 + if (emailInput) emailInput.disabled = true;
2561 + if (nameInput) nameInput.disabled = true;
2562 +
2563 + // Store original content and add spinner
2564 + if (submitButton && !submitButton.getAttribute('data-original-html')) {
2565 + submitButton.setAttribute('data-original-html', submitButton.innerHTML);
2566 +
2567 + // Add loading spinner while keeping original text
2568 + const originalText = submitButton.textContent;
2569 + submitButton.innerHTML = `
2570 + <svg class="email-spinner" style="width: 16px; height: 16px; margin-right: 8px; animation: spin 1s linear infinite;" viewBox="0 0 24 24">
2571 + <circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" fill="none" stroke-dasharray="31.416" stroke-dashoffset="31.416">
2572 + <animate attributeName="stroke-dasharray" dur="2s" values="0 31.416;15.708 15.708;0 31.416" repeatCount="indefinite"/>
2573 + <animate attributeName="stroke-dashoffset" dur="2s" values="0;-15.708;-31.416" repeatCount="indefinite"/>
2574 + </circle>
2575 + </svg>
2576 + ${originalText}
2577 + `;
2578 +
2579 + submitButton.style.opacity = '0.8';
2580 + }
2581 + } else {
2582 + isSubmitting = false;
2583 + if (submitButton) submitButton.disabled = false;
2584 + if (emailInput) emailInput.disabled = false;
2585 + if (nameInput) nameInput.disabled = false;
2586 +
2587 + // Restore original content
2588 + if (submitButton) {
2589 + const originalHtml = submitButton.getAttribute('data-original-html');
2590 + if (originalHtml) {
2591 + submitButton.innerHTML = originalHtml;
2592 + }
2593 + submitButton.style.opacity = '1';
2594 + }
2595 + }
3042 2596 }
3043 2597
3044 - messageContent.innerHTML = html;
3045 - }
3046 -
3047 - function setEmailSubmissionState(botId, loading) {
3048 - var submitButton = getElementDOM(botId, 'email-submit-button');
3049 - var emailInput = getElementDOM(botId, 'user-email');
3050 - var nameInput = getElementDOM(botId, 'user-name');
3051 -
3052 - if (loading) {
3053 - emailSubmittingState[botId] = true;
3054 - if (submitButton) submitButton.disabled = true;
3055 - if (emailInput) emailInput.disabled = true;
3056 - if (nameInput) nameInput.disabled = true;
3057 -
3058 - if (submitButton && !submitButton.getAttribute('data-original-html')) {
3059 - submitButton.setAttribute('data-original-html', submitButton.innerHTML);
3060 - const originalText = submitButton.textContent;
3061 - submitButton.innerHTML = `
3062 - <svg class="email-spinner" style="width: 16px; height: 16px; margin-right: 8px; animation: spin 1s linear infinite;" viewBox="0 0 24 24">
3063 - <circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" fill="none" stroke-dasharray="31.416" stroke-dashoffset="31.416">
3064 - <animate attributeName="stroke-dasharray" dur="2s" values="0 31.416;15.708 15.708;0 31.416" repeatCount="indefinite"/>
3065 - <animate attributeName="stroke-dashoffset" dur="2s" values="0;-15.708;-31.416" repeatCount="indefinite"/>
3066 - </circle>
3067 - </svg>
3068 - ${originalText}
2598 + // Error display functions
2599 + function showEmailError(message) {
2600 + clearEmailError();
2601 +
2602 + const errorDiv = document.createElement('div');
2603 + errorDiv.className = 'email-error';
2604 + errorDiv.style.cssText = `
2605 + color: #e74c3c;
2606 + font-size: 12px;
2607 + margin-top: 8px;
2608 + padding: 4px 0;
2609 + animation: fadeInError 0.3s ease;
2610 + `;
2611 + errorDiv.textContent = message;
2612 +
2613 + // Add CSS animation if not already present
2614 + if (!document.getElementById('email-error-styles')) {
2615 + const style = document.createElement('style');
2616 + style.id = 'email-error-styles';
2617 + style.textContent = `
2618 + @keyframes fadeInError {
2619 + from { opacity: 0; transform: translateY(-5px); }
2620 + to { opacity: 1; transform: translateY(0); }
2621 + }
2622 + .email-input-shake {
2623 + animation: shake 0.5s ease-in-out;
2624 + }
2625 + @keyframes shake {
2626 + 0%, 100% { transform: translateX(0); }
2627 + 25% { transform: translateX(-5px); }
2628 + 75% { transform: translateX(5px); }
2629 + }
2630 + @keyframes spin {
2631 + from { transform: rotate(0deg); }
2632 + to { transform: rotate(360deg); }
2633 + }
2634 + .email-spinner {
2635 + display: inline-block;
2636 + vertical-align: middle;
2637 + }
3069 2638 `;
3070 - submitButton.style.opacity = '0.8';
2639 + document.head.appendChild(style);
3071 2640 }
3072 - } else {
3073 - emailSubmittingState[botId] = false;
3074 - if (submitButton) submitButton.disabled = false;
3075 - if (emailInput) emailInput.disabled = false;
3076 - if (nameInput) nameInput.disabled = false;
3077 -
3078 - if (submitButton) {
3079 - const originalHtml = submitButton.getAttribute('data-original-html');
3080 - if (originalHtml) {
3081 - submitButton.innerHTML = originalHtml;
3082 - }
3083 - submitButton.style.opacity = '1';
2641 +
2642 + emailForm.appendChild(errorDiv);
2643 +
2644 + // Add shake animation to inputs
2645 + const emailInput = document.getElementById('user-email');
2646 + const nameInput = document.getElementById('user-name');
2647 +
2648 + if (emailInput) {
2649 + emailInput.classList.add('email-input-shake');
2650 + setTimeout(() => {
2651 + emailInput.classList.remove('email-input-shake');
2652 + }, 500);
3084 2653 }
2654 +
2655 + if (nameInput) {
2656 + nameInput.classList.add('email-input-shake');
2657 + setTimeout(() => {
2658 + nameInput.classList.remove('email-input-shake');
2659 + }, 500);
2660 + }
3085 2661 }
3086 - }
3087 2662
3088 - function showEmailError(botId, message) {
3089 - clearEmailError(botId);
3090 -
3091 - var emailForm = getElementDOM(botId, 'email-collection-form');
3092 - if (!emailForm) return;
3093 -
3094 - const errorDiv = document.createElement('div');
3095 - errorDiv.className = 'email-error';
3096 - errorDiv.style.cssText = `
3097 - color: #e74c3c;
3098 - font-size: 12px;
3099 - margin-top: 8px;
3100 - padding: 4px 0;
3101 - animation: fadeInError 0.3s ease;
3102 - `;
3103 - errorDiv.textContent = message;
3104 - emailForm.appendChild(errorDiv);
3105 -
3106 - // Add shake animation to inputs
3107 - var emailInput = getElementDOM(botId, 'user-email');
3108 - var nameInput = getElementDOM(botId, 'user-name');
3109 -
3110 - if (emailInput) {
3111 - emailInput.classList.add('email-input-shake');
3112 - setTimeout(() => emailInput.classList.remove('email-input-shake'), 500);
3113 - }
3114 - if (nameInput) {
3115 - nameInput.classList.add('email-input-shake');
3116 - setTimeout(() => nameInput.classList.remove('email-input-shake'), 500);
3117 - }
3118 - }
3119 -
3120 - function clearEmailError(botId) {
3121 - var emailForm = getElementDOM(botId, 'email-collection-form');
3122 - if (emailForm) {
2663 + function clearEmailError() {
3123 2664 const existingErrors = emailForm.querySelectorAll('.email-error');
3124 2665 existingErrors.forEach(error => error.remove());
3125 2666 }
3126 - }
3127 2667
3128 - // Resolve email state using server-side data when available, AJAX fallback otherwise
3129 - function resolveEmailState(botId) {
3130 - if (mxchatChat.skip_email_check && mxchatChat.initial_email_state) {
3131 - if (mxchatChat.initial_email_state.show_email_form) {
3132 - showEmailFormForBot(botId);
3133 - } else {
3134 - showChatContainerForBot(botId);
2668 + // MAIN FORM SUBMIT HANDLER - This is the critical fix
2669 + //console.log('Setting up form submit handler...');
2670 +
2671 + // Remove any existing event listeners first
2672 + emailForm.removeEventListener('submit', handleFormSubmit);
2673 +
2674 + // Add the form submit handler
2675 + emailForm.addEventListener('submit', handleFormSubmit);
2676 +
2677 + function handleFormSubmit(event) {
2678 + //console.log('Form submit handler triggered!');
2679 + event.preventDefault();
2680 + event.stopPropagation();
2681 +
2682 + // Prevent double submission
2683 + if (isSubmitting) {
2684 + //console.log('Already submitting, ignoring...');
2685 + return false;
3135 2686 }
3136 - } else {
3137 - checkSessionAndEmailForBot(botId);
3138 - }
3139 - }
3140 2687
3141 - function checkSessionAndEmailForBot(botId) {
3142 - const sessionId = MxChatInstances.ensureSession(botId);
2688 + const userEmail = document.getElementById('user-email').value.trim();
2689 + const nameInput = document.getElementById('user-name');
2690 + const userName = nameInput ? nameInput.value.trim() : '';
2691 + const sessionId = getChatSession();
3143 2692
3144 - // Hide both panels while we check — show loader instead
3145 - var emailBlocker = getElementDOM(botId, 'email-blocker');
3146 - var chatContainer = getElementDOM(botId, 'chat-container');
3147 - if (emailBlocker) emailBlocker.style.display = 'none';
3148 - if (chatContainer) chatContainer.style.display = 'none';
3149 - showInitLoader(botId);
2693 + //console.log('Form data:', { userEmail, userName, sessionId });
3150 2694
3151 - fetch(mxchatChat.ajax_url, {
3152 - method: 'POST',
3153 - headers: {
3154 - 'Content-Type': 'application/x-www-form-urlencoded',
3155 - },
3156 - body: new URLSearchParams({
3157 - action: 'mxchat_check_email_provided',
3158 - session_id: sessionId,
3159 - nonce: mxchatChat.nonce,
3160 - })
3161 - })
3162 - .then((response) => {
3163 - if (!response.ok) {
3164 - throw new Error(`HTTP error! status: ${response.status}`);
2695 + // Validate email before submission
2696 + if (!userEmail) {
2697 + showEmailError('Please enter your email address.');
2698 + return false;
3165 2699 }
3166 - return response.json();
3167 - })
3168 - .then((data) => {
3169 - if (data.success) {
3170 - if (data.data.logged_in || data.data.email) {
3171 - showChatContainerForBot(botId);
3172 - } else {
3173 - showEmailFormForBot(botId);
3174 - }
3175 - } else {
3176 - showEmailFormForBot(botId);
2700 +
2701 + if (!isValidEmail(userEmail)) {
2702 + showEmailError('Please enter a valid email address.');
2703 + return false;
3177 2704 }
3178 - })
3179 - .catch((error) => {
3180 - showEmailFormForBot(botId);
3181 - });
3182 - }
3183 2705
3184 - // Event delegation for email form submission
3185 - $(document).on('submit', '.email-collection-form', function(e) {
3186 - e.preventDefault();
3187 - e.stopPropagation();
2706 + // Validate name if field exists
2707 + if (nameInput && !isValidName(userName)) {
2708 + showEmailError('Please enter a valid name (2-100 characters).');
2709 + return false;
2710 + }
3188 2711
3189 - var botId = getBotIdFromElement(this);
2712 + // Clear any existing errors
2713 + clearEmailError();
2714 + setSubmissionState(true);
3190 2715
3191 - // Prevent double submission
3192 - if (emailSubmittingState[botId]) {
3193 - return false;
3194 - }
2716 + //console.log('Sending AJAX request...');
3195 2717
3196 - var emailInput = getElementDOM(botId, 'user-email');
3197 - var nameInput = getElementDOM(botId, 'user-name');
3198 - var userEmail = emailInput ? emailInput.value.trim() : '';
3199 - var userName = nameInput ? nameInput.value.trim() : '';
3200 - var sessionId = MxChatInstances.ensureSession(botId);
2718 + // Prepare form data with optional name
2719 + const formData = new URLSearchParams({
2720 + action: 'mxchat_handle_save_email_and_response',
2721 + email: userEmail,
2722 + session_id: sessionId,
2723 + nonce: mxchatChat.nonce,
2724 + });
3201 2725
3202 - // Validate email
3203 - if (!userEmail) {
3204 - showEmailError(botId, 'Please enter your email address.');
3205 - return false;
3206 - }
2726 + // Add name to form data if provided
2727 + if (userName) {
2728 + formData.append('name', userName);
2729 + }
3207 2730
3208 - if (!isValidEmailAddress(userEmail)) {
3209 - showEmailError(botId, 'Please enter a valid email address.');
3210 - return false;
3211 - }
2731 + fetch(mxchatChat.ajax_url, {
2732 + method: 'POST',
2733 + headers: {
2734 + 'Content-Type': 'application/x-www-form-urlencoded',
2735 + },
2736 + body: formData
2737 + })
2738 + .then((response) => {
2739 + //console.log('Response received:', response);
2740 + if (!response.ok) {
2741 + throw new Error(`HTTP error! status: ${response.status}`);
2742 + }
2743 + return response.json();
2744 + })
2745 + .then((data) => {
2746 + //console.log('Response data:', data);
2747 + setSubmissionState(false);
2748 +
2749 + if (data.success) {
2750 + // Show chat immediately
2751 + showChatContainer();
3212 2752
3213 - // Validate name if field exists and has content
3214 - if (nameInput && userName && !isValidNameInput(userName)) {
3215 - showEmailError(botId, 'Please enter a valid name (2-100 characters).');
3216 - return false;
2753 + // Handle bot response if provided
2754 + if (data.message && typeof appendMessage === 'function') {
2755 + setTimeout(() => {
2756 + appendMessage('bot', data.message);
2757 + if (typeof scrollToBottom === 'function') {
2758 + scrollToBottom();
2759 + }
2760 + }, 100);
2761 + }
2762 + } else {
2763 + showEmailError(data.message || 'Failed to save email. Please try again.');
2764 + }
2765 + })
2766 + .catch((error) => {
2767 + //console.error('Email submission error:', error);
2768 + setSubmissionState(false);
2769 + showEmailError('An error occurred. Please try again.');
2770 + });
2771 +
2772 + return false; // Extra prevention
3217 2773 }
3218 2774
3219 - clearEmailError(botId);
3220 - setEmailSubmissionState(botId, true);
2775 + // Real-time email validation
2776 + const emailInput = document.getElementById('user-email');
2777 + if (emailInput) {
2778 + let validationTimeout;
2779 +
2780 + emailInput.addEventListener('input', function() {
2781 + // Clear previous validation timeout
2782 + if (validationTimeout) {
2783 + clearTimeout(validationTimeout);
2784 + }
2785 +
2786 + // Debounce validation
2787 + validationTimeout = setTimeout(() => {
2788 + const email = this.value.trim();
2789 + clearEmailError();
2790 +
2791 + if (email && !isValidEmail(email)) {
2792 + showEmailError('Please enter a valid email address.');
2793 + }
2794 + }, 500);
2795 + });
3221 2796
3222 - // Prepare form data
3223 - const formData = new URLSearchParams({
3224 - action: 'mxchat_handle_save_email_and_response',
3225 - email: userEmail,
3226 - session_id: sessionId,
3227 - nonce: mxchatChat.nonce,
3228 - });
3229 -
3230 - if (userName) {
3231 - formData.append('name', userName);
2797 + // Handle Enter key
2798 + emailInput.addEventListener('keypress', function(e) {
2799 + if (e.key === 'Enter' && !isSubmitting) {
2800 + e.preventDefault();
2801 + emailForm.dispatchEvent(new Event('submit'));
2802 + }
2803 + });
3232 2804 }
3233 2805
3234 - fetch(mxchatChat.ajax_url, {
3235 - method: 'POST',
3236 - headers: {
3237 - 'Content-Type': 'application/x-www-form-urlencoded',
3238 - },
3239 - body: formData
3240 - })
3241 - .then((response) => {
3242 - if (!response.ok) {
3243 - throw new Error(`HTTP error! status: ${response.status}`);
3244 - }
3245 - return response.json();
3246 - })
3247 - .then((data) => {
3248 - setEmailSubmissionState(botId, false);
3249 -
3250 - if (data.success) {
3251 - showChatContainerForBot(botId);
3252 -
3253 - // Replace {visitor_name} placeholder in intro message with actual name
3254 - if (userName) {
3255 - replaceVisitorNamePlaceholder(botId, userName);
3256 - } else {
3257 - // Remove placeholder if no name provided
3258 - replaceVisitorNamePlaceholder(botId, '');
2806 + // Real-time name validation
2807 + const nameInput = document.getElementById('user-name');
2808 + if (nameInput) {
2809 + let nameValidationTimeout;
2810 +
2811 + nameInput.addEventListener('input', function() {
2812 + // Clear previous validation timeout
2813 + if (nameValidationTimeout) {
2814 + clearTimeout(nameValidationTimeout);
3259 2815 }
2816 +
2817 + // Debounce validation
2818 + nameValidationTimeout = setTimeout(() => {
2819 + const name = this.value.trim();
2820 + clearEmailError();
2821 +
2822 + if (name && !isValidName(name)) {
2823 + showEmailError('Name must be between 2 and 100 characters.');
2824 + }
2825 + }, 500);
2826 + });
3260 2827
3261 - if (data.message && typeof appendMessage === 'function') {
3262 - setTimeout(() => {
3263 - appendMessage('bot', data.message, '', [], false, botId);
3264 - if (typeof scrollToBottom === 'function') {
3265 - scrollToBottom(botId);
3266 - }
3267 - }, 100);
2828 + // Handle Enter key
2829 + nameInput.addEventListener('keypress', function(e) {
2830 + if (e.key === 'Enter' && !isSubmitting) {
2831 + e.preventDefault();
2832 + emailForm.dispatchEvent(new Event('submit'));
3268 2833 }
3269 - } else {
3270 - showEmailError(botId, data.message || 'Failed to save email. Please try again.');
3271 - }
3272 - })
3273 - .catch((error) => {
3274 - setEmailSubmissionState(botId, false);
3275 - showEmailError(botId, 'An error occurred. Please try again.');
3276 - });
3277 -
3278 - return false;
3279 - });
3280 -
3281 - // Real-time email validation using event delegation
3282 - $(document).on('input', '.mxchat-email-input', function() {
3283 - var botId = getBotIdFromElement(this);
3284 - var $input = $(this);
3285 -
3286 - // Clear previous timeout
3287 - clearTimeout($input.data('validationTimeout'));
3288 -
3289 - // Debounce validation
3290 - var timeout = setTimeout(() => {
3291 - var email = this.value.trim();
3292 - clearEmailError(botId);
3293 -
3294 - if (email && !isValidEmailAddress(email)) {
3295 - showEmailError(botId, 'Please enter a valid email address.');
3296 - }
3297 - }, 500);
3298 -
3299 - $input.data('validationTimeout', timeout);
3300 - });
3301 -
3302 - // Handle Enter key in email input
3303 - $(document).on('keypress', '.mxchat-email-input', function(e) {
3304 - if (e.key === 'Enter') {
3305 - e.preventDefault();
3306 - var botId = getBotIdFromElement(this);
3307 - if (!emailSubmittingState[botId]) {
3308 - $(this).closest('.email-collection-form').submit();
3309 - }
2834 + });
3310 2835 }
3311 - });
3312 2836
3313 - // Handle Enter key in name input
3314 - $(document).on('keypress', '.mxchat-name-input', function(e) {
3315 - if (e.key === 'Enter') {
3316 - e.preventDefault();
3317 - var botId = getBotIdFromElement(this);
3318 - if (!emailSubmittingState[botId]) {
3319 - $(this).closest('.email-collection-form').submit();
2837 + // Initial state check
2838 + if (mxchatChat.skip_email_check && mxchatChat.initial_email_state) {
2839 + //console.log('Using server-provided email state:', mxchatChat.initial_email_state);
2840 +
2841 + const emailState = mxchatChat.initial_email_state;
2842 + if (emailState.show_email_form) {
2843 + showEmailForm();
2844 + } else {
2845 + showChatContainer();
3320 2846 }
2847 + } else {
2848 + // Check email status via AJAX
2849 + setTimeout(checkSessionAndEmail, 100);
3321 2850 }
3322 - });
3323 2851
3324 - // Initialize email check for all bot instances
3325 - // For floating bots: defer until widget is opened (zero passive AJAX)
3326 - // For embedded bots: check immediately since the form is visible
3327 - $('.mxchat-chatbot-wrapper').each(function() {
3328 - var botId = $(this).data('bot-id') || 'default';
3329 - var emailBlocker = getElementDOM(botId, 'email-blocker');
3330 -
3331 - if (emailBlocker) {
3332 - if (isEmbeddedBot(botId)) {
3333 - // Embedded bots are always visible — check now
3334 - resolveEmailState(botId);
3335 - }
3336 - // Floating bots: handled in the widget open handler
3337 - } else if (isEmbeddedBot(botId)) {
3338 - // Embedded bot, no email collection — load history with loader
3339 - var chatPersistenceEnabled = typeof mxchatChat !== 'undefined' && mxchatChat.chat_persistence_toggle === 'on';
3340 - if (chatPersistenceEnabled) {
3341 - MxChatInstances.ensureSession(botId);
3342 - showChatContainerForBot(botId);
3343 - }
2852 + // Check if email exists for the current session
2853 + function checkSessionAndEmail() {
2854 + const sessionId = getChatSession();
2855 +
2856 + fetch(mxchatChat.ajax_url, {
2857 + method: 'POST',
2858 + headers: {
2859 + 'Content-Type': 'application/x-www-form-urlencoded',
2860 + },
2861 + body: new URLSearchParams({
2862 + action: 'mxchat_check_email_provided',
2863 + session_id: sessionId,
2864 + nonce: mxchatChat.nonce,
2865 + })
2866 + })
2867 + .then((response) => {
2868 + if (!response.ok) {
2869 + throw new Error(`HTTP error! status: ${response.status}`);
2870 + }
2871 + return response.json();
2872 + })
2873 + .then((data) => {
2874 + if (data.success) {
2875 + if (data.data.logged_in || data.data.email) {
2876 + showChatContainer();
2877 + } else {
2878 + showEmailForm();
2879 + }
2880 + } else {
2881 + // On error, default to showing email form
2882 + showEmailForm();
2883 + }
2884 + })
2885 + .catch((error) => {
2886 + //console.warn('Email check failed, defaulting to email form:', error);
2887 + showEmailForm();
2888 + });
3344 2889 }
3345 - });
2890 +
2891 + } else {
2892 + console.error('Email collection is enabled but essential elements are missing:', {
2893 + emailForm: !!emailForm,
2894 + emailBlocker: !!emailBlocker,
2895 + chatbotWrapper: !!chatbotWrapper
2896 + });
2897 + }
2898 +} else {
2899 + //console.log('Email collection is disabled');
3346 2900 }
3347 2901
3348 - // Open chatbot when pre-chat message is clicked - use class selector for multi-instance
3349 - $(document).on('click', '.pre-chat-message', function() {
3350 - var botId = getBotIdFromElement(this);
3351 - var $chatbot = getElement(botId, 'floating-chatbot');
3352 - if ($chatbot.hasClass('hidden')) {
3353 - $chatbot.removeClass('hidden').addClass('visible');
3354 - getElement(botId, 'floating-chatbot-button').addClass('hidden');
3355 - handlePreChatDismissal(botId);
2902 + // Open chatbot when pre-chat message is clicked
2903 + $(document).on('click', '#pre-chat-message', function() {
2904 + var chatbot = $('#floating-chatbot');
2905 + if (chatbot.hasClass('hidden')) {
2906 + chatbot.removeClass('hidden').addClass('visible');
2907 + $('#floating-chatbot-button').addClass('hidden');
2908 + $('#pre-chat-message').fadeOut(250); // Hide pre-chat message
3356 2909 disableScroll(); // Disable scroll when chatbot opens
3357 -
3358 - // Load chat history for returning visitors (persistence)
3359 - var chatPersistenceEnabled = typeof mxchatChat !== 'undefined' && mxchatChat.chat_persistence_toggle === 'on';
3360 - if (chatPersistenceEnabled) {
3361 - MxChatInstances.ensureSession(botId);
3362 - }
3363 -
3364 - // Deferred email check — only on first widget open
3365 - var emailBlocker = getElementDOM(botId, 'email-blocker');
3366 - var instance = MxChatInstances.get(botId);
3367 - if (emailBlocker && !instance.emailCheckDone) {
3368 - instance.emailCheckDone = true;
3369 - resolveEmailState(botId);
3370 - } else if (!emailBlocker) {
3371 - showChatContainerForBot(botId);
3372 - }
3373 2910 }
3374 2911 });
3375 2912
3376 - // Legacy duplicate close handler removed — handled by single event delegation above
2913 + var closeButton = document.querySelector('.close-pre-chat-message');
2914 + if (closeButton) {
2915 + closeButton.addEventListener('click', function() {
2916 + $('#pre-chat-message').fadeOut(200); // Hide the message
3377 2917
2918 + // Send an AJAX request to set the transient flag for 24 hours
2919 + $.ajax({
2920 + url: mxchatChat.ajax_url,
2921 + type: 'POST',
2922 + data: {
2923 + action: 'mxchat_dismiss_pre_chat_message',
2924 + _ajax_nonce: mxchatChat.nonce
2925 + },
2926 + success: function() {
2927 + //console.log('Pre-chat message dismissed for 24 hours.');
3378 2928
3379 -function hasQuickQuestions(botId) {
3380 - botId = botId || 'default';
3381 - var questionsContainer = getElementDOM(botId, 'mxchat-popular-questions');
3382 - if (!questionsContainer) return false;
3383 - const questionButtons = questionsContainer.querySelectorAll('.mxchat-popular-question');
2929 + // Ensure the message is hidden after dismissal
2930 + $('#pre-chat-message').hide();
2931 + },
2932 + error: function() {
2933 + //console.error('Failed to dismiss pre-chat message.');
2934 + }
2935 + });
2936 + });
2937 + }
2938 +
2939 +
2940 +function hasQuickQuestions() {
2941 + const questionButtons = document.querySelectorAll('#mxchat-popular-questions .mxchat-popular-question');
3384 2942 return questionButtons.length > 0;
3385 2943 }
3386 2944
3387 -/**
3388 - * Check if a bot is embedded (not floating)
3389 - * Embedded bots don't have a .floating-chatbot wrapper
3390 - */
3391 -function isEmbeddedBot(botId) {
3392 - botId = botId || 'default';
3393 - var floatingWrapper = document.getElementById('floating-chatbot-' + botId);
3394 - return !floatingWrapper;
3395 -}
3396 -
3397 -function collapseQuickQuestions(botId) {
3398 - botId = botId || 'default';
3399 - const questionsContainer = getElementDOM(botId, 'mxchat-popular-questions');
3400 - if (questionsContainer && hasQuickQuestions(botId)) {
2945 +function collapseQuickQuestions() {
2946 + const questionsContainer = document.getElementById('mxchat-popular-questions');
2947 + if (questionsContainer && hasQuickQuestions()) {
3401 2948 questionsContainer.classList.add('collapsed');
3402 2949 questionsContainer.classList.add('has-been-collapsed');
3403 2950 try {
3404 - sessionStorage.setItem('mxchat_questions_collapsed_' + botId, 'true');
3405 - sessionStorage.setItem('mxchat_questions_has_been_collapsed_' + botId, 'true');
2951 + sessionStorage.setItem('mxchat_questions_collapsed', 'true');
2952 + sessionStorage.setItem('mxchat_questions_has_been_collapsed', 'true');
3406 2953 } catch (e) {
3407 2954 // Ignore if sessionStorage is not available
3408 2955 }
3409 2956 }
@@ -3408,15 +2955,14 @@
3408 2955 }
3409 2956 }
3410 2957 }
3411 2958
3412 -function expandQuickQuestions(botId) {
3413 - botId = botId || 'default';
3414 - const questionsContainer = getElementDOM(botId, 'mxchat-popular-questions');
3415 - if (questionsContainer && hasQuickQuestions(botId)) {
2959 +function expandQuickQuestions() {
2960 + const questionsContainer = document.getElementById('mxchat-popular-questions');
2961 + if (questionsContainer && hasQuickQuestions()) {
3416 2962 questionsContainer.classList.remove('collapsed');
3417 2963 try {
3418 - sessionStorage.setItem('mxchat_questions_collapsed_' + botId, 'false');
2964 + sessionStorage.setItem('mxchat_questions_collapsed', 'false');
3419 2965 } catch (e) {
3420 2966 // Ignore if sessionStorage is not available
3421 2967 }
3422 2968 }
@@ -3421,24 +2967,18 @@
3421 2967 }
3422 2968 }
3423 2969 }
3424 2970
3425 -function checkQuickQuestionsState(botId) {
3426 - botId = botId || 'default';
3427 - if (!hasQuickQuestions(botId)) {
2971 +function checkQuickQuestionsState() {
2972 + if (!hasQuickQuestions()) {
3428 2973 return; // Don't do anything if no questions exist
3429 2974 }
3430 -
3431 - // Skip restoring collapsed state for embedded bots - they should always start expanded
3432 - if (isEmbeddedBot(botId)) {
3433 - return;
3434 - }
3435 -
2975 +
3436 2976 try {
3437 - const isCollapsed = sessionStorage.getItem('mxchat_questions_collapsed_' + botId);
3438 - const hasBeenCollapsed = sessionStorage.getItem('mxchat_questions_has_been_collapsed_' + botId);
3439 -
3440 - const questionsContainer = getElementDOM(botId, 'mxchat-popular-questions');
2977 + const isCollapsed = sessionStorage.getItem('mxchat_questions_collapsed');
2978 + const hasBeenCollapsed = sessionStorage.getItem('mxchat_questions_has_been_collapsed');
2979 +
2980 + const questionsContainer = document.getElementById('mxchat-popular-questions');
3441 2981 if (questionsContainer) {
3442 2982 if (hasBeenCollapsed === 'true') {
3443 2983 questionsContainer.classList.add('has-been-collapsed');
3444 2984 }
@@ -3451,36 +2991,32 @@
3451 2991 }
3452 2992 }
3453 2993
3454 2994 // Global delegation for dynamically added links as fallback
3455 -// Use class selector for multi-instance support
3456 -$(document).on('click', '.chat-box a[href]:not([data-tracked])', function(e) {
2995 +$(document).on('click', '#chat-box a[href]:not([data-tracked])', function(e) {
3457 2996 const $link = $(this);
3458 2997 const messageDiv = $link.closest('.bot-message, .agent-message');
3459 -
2998 +
3460 2999 // Only process bot/agent message links
3461 3000 if (messageDiv.length > 0) {
3462 3001 const originalHref = $link.attr('href');
3463 -
3002 +
3464 3003 if (originalHref && (originalHref.startsWith('http://') || originalHref.startsWith('https://'))) {
3465 3004 e.preventDefault();
3466 3005 e.stopPropagation();
3467 -
3006 +
3468 3007 // Mark as tracked
3469 3008 $link.attr('data-tracked', 'true');
3470 -
3471 - // Get bot ID from the chat box context
3472 - var botId = getBotIdFromElement(this);
3473 -
3009 +
3474 3010 // Get message context from the message div
3475 3011 const messageText = messageDiv.text().substring(0, 200);
3476 -
3012 +
3477 3013 $.ajax({
3478 3014 url: mxchatChat.ajax_url,
3479 3015 type: 'POST',
3480 3016 data: {
3481 3017 action: 'mxchat_track_url_click',
3482 - session_id: getChatSession(botId),
3018 + session_id: getChatSession(),
3483 3019 url: originalHref,
3484 3020 message_context: messageText,
3485 3021 nonce: mxchatChat.nonce
3486 3022 },
@@ -3491,57 +3027,49 @@
3491 3027 window.location.href = originalHref;
3492 3028 }
3493 3029 }
3494 3030 });
3495 -
3031 +
3496 3032 return false;
3497 3033 }
3498 3034 }
3499 3035 });
3500 3036
3501 - // ====================================
3502 - // MAIN INITIALIZATION
3503 - // ====================================
3037 +
3038 +
3039 +
3040 +// ====================================
3041 +// MAIN INITIALIZATION
3042 +// ====================================
3504 3043
3505 - // Initialize all chatbot instances on the page
3506 - initializeAllInstances();
3044 +if ($('#floating-chatbot').hasClass('hidden')) {
3045 + $('#floating-chatbot-button').removeClass('hidden');
3046 +}
3047 +// Initialize when document is ready
3048 +setFullHeight();
3049 +trackOriginatingPage();
3507 3050
3508 - // Legacy initialization for single bot compatibility
3509 - $('.floating-chatbot.hidden').each(function() {
3510 - var botId = getBotIdFromElement(this);
3511 - getElement(botId, 'floating-chatbot-button').removeClass('hidden');
3512 - });
3051 +// Only load chat history if email collection is disabled
3052 +if (mxchatChat.email_collection_enabled !== 'on') {
3053 + loadChatHistory();
3054 +}
3513 3055
3514 - // Initialize when document is ready
3515 - setFullHeight();
3056 +initializeChatVisibility();
3516 3057
3517 - // Note: trackOriginatingPage() and loadChatHistory() are now deferred
3518 - // until the user's first interaction via MxChatInstances.ensureSession()
3519 -
3520 - // Initialize chat visibility for all instances
3521 - $('.mxchat-chatbot-wrapper').each(function() {
3522 - var botId = $(this).data('bot-id') || 'default';
3523 - initializeChatVisibility(botId);
3524 - });
3525 -
3526 - // Make functions globally available for add-ons
3527 - window.hasQuickQuestions = hasQuickQuestions;
3528 - window.collapseQuickQuestions = collapseQuickQuestions;
3529 - window.appendMessage = appendMessage;
3530 - window.appendThinkingMessage = appendThinkingMessage;
3531 - window.scrollToBottom = scrollToBottom;
3532 - window.scrollElementToTop = scrollElementToTop;
3533 - window.replaceLastMessage = replaceLastMessage;
3534 - window.callMxChat = callMxChat;
3535 - window.callMxChatStream = callMxChatStream;
3536 - window.shouldUseStreaming = shouldUseStreaming;
3537 - window.getChatSession = getChatSession;
3538 - window.getPageContext = getPageContext;
3539 - window.updateStreamingMessage = updateStreamingMessage;
3540 - window.MxChatInstances = MxChatInstances;
3541 - window.getElement = getElement;
3542 - window.getElementDOM = getElementDOM;
3543 - window.getBotIdFromElement = getBotIdFromElement;
3058 +// Make functions globally available for add-ons
3059 +window.hasQuickQuestions = hasQuickQuestions;
3060 +window.collapseQuickQuestions = collapseQuickQuestions;
3061 +window.appendMessage = appendMessage;
3062 +window.appendThinkingMessage = appendThinkingMessage;
3063 +window.scrollToBottom = scrollToBottom;
3064 +window.scrollElementToTop = scrollElementToTop;
3065 +window.replaceLastMessage = replaceLastMessage;
3066 +window.callMxChat = callMxChat;
3067 +window.callMxChatStream = callMxChatStream;
3068 +window.shouldUseStreaming = shouldUseStreaming;
3069 +window.getChatSession = getChatSession;
3070 +window.getPageContext = getPageContext;
3071 +window.updateStreamingMessage = updateStreamingMessage;
3544 3072
3545 3073 }); // End of jQuery ready
3546 3074
3547 3075