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