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