PluginProbe
MxChat – AI Chatbot & Content Generation for WordPress / 2.6.3
MxChat – AI Chatbot & Content Generation for WordPress v2.6.3
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 +892 -1751 3.2.5 → 2.6.3 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,61 @@
227 11 var botMessageBgColor = mxchatChat.bot_message_bg_color;
228 12 var botMessageFontColor = mxchatChat.bot_message_font_color;
229 13 var liveAgentMessageBgColor = mxchatChat.live_agent_message_bg_color;
230 14 var liveAgentMessageFontColor = mxchatChat.live_agent_message_font_color;
231 -
15 +
232 16 var linkTarget = mxchatChat.link_target_toggle === 'on' ? '_blank' : '_self';
17 + let lastSeenMessageId = '';
18 + let notificationCheckInterval;
19 + let notificationBadge;
20 + var sessionId = getChatSession();
21 + let pollingInterval;
22 + let processedMessageIds = new Set();
23 + let activePdfFile = null;
24 + let activeWordFile = null;
25 + let chatHistoryLoaded = false;
233 26
234 27 // ====================================
235 - // SESSION MANAGEMENT (Legacy compatibility)
28 + // SESSION MANAGEMENT
236 29 // ====================================
30 +
31 + function getChatSession() {
32 + var sessionId = getCookie('mxchat_session_id');
237 33
34 + if (!sessionId) {
35 + sessionId = generateSessionId();
36 + setChatSession(sessionId);
37 + }
38 +
39 + return sessionId;
40 + }
41 +
42 + function setChatSession(sessionId) {
43 + // Set the cookie with a 24-hour expiration (86400 seconds)
44 + document.cookie = "mxchat_session_id=" + sessionId + "; path=/; max-age=86400; SameSite=Lax";
45 + }
46 +
238 47 function getCookie(name) {
239 48 let value = "; " + document.cookie;
240 49 let parts = value.split("; " + name + "=");
241 50 if (parts.length == 2) return parts.pop().split(";").shift();
242 51 }
243 -
52 +
244 53 function generateSessionId() {
245 54 return 'mxchat_chat_' + Math.random().toString(36).substr(2, 9);
246 55 }
247 56
248 - // Legacy function - now delegates to instance manager
249 - function getChatSession(botId) {
250 - botId = botId || 'default';
251 - return MxChatInstances.getChatSession(botId);
57 + function resetChatSession() {
58 + // Generate a new session ID
59 + var newSessionId = generateSessionId();
60 + // Update the cookie with the new session
61 + setChatSession(newSessionId);
62 + // Clear the chat history display
63 + $('.mxchat-messages').empty();
64 + // Reset the chat history loaded flag
65 + chatHistoryLoaded = false;
252 66 }
253 67
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 68 // ====================================
288 69 // CONTEXTUAL AWARENESS FUNCTIONALITY
289 70 // ====================================
290 71
@@ -431,12 +212,11 @@
431 212 // CORE CHAT FUNCTIONALITY
432 213 // ====================================
433 214
434 215 // 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');
216 +function disableChatInput() {
217 + var chatInput = document.getElementById('chat-input');
218 + var sendButton = document.getElementById('send-button');
439 219 if (chatInput) {
440 220 chatInput.disabled = true;
441 221 chatInput.style.opacity = '0.6';
442 222 }
@@ -446,12 +226,11 @@
446 226 sendButton.style.pointerEvents = 'none';
447 227 }
448 228 }
449 229
450 -function enableChatInput(botId) {
451 - botId = botId || 'default';
452 - var chatInput = getElementDOM(botId, 'chat-input');
453 - var sendButton = getElementDOM(botId, 'send-button');
230 +function enableChatInput() {
231 + var chatInput = document.getElementById('chat-input');
232 + var sendButton = document.getElementById('send-button');
454 233 if (chatInput) {
455 234 chatInput.disabled = false;
456 235 chatInput.style.opacity = '1';
457 236 chatInput.focus();
@@ -463,13 +242,10 @@
463 242 }
464 243 }
465 244
466 245 // 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();
246 +function sendMessage() {
247 + var message = $('#chat-input').val();
472 248
473 249 // ADD PROMPT HOOK HERE
474 250 if (typeof customMxChatFilter === 'function') {
475 251 message = customMxChatFilter(message, "prompt");
@@ -475,77 +251,66 @@
475 251 message = customMxChatFilter(message, "prompt");
476 252 }
477 253
478 254 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 - }
255 + // Disable input while waiting for response
256 + disableChatInput();
485 257
486 - appendMessage("user", message, '', [], false, botId);
487 - $chatInput.val('');
488 - $chatInput.css('height', 'auto');
258 + appendMessage("user", message);
259 + $('#chat-input').val('');
260 + $('#chat-input').css('height', 'auto');
489 261
490 - if (hasQuickQuestions(botId)) {
491 - collapseQuickQuestions(botId);
262 + if (hasQuickQuestions()) {
263 + collapseQuickQuestions();
492 264 }
493 - appendThinkingMessage(botId);
494 - scrollToBottom(botId);
265 + appendThinkingMessage();
266 + scrollToBottom();
495 267
496 - const currentModel = mxchatChat.model || 'gpt-5.1-chat-latest';
268 + const currentModel = mxchatChat.model || 'gpt-4o';
497 269
498 270 // Check if streaming is enabled AND supported for this model
499 271 if (shouldUseStreaming(currentModel)) {
500 272 callMxChatStream(message, function(response) {
501 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').removeClass('temporary-message');
502 - }, botId);
273 + $('.bot-message.temporary-message').removeClass('temporary-message');
274 + });
503 275 } else {
504 276 callMxChat(message, function(response) {
505 - replaceLastMessage("bot", response, '', [], botId);
506 - }, botId);
277 + replaceLastMessage("bot", response);
278 + });
507 279 }
508 280 }
509 281 }
510 282
511 283 // Update your existing sendMessageToChatbot function
512 -function sendMessageToChatbot(message, botId) {
513 - botId = botId || 'default';
514 - MxChatInstances.ensureSession(botId);
515 -
284 +function sendMessageToChatbot(message) {
516 285 // ADD PROMPT HOOK HERE
517 286 if (typeof customMxChatFilter === 'function') {
518 287 message = customMxChatFilter(message, "prompt");
519 288 }
520 289
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);
526 - }
290 + // Disable input while waiting for response
291 + disableChatInput();
527 292
528 - var sessionId = getChatSession(botId);
293 + var sessionId = getChatSession();
529 294
530 - if (hasQuickQuestions(botId)) {
531 - collapseQuickQuestions(botId);
295 + if (hasQuickQuestions()) {
296 + collapseQuickQuestions();
532 297 }
533 - appendThinkingMessage(botId);
534 - scrollToBottom(botId);
298 + appendThinkingMessage();
299 + scrollToBottom();
535 300
536 - const currentModel = mxchatChat.model || 'gpt-5.1-chat-latest';
301 + const currentModel = mxchatChat.model || 'gpt-4o';
537 302
538 303 // Check if streaming is enabled AND supported for this model
539 304 if (shouldUseStreaming(currentModel)) {
540 305 callMxChatStream(message, function(response) {
541 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').removeClass('temporary-message');
542 - }, botId);
306 + $('.bot-message.temporary-message').removeClass('temporary-message');
307 + });
543 308 } else {
544 309 callMxChat(message, function(response) {
545 - getElement(botId, 'chat-box').find('.temporary-message').remove();
546 - replaceLastMessage("bot", response, '', [], botId);
547 - }, botId);
310 + $('.temporary-message').remove();
311 + replaceLastMessage("bot", response);
312 + });
548 313 }
549 314 }
550 315
551 316 // Updated shouldUseStreaming function with debugging
@@ -588,53 +353,33 @@
588 353 updateChatModeIndicator('agent');
589 354 }
590 355 }
591 356
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');
357 +//Function to get bot ID from the chatbot wrapper
358 +function getMxChatBotId() {
359 + const chatbotWrapper = document.getElementById('mxchat-chatbot-wrapper');
601 360 return chatbotWrapper ? chatbotWrapper.getAttribute('data-bot-id') || 'default' : 'default';
602 361 }
603 362
604 -function callMxChat(message, callback, botId) {
605 - botId = botId || getMxChatBotId();
606 -
363 +function callMxChat(message, callback) {
607 364 // 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);
365 + $('.mxchat-input-holder textarea').data('pending-message', message);
609 366
610 367 // Get page context if contextual awareness is enabled
611 368 const pageContext = getPageContext();
612 369
613 - // Get instance for session start timestamp (used when persistence is OFF)
614 - var instance = MxChatInstances.get(botId);
370 + // Get bot ID
371 + const botId = getMxChatBotId();
615 372
616 - // Guarantee a non-null session_id before the AJAX leaves. ensureSession() is idempotent
617 - // and returns the guaranteed-present session id from the in-memory instance even when
618 - // cookie/localStorage writes are silently blocked by the browser.
619 - var sessionId = MxChatInstances.ensureSession(botId);
620 - if (!sessionId || sessionId === 'null' || sessionId === 'undefined') {
621 - // Last-resort generation to ensure we never POST a null marker.
622 - sessionId = generateSessionId();
623 - MxChatInstances.setChatSession(botId, sessionId);
624 - }
625 -
626 373 // Prepare AJAX data
627 374 const ajaxData = {
628 375 action: 'mxchat_handle_chat_request',
629 376 message: message,
630 - session_id: sessionId,
377 + session_id: getChatSession(),
631 378 nonce: mxchatChat.nonce,
632 379 current_page_url: window.location.href,
633 380 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
381 + bot_id: botId // Include bot ID
637 382 };
638 383
639 384 // Add page context if available
640 385 if (pageContext) {
@@ -659,14 +404,14 @@
659 404 data: ajaxData,
660 405 success: function(response) {
661 406 // IMMEDIATE CHAT MODE UPDATE - This should be FIRST
662 407 if (response.chat_mode) {
663 - updateChatModeIndicator(response.chat_mode, botId);
408 + updateChatModeIndicator(response.chat_mode);
664 409 }
665 410
666 411 // Also check in data property if response is wrapped
667 412 if (response.data && response.data.chat_mode) {
668 - updateChatModeIndicator(response.data.chat_mode, botId);
413 + updateChatModeIndicator(response.data.chat_mode);
669 414 }
670 415
671 416 // SECURITY FIX: Check for errors FIRST before checking for success
672 417 // This ensures API errors (quota exceeded, invalid key, rate limit) are properly displayed
@@ -690,24 +435,31 @@
690 435 errorMessage = "An error occurred. Please try again or contact support.";
691 436 }
692 437
693 438 // Handle session reset action (IP changed, session expired, etc.)
694 - // Silent reset — keep chat UI intact, just get a new session and retry
695 439 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');
440 + // Clear the old session and generate a new one
441 + resetChatSession();
442 + // Remove the temporary loading message
443 + $('.bot-message.temporary-message').remove();
444 + // Re-send the original message with the new session
445 + var originalMessage = $('.mxchat-input-holder textarea').data('pending-message');
699 446 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';
447 + $('.mxchat-input-holder textarea').data('pending-message', null);
448 + // Re-add the user message and thinking indicator
449 + appendMessage("user", originalMessage);
450 + appendThinkingMessage();
451 + scrollToBottom();
452 + // Determine whether to use streaming
453 + const currentModel = mxchatChat.model || 'gpt-4o';
702 454 if (shouldUseStreaming(currentModel)) {
703 455 callMxChatStream(originalMessage, function(response) {
704 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').removeClass('temporary-message');
705 - }, botId);
456 + $('.bot-message.temporary-message').removeClass('temporary-message');
457 + });
706 458 } else {
707 459 callMxChat(originalMessage, function(response) {
708 - replaceLastMessage("bot", response, '', [], botId);
709 - }, botId);
460 + replaceLastMessage("bot", response);
461 + });
710 462 }
711 463 }
712 464 return;
713 465 }
@@ -720,9 +472,9 @@
720 472 // For admin users, show more technical details including error code
721 473 displayMessage = errorMessage + (errorCode ? " (Error code: " + errorCode + ")" : "");
722 474 }
723 475
724 - replaceLastMessage("bot", displayMessage, '', [], botId);
476 + replaceLastMessage("bot", displayMessage);
725 477 return; // Exit early for errors
726 478 }
727 479
728 480 // NOW check if this is a successful response by looking for text, html, or message fields
@@ -738,17 +490,16 @@
738 490 let responseMessage = response.message || '';
739 491
740 492 // Add PDF filename handling
741 493 if (response.data && response.data.filename) {
742 - showActivePdf(response.data.filename, botId);
743 - var instance = MxChatInstances.get(botId);
744 - instance.activePdfFile = response.data.filename;
494 + showActivePdf(response.data.filename);
495 + activePdfFile = response.data.filename;
745 496 }
746 497
747 498 // Add redirect check here
748 499 if (response.redirect_url) {
749 500 if (responseText) {
750 - replaceLastMessage("bot", responseText, '', [], botId);
501 + replaceLastMessage("bot", responseText);
751 502 }
752 503 setTimeout(() => {
753 504 window.location.href = response.redirect_url;
754 505 }, 1500);
@@ -756,11 +507,9 @@
756 507 }
757 508
758 509 // Check for live agent response
759 510 if (response.success && response.data && response.data.status === 'waiting_for_agent') {
760 - removeThinkingDots(botId);
761 - updateChatModeIndicator('agent', botId);
762 - enableChatInput(botId);
511 + updateChatModeIndicator('agent');
763 512 return;
764 513 }
765 514
766 515 // Handle the message and show notification if chat is hidden
@@ -775,36 +524,30 @@
775 524 }
776 525
777 526 // Update the messages as before
778 527 if (responseText && responseHtml) {
779 - replaceLastMessage("bot", responseText, responseHtml, [], botId);
528 + replaceLastMessage("bot", responseText, responseHtml);
780 529 } else if (responseText) {
781 - replaceLastMessage("bot", responseText, '', [], botId);
530 + replaceLastMessage("bot", responseText);
782 531 } else if (responseHtml) {
783 - replaceLastMessage("bot", "", responseHtml, [], botId);
532 + replaceLastMessage("bot", "", responseHtml);
784 533 } else if (responseMessage) {
785 - replaceLastMessage("bot", responseMessage, '', [], botId);
534 + replaceLastMessage("bot", responseMessage);
786 535 }
787 536
788 537 // 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();
538 + if ($('#floating-chatbot').hasClass('hidden')) {
539 + const badge = $('#chat-notification-badge');
540 + if (badge.length) {
541 + badge.show();
794 542 }
795 543 }
796 544 } 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);
545 + replaceLastMessage("bot", "I received an empty response. Please try again or contact support if this persists.");
802 546 }
803 547
804 548 if (response.message_id) {
805 - var instance = MxChatInstances.get(botId);
806 - instance.lastSeenMessageId = response.message_id;
549 + lastSeenMessageId = response.message_id;
807 550 }
808 551
809 552 return;
810 553 }
@@ -809,9 +552,9 @@
809 552 return;
810 553 }
811 554
812 555 // Fallback for truly unexpected response formats
813 - replaceLastMessage("bot", "Unexpected response format. Please try again or contact support.", '', [], botId);
556 + replaceLastMessage("bot", "Unexpected response format. Please try again or contact support.");
814 557 },
815 558 error: function(xhr, status, error) {
816 559 let errorMessage = "An unexpected error occurred.";
817 560
@@ -838,52 +581,38 @@
838 581 errorMessage = "Server error: The server encountered an issue. Please try again later.";
839 582 }
840 583 }
841 584
842 - replaceLastMessage("bot", errorMessage, '', [], botId);
585 + replaceLastMessage("bot", errorMessage);
843 586 }
844 587 });
845 588 }
846 589
847 -function callMxChatStream(message, callback, botId) {
848 - botId = botId || getMxChatBotId();
849 -
590 +function callMxChatStream(message, callback) {
850 591 // 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);
592 + $('.mxchat-input-holder textarea').data('pending-message', message);
852 593
853 - const currentModel = mxchatChat.model || 'gpt-5.1-chat-latest';
594 + const currentModel = mxchatChat.model || 'gpt-4o';
854 595 if (!isStreamingSupported(currentModel)) {
855 - callMxChat(message, callback, botId);
596 + callMxChat(message, callback);
856 597 return;
857 598 }
858 599
859 600 // Get page context if contextual awareness is enabled
860 601 const pageContext = getPageContext();
602 +
603 + // Get bot ID
604 + const botId = getMxChatBotId();
861 605
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 606 const formData = new FormData();
876 607 formData.append('action', 'mxchat_stream_chat');
877 608 formData.append('message', message);
878 - formData.append('session_id', streamSessionId);
609 + formData.append('session_id', getChatSession());
879 610 formData.append('nonce', mxchatChat.nonce);
880 611 formData.append('current_page_url', window.location.href);
881 612 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 -
613 + formData.append('bot_id', botId); // Include bot ID
614 +
886 615 // Add page context if available
887 616 if (pageContext) {
888 617 formData.append('page_context', JSON.stringify(pageContext));
889 618 }
@@ -926,9 +655,9 @@
926 655 if (contentType && contentType.includes('application/json')) {
927 656 return responseClone.json().then(data => {
928 657 // IMMEDIATE CHAT MODE UPDATE for JSON response
929 658 if (data.chat_mode) {
930 - updateChatModeIndicator(data.chat_mode, botId);
659 + updateChatModeIndicator(data.chat_mode);
931 660 }
932 661
933 662 // Check for testing panel
934 663 if (window.mxchatTestPanelInstance && data.testing_data) {
@@ -935,9 +664,9 @@
935 664 window.mxchatTestPanelInstance.handleTestingData(data.testing_data);
936 665 }
937 666
938 667 // Handle the JSON response directly
939 - handleNonStreamResponse(data, callback, botId);
668 + handleNonStreamResponse(data, callback);
940 669 return Promise.resolve(); // Prevent further processing
941 670 });
942 671 }
943 672
@@ -955,37 +684,26 @@
955 684 responseClone.text().then(text => {
956 685 try {
957 686 const data = JSON.parse(text);
958 687 if (data.text || data.message || data.html) {
959 - handleNonStreamResponse(data, callback, botId);
688 + handleNonStreamResponse(data, callback);
960 689 } else {
961 690 // No valid data, fall back to regular call
962 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').remove();
963 - callMxChat(message, callback, botId);
691 + $('.bot-message.temporary-message').remove();
692 + callMxChat(message, callback);
964 693 }
965 694 } catch (e) {
966 695 // Could not parse, fall back to regular call
967 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').remove();
968 - callMxChat(message, callback, botId);
696 + $('.bot-message.temporary-message').remove();
697 + callMxChat(message, callback);
969 698 }
970 699 }).catch(() => {
971 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').remove();
972 - callMxChat(message, callback, botId);
700 + $('.bot-message.temporary-message').remove();
701 + callMxChat(message, callback);
973 702 });
974 703 return;
975 704 }
976 -
977 - // Re-enable chat input when stream ends with content
978 - enableChatInput(botId);
979 -
980 - // Scroll the user's last message to the top now that the
981 - // bot's full reply has rendered (gives max reading room).
982 - var $chatBoxDone = getElement(botId, 'chat-box');
983 - var $lastUserMsgDone = $chatBoxDone.find('.user-message').last();
984 - if ($lastUserMsgDone.length) {
985 - scrollElementToTop($lastUserMsgDone, botId);
986 - }
987 -
705 +
988 706 if (callback) {
989 707 callback(accumulatedContent);
990 708 }
991 709 return;
@@ -1000,24 +718,16 @@
1000 718 const data = line.substring(6);
1001 719
1002 720 if (data === '[DONE]') {
1003 721 if (!accumulatedContent) {
1004 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').remove();
1005 - callMxChat(message, callback, botId);
722 + $('.bot-message.temporary-message').remove();
723 + callMxChat(message, callback);
1006 724 return;
1007 725 }
1008 726
1009 727 // Re-enable chat input after streaming completes
1010 - enableChatInput(botId);
728 + enableChatInput();
1011 729
1012 - // Scroll the user's last message to the top now
1013 - // that the bot's full reply has rendered.
1014 - var $chatBoxStreamDone = getElement(botId, 'chat-box');
1015 - var $lastUserMsgStreamDone = $chatBoxStreamDone.find('.user-message').last();
1016 - if ($lastUserMsgStreamDone.length) {
1017 - scrollElementToTop($lastUserMsgStreamDone, botId);
1018 - }
1019 -
1020 730 if (callback) {
1021 731 callback(accumulatedContent);
1022 732 }
1023 733 return;
@@ -1027,9 +737,9 @@
1027 737 const json = JSON.parse(data);
1028 738
1029 739 // IMMEDIATE CHAT MODE UPDATE FOR STREAMING
1030 740 if (json.chat_mode) {
1031 - updateChatModeIndicator(json.chat_mode, botId);
741 + updateChatModeIndicator(json.chat_mode);
1032 742 }
1033 743
1034 744 // Handle testing data
1035 745 if (json.testing_data && !testingDataReceived) {
@@ -1041,13 +751,13 @@
1041 751 // Handle content streaming
1042 752 else if (json.content) {
1043 753 streamingStarted = true;
1044 754 accumulatedContent += json.content;
1045 - updateStreamingMessage(accumulatedContent, botId);
755 + updateStreamingMessage(accumulatedContent);
1046 756 }
1047 757 // Handle complete response in stream (fallback response)
1048 758 else if (json.text || json.message || json.html) {
1049 - handleNonStreamResponse(json, callback, botId);
759 + handleNonStreamResponse(json, callback);
1050 760 return;
1051 761 }
1052 762 // Handle errors
1053 763 else if (json.error) {
@@ -1056,12 +766,12 @@
1056 766 let errorMessage = json.error_message || json.message || json.text ||
1057 767 (typeof json.error === 'string' ? json.error : 'An error occurred. Please try again.');
1058 768
1059 769 // Re-enable chat input on error
1060 - enableChatInput(botId);
770 + enableChatInput();
1061 771
1062 772 // Display the error directly in the chat
1063 - replaceLastMessage("bot", errorMessage, '', [], botId);
773 + replaceLastMessage("bot", errorMessage);
1064 774
1065 775 if (callback) {
1066 776 callback(errorMessage);
1067 777 }
@@ -1074,10 +784,10 @@
1074 784 }
1075 785
1076 786 processStream();
1077 787 }).catch(streamError => {
1078 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').remove();
1079 - callMxChat(message, callback, botId);
788 + $('.bot-message.temporary-message').remove();
789 + callMxChat(message, callback);
1080 790 });
1081 791 }
1082 792
1083 793 processStream();
@@ -1086,32 +796,30 @@
1086 796 // Check if we have server error data with chat mode
1087 797 if (error && error.isServerError && error.data) {
1088 798 // Check for chat mode in error data
1089 799 if (error.data.chat_mode) {
1090 - updateChatModeIndicator(error.data.chat_mode, botId);
800 + updateChatModeIndicator(error.data.chat_mode);
1091 801 }
1092 802
1093 - handleNonStreamResponse(error.data, callback, botId);
803 + handleNonStreamResponse(error.data, callback);
1094 804 } else {
1095 805 // Only fall back to regular call if we don't have any response data
1096 - getElement(botId, 'chat-box').find('.bot-message.temporary-message').remove();
1097 - callMxChat(message, callback, botId);
806 + $('.bot-message.temporary-message').remove();
807 + callMxChat(message, callback);
1098 808 }
1099 809 });
1100 810 }
1101 811
1102 812 // Helper function to handle non-streaming responses
1103 -function handleNonStreamResponse(data, callback, botId) {
1104 - botId = botId || 'default';
1105 -
813 +function handleNonStreamResponse(data, callback) {
1106 814 // IMMEDIATE CHAT MODE UPDATE FOR NON-STREAMING RESPONSES
1107 815 if (data.chat_mode) {
1108 - updateChatModeIndicator(data.chat_mode, botId);
816 + updateChatModeIndicator(data.chat_mode);
1109 817 }
1110 818
1111 819 // Also check in data property if response is wrapped
1112 820 if (data.data && data.data.chat_mode) {
1113 - updateChatModeIndicator(data.data.chat_mode, botId);
821 + updateChatModeIndicator(data.data.chat_mode);
1114 822 }
1115 823
1116 824 // NOTE: Don't remove temporary message here - let replaceLastMessage handle it
1117 825 // This prevents a visual gap between thinking dots disappearing and content appearing
@@ -1136,20 +844,25 @@
1136 844 errorMessage = "An error occurred. Please try again or contact support.";
1137 845 }
1138 846
1139 847 // Handle session reset action (IP changed, session expired, etc.)
1140 - // Silent reset — keep chat UI intact, just get a new session and retry
1141 848 if (data.data && data.data.action === 'reset_session') {
1142 - MxChatInstances.silentResetSession(botId);
1143 - // Re-send the original message with the new session (user message is already displayed)
1144 - var originalMessage = getElement(botId, 'mxchat-chatbot-wrapper').find('.mxchat-input-holder textarea').data('pending-message');
849 + // Clear the old session and generate a new one
850 + resetChatSession();
851 + // Re-send the original message with the new session
852 + var originalMessage = $('.mxchat-input-holder textarea').data('pending-message');
1145 853 if (originalMessage) {
1146 - getElement(botId, 'mxchat-chatbot-wrapper').find('.mxchat-input-holder textarea').data('pending-message', null);
1147 - var currentModel = mxchatChat.model || 'gpt-5.1-chat-latest';
854 + $('.mxchat-input-holder textarea').data('pending-message', null);
855 + // Re-add the user message and thinking indicator
856 + appendMessage("user", originalMessage);
857 + appendThinkingMessage();
858 + scrollToBottom();
859 + // Determine whether to use streaming
860 + const currentModel = mxchatChat.model || 'gpt-4o';
1148 861 if (shouldUseStreaming(currentModel)) {
1149 - callMxChatStream(originalMessage, callback, botId);
862 + callMxChatStream(originalMessage, callback);
1150 863 } else {
1151 - callMxChat(originalMessage, callback, botId);
864 + callMxChat(originalMessage, callback);
1152 865 }
1153 866 }
1154 867 return;
1155 868 }
@@ -1159,9 +872,9 @@
1159 872 if (mxchatChat.is_admin) {
1160 873 displayMessage = errorMessage + (errorCode ? " (Error code: " + errorCode + ")" : "");
1161 874 }
1162 875
1163 - replaceLastMessage("bot", displayMessage, '', [], botId);
876 + replaceLastMessage("bot", displayMessage);
1164 877
1165 878 if (callback) {
1166 879 callback('');
1167 880 }
@@ -1167,22 +880,8 @@
1167 880 }
1168 881 return; // Exit early for errors
1169 882 }
1170 883
1171 - // Check for live agent response
1172 - if (data.success && data.data && data.data.status === 'waiting_for_agent') {
1173 - removeThinkingDots(botId);
1174 - // Also remove any leftover bot-message that lost its temporary-message class
1175 - var $chatBox = getElement(botId, 'chat-box');
1176 - $chatBox.find('.bot-message .thinking-dots').closest('.bot-message').remove();
1177 - updateChatModeIndicator('agent', botId);
1178 - enableChatInput(botId);
1179 - if (callback) {
1180 - callback('');
1181 - }
1182 - return;
1183 - }
1184 -
1185 884 // Handle different response formats
1186 885 if (data.text || data.html || data.message) {
1187 886
1188 887 // Apply response hooks
@@ -1194,23 +893,22 @@
1194 893 }
1195 894
1196 895 // Display the response
1197 896 if (data.text && data.html) {
1198 - replaceLastMessage("bot", data.text, data.html, [], botId);
897 + replaceLastMessage("bot", data.text, data.html);
1199 898 } else if (data.text) {
1200 - replaceLastMessage("bot", data.text, '', [], botId);
899 + replaceLastMessage("bot", data.text);
1201 900 } else if (data.html) {
1202 - replaceLastMessage("bot", "", data.html, [], botId);
901 + replaceLastMessage("bot", "", data.html);
1203 902 } else if (data.message) {
1204 - replaceLastMessage("bot", data.message, '', [], botId);
903 + replaceLastMessage("bot", data.message);
1205 904 }
1206 905 }
1207 906
1208 907 // Handle other response properties
1209 908 if (data.data && data.data.filename) {
1210 - showActivePdf(data.data.filename, botId);
1211 - var instance = MxChatInstances.get(botId);
1212 - instance.activePdfFile = data.data.filename;
909 + showActivePdf(data.data.filename);
910 + activePdfFile = data.data.filename;
1213 911 }
1214 912
1215 913 if (data.redirect_url) {
1216 914 setTimeout(() => {
@@ -1218,9 +916,9 @@
1218 916 }, 1500);
1219 917 }
1220 918
1221 919 // Ensure chat input is re-enabled (safety net for edge cases)
1222 - enableChatInput(botId);
920 + enableChatInput();
1223 921
1224 922 if (callback) {
1225 923 callback(data.text || data.message || '');
1226 924 }
@@ -1226,22 +924,21 @@
1226 924 }
1227 925 }
1228 926
1229 927 // Enhanced updateChatModeIndicator function for immediate DOM updates
1230 -function updateChatModeIndicator(mode, botId) {
1231 - botId = botId || 'default';
1232 - const indicator = getElementDOM(botId, 'chat-mode-indicator');
928 +function updateChatModeIndicator(mode) {
929 + const indicator = document.getElementById('chat-mode-indicator');
1233 930 if (indicator) {
1234 931 const oldText = indicator.textContent;
1235 932
1236 933 if (mode === 'agent') {
1237 934 indicator.textContent = 'Live Agent';
1238 - startPolling(botId);
935 + startPolling();
1239 936 } else {
1240 937 // Everything else is AI mode
1241 938 const customAiText = indicator.getAttribute('data-ai-text') || 'AI Agent';
1242 939 indicator.textContent = customAiText;
1243 - stopPolling(botId);
940 + stopPolling();
1244 941 }
1245 942
1246 943 // Force immediate DOM update and reflow
1247 944 if (oldText !== indicator.textContent) {
@@ -1263,21 +960,18 @@
1263 960 }
1264 961 }
1265 962
1266 963 // Function to update message during streaming
1267 -function updateStreamingMessage(content, botId) {
1268 - botId = botId || 'default';
1269 -
964 +function updateStreamingMessage(content) {
1270 965 // ADD RESPONSE HOOK FOR REAL-TIME STREAMING
1271 966 if (typeof customMxChatFilter === 'function') {
1272 967 content = customMxChatFilter(content, "response");
1273 968 }
1274 -
969 +
1275 970 const formattedContent = linkify(content);
1276 971
1277 - // Find the temporary message in this bot's chat box
1278 - var $chatBox = getElement(botId, 'chat-box');
1279 - const tempMessage = $chatBox.find('.bot-message.temporary-message').last();
972 + // Find the temporary message
973 + const tempMessage = $('.bot-message.temporary-message').last();
1280 974
1281 975 if (tempMessage.length) {
1282 976 // Update existing message
1283 977 tempMessage.html(formattedContent);
@@ -1282,9 +976,9 @@
1282 976 // Update existing message
1283 977 tempMessage.html(formattedContent);
1284 978 } else {
1285 979 // Create new temporary message if it doesn't exist
1286 - appendMessage("bot", content, '', [], true, botId);
980 + appendMessage("bot", content, '', [], true);
1287 981 }
1288 982 }
1289 983
1290 984 function isStreamingSupported(model) {
@@ -1303,272 +997,24 @@
1303 997 return isSupported;
1304 998 }
1305 999
1306 1000 // Update the event handlers to use the correct function names (using event delegation)
1307 -// Use class-based selectors for multi-instance support
1308 -$(document).on('click', '.send-button', function() {
1309 - var botId = getBotIdFromElement(this);
1310 - var modeIndicator = getElementDOM(botId, 'chat-mode-indicator');
1311 - if (!(modeIndicator && modeIndicator.textContent === 'Live Agent')) {
1312 - disableChatInput(botId);
1313 - }
1314 - sendMessage(botId);
1001 +$(document).on('click', '#send-button', function() {
1002 + disableChatInput();
1003 + sendMessage();
1315 1004 });
1316 1005
1317 1006 // Override enter key handler (using event delegation)
1318 -$(document).on('keypress', '.chat-input', function(e) {
1007 +$(document).on('keypress', '#chat-input', function(e) {
1319 1008 if (e.which == 13 && !e.shiftKey) {
1320 1009 e.preventDefault();
1321 - var botId = getBotIdFromElement(this);
1322 - var modeIndicator = getElementDOM(botId, 'chat-mode-indicator');
1323 - if (!(modeIndicator && modeIndicator.textContent === 'Live Agent')) {
1324 - disableChatInput(botId);
1325 - }
1326 - sendMessage(botId);
1010 + disableChatInput();
1011 + sendMessage();
1327 1012 }
1328 1013 });
1329 1014
1330 1015
1331 -// Tags the chat-box transcript so the print stylesheet can target it,
1332 -// and lazily initializes the header overflow menu for this bot if the
1333 -// markup is present but not yet wired (covers dynamically-rendered widgets).
1334 -// Idempotent; safe to call on every appended message.
1335 -function mxchatEnsurePrintRoot(botId) {
1336 - var $chatBox = getElement(botId, 'chat-box');
1337 - if (!$chatBox || !$chatBox.length) return;
1338 - $chatBox.addClass('mxchat-conversation-print-root');
1339 - if (!$chatBox.attr('data-print-title')) {
1340 - var nowStr = new Date().toLocaleString();
1341 - var headerTitle = ((typeof mxchatChat !== 'undefined' && mxchatChat.print_header_title) || 'Chat transcript') + ' — ' + nowStr;
1342 - $chatBox.attr('data-print-title', headerTitle);
1343 - }
1344 - if (typeof mxchatInitHeaderMenu === 'function') {
1345 - mxchatInitHeaderMenu(botId);
1346 - }
1347 -}
1348 -
1349 -// Builds the list of overflow-menu items for a given bot.
1350 -// Adding a future item is one push to this array — do NOT hardcode "only download."
1351 -function mxchatGetHeaderMenuItems(botId) {
1352 - var items = [];
1353 - var settings = (typeof mxchatChat !== 'undefined') ? mxchatChat : {};
1354 -
1355 - // The `print_button_*` keys still gate this item for back-compat with
1356 - // existing user options. The action is now a transcript download, not print.
1357 - if (settings.print_button_enabled === 'on') {
1358 - items.push({
1359 - id: 'download-transcript',
1360 - label: settings.print_button_label || 'Download Transcript',
1361 - icon: '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>',
1362 - action: function() {
1363 - mxchatDownloadTranscript(botId);
1364 - }
1365 - });
1366 - }
1367 -
1368 - return items;
1369 -}
1370 -
1371 -// Builds a clean markdown transcript of the current conversation and triggers
1372 -// a file download. Used by the "Download Transcript" menu item.
1373 -function mxchatDownloadTranscript(botId) {
1374 - var $chatBox = getElement(botId, 'chat-box');
1375 - if (!$chatBox || !$chatBox.length) return;
1376 -
1377 - var settings = (typeof mxchatChat !== 'undefined') ? mxchatChat : {};
1378 - var headerTitle = settings.print_header_title || 'Chat transcript';
1379 - var now = new Date();
1380 - var stamp = now.toLocaleString();
1381 -
1382 - var lines = [];
1383 - lines.push('# ' + headerTitle);
1384 - lines.push('');
1385 - lines.push('Exported: ' + stamp);
1386 - lines.push('');
1387 - lines.push('---');
1388 - lines.push('');
1389 -
1390 - $chatBox.find('.user-message, .bot-message, .agent-message').each(function() {
1391 - var $msg = $(this);
1392 - // Skip thinking placeholders and any in-flight temporary messages.
1393 - if ($msg.find('.thinking-dots').length) return;
1394 - if ($msg.hasClass('temporary-message')) return;
1395 -
1396 - var sender;
1397 - if ($msg.hasClass('user-message')) sender = 'User';
1398 - else if ($msg.hasClass('agent-message')) sender = 'Live Agent';
1399 - else sender = 'AI Agent';
1400 -
1401 - // Strip interactive UI from the cloned message so we get the conversation text.
1402 - var $clone = $msg.clone();
1403 - $clone.find('.copy-button, .message-toolbar, .mxchat-copy, button, script, style').remove();
1404 - var text = $clone.text().replace(/ /g, ' ').replace(/[ \t]+\n/g, '\n').replace(/\n{3,}/g, '\n\n').trim();
1405 - if (!text) return;
1406 -
1407 - lines.push('**' + sender + '**');
1408 - lines.push('');
1409 - lines.push(text);
1410 - lines.push('');
1411 - });
1412 -
1413 - var content = lines.join('\n');
1414 - var iso = now.toISOString().replace(/[:.]/g, '-').slice(0, 19);
1415 - var fname = 'mxchat-transcript-' + iso + '.md';
1416 - var blob = new Blob([content], { type: 'text/markdown;charset=utf-8' });
1417 - var url = URL.createObjectURL(blob);
1418 - var a = document.createElement('a');
1419 - a.href = url;
1420 - a.download = fname;
1421 - a.style.display = 'none';
1422 - document.body.appendChild(a);
1423 - a.click();
1424 - setTimeout(function() {
1425 - if (a.parentNode) a.parentNode.removeChild(a);
1426 - URL.revokeObjectURL(url);
1427 - }, 100);
1428 -}
1429 -
1430 -// Reads the bot bubble's actual computed bg+fg and writes them as CSS vars
1431 -// on the menu wrap, so the dropdown matches whatever paints the bubble —
1432 -// saved options, AI theme CSS, or the mxchat-theme add-on.
1433 -function mxchatSyncMenuColors(botId, $wrap) {
1434 - if (!$wrap || !$wrap.length) return;
1435 - var $bot = $wrap.closest('.mxchat-chatbot-wrapper').find('.bot-message').not('.temporary-message').first();
1436 - if (!$bot.length) return;
1437 - var cs = window.getComputedStyle($bot[0]);
1438 - if (cs.backgroundColor && cs.backgroundColor !== 'rgba(0, 0, 0, 0)' && cs.backgroundColor !== 'transparent') {
1439 - $wrap[0].style.setProperty('--mxchat-menu-bg', cs.backgroundColor);
1440 - }
1441 - // Bot text color usually lives on a child div, not .bot-message itself.
1442 - var $textChild = $bot.find('[style*="color"]').first();
1443 - var fg = ($textChild.length ? window.getComputedStyle($textChild[0]).color : cs.color);
1444 - if (fg) $wrap[0].style.setProperty('--mxchat-menu-fg', fg);
1445 -}
1446 -
1447 -// One-time per-widget init: renders menu items, wires open/close,
1448 -// outside-click, Escape, and arrow-key navigation. If no items, hides the trigger.
1449 -function mxchatInitHeaderMenu(botId) {
1450 - var $wrap = $('.mxchat-header-menu-wrap[data-bot-id="' + botId + '"]').first();
1451 - if (!$wrap.length || $wrap.data('mxchatMenuReady')) return;
1452 -
1453 - var $trigger = $wrap.find('.mxchat-menu-trigger');
1454 - var $menu = $wrap.find('.mxchat-header-menu');
1455 - var items = mxchatGetHeaderMenuItems(botId);
1456 -
1457 - // Initial color sync — covers normal page load.
1458 - mxchatSyncMenuColors(botId, $wrap);
1459 -
1460 - if (!items.length) {
1461 - $trigger.hide();
1462 - $menu.hide();
1463 - $wrap.data('mxchatMenuReady', true);
1464 - return;
1465 - }
1466 -
1467 - // Build the menu items.
1468 - $menu.empty();
1469 - items.forEach(function(item, idx) {
1470 - var $btn = $('<button>', {
1471 - type: 'button',
1472 - 'class': 'mxchat-menu-item',
1473 - 'role': 'menuitem',
1474 - 'tabindex': '-1',
1475 - 'data-menu-id': item.id,
1476 - html: '<span class="mxchat-menu-item-icon">' + item.icon + '</span>' +
1477 - '<span class="mxchat-menu-item-label"></span>'
1478 - });
1479 - $btn.find('.mxchat-menu-item-label').text(item.label);
1480 - $btn.on('click', function(e) {
1481 - e.preventDefault();
1482 - e.stopPropagation();
1483 - closeMenu();
1484 - try { item.action(); } catch (err) { /* no-op */ }
1485 - });
1486 - $menu.append($btn);
1487 - });
1488 -
1489 - function openMenu() {
1490 - // Re-sync each open in case the active theme changed since init.
1491 - mxchatSyncMenuColors(botId, $wrap);
1492 - $menu.prop('hidden', false).attr('aria-hidden', 'false').addClass('is-open');
1493 - $trigger.attr('aria-expanded', 'true');
1494 - // Focus the first item for keyboard users
1495 - setTimeout(function() {
1496 - $menu.find('.mxchat-menu-item').first().attr('tabindex', '0').trigger('focus');
1497 - }, 0);
1498 - }
1499 - function closeMenu(returnFocus) {
1500 - $menu.prop('hidden', true).attr('aria-hidden', 'true').removeClass('is-open');
1501 - $trigger.attr('aria-expanded', 'false');
1502 - $menu.find('.mxchat-menu-item').attr('tabindex', '-1');
1503 - if (returnFocus) $trigger.trigger('focus');
1504 - }
1505 -
1506 - // Toggle on trigger click — stop propagation so the .chatbot-top-bar
1507 - // click-to-collapse handler does not fire.
1508 - $trigger.on('click', function(e) {
1509 - e.preventDefault();
1510 - e.stopPropagation();
1511 - if ($menu.hasClass('is-open')) closeMenu();
1512 - else openMenu();
1513 - });
1514 -
1515 - // Don't let clicks inside the menu bubble to the top-bar collapse handler.
1516 - $menu.on('click', function(e) {
1517 - e.stopPropagation();
1518 - });
1519 -
1520 - // Outside click closes the menu.
1521 - $(document).on('click.mxchatMenu-' + botId, function(e) {
1522 - if (!$menu.hasClass('is-open')) return;
1523 - if ($wrap.has(e.target).length || $wrap.is(e.target)) return;
1524 - closeMenu();
1525 - });
1526 -
1527 - // Keyboard: Escape closes and returns focus; arrow keys move focus; Enter activates.
1528 - $menu.on('keydown', '.mxchat-menu-item', function(e) {
1529 - var $items = $menu.find('.mxchat-menu-item');
1530 - var idx = $items.index(this);
1531 - if (e.key === 'Escape') {
1532 - e.preventDefault();
1533 - closeMenu(true);
1534 - } else if (e.key === 'ArrowDown') {
1535 - e.preventDefault();
1536 - var $next = $items.eq((idx + 1) % $items.length);
1537 - $items.attr('tabindex', '-1');
1538 - $next.attr('tabindex', '0').trigger('focus');
1539 - } else if (e.key === 'ArrowUp') {
1540 - e.preventDefault();
1541 - var $prev = $items.eq((idx - 1 + $items.length) % $items.length);
1542 - $items.attr('tabindex', '-1');
1543 - $prev.attr('tabindex', '0').trigger('focus');
1544 - } else if (e.key === 'Enter' || e.key === ' ') {
1545 - e.preventDefault();
1546 - $(this).trigger('click');
1547 - }
1548 - });
1549 - $trigger.on('keydown', function(e) {
1550 - if (e.key === 'Escape' && $menu.hasClass('is-open')) {
1551 - e.preventDefault();
1552 - closeMenu(true);
1553 - } else if ((e.key === 'ArrowDown' || e.key === 'Enter' || e.key === ' ') && !$menu.hasClass('is-open')) {
1554 - e.preventDefault();
1555 - openMenu();
1556 - }
1557 - });
1558 -
1559 - $wrap.data('mxchatMenuReady', true);
1560 -}
1561 -
1562 -// Initialize header menus for every rendered widget on DOM ready.
1563 -$(function() {
1564 - $('.mxchat-header-menu-wrap').each(function() {
1565 - var botId = $(this).data('bot-id');
1566 - if (botId) mxchatInitHeaderMenu(botId);
1567 - });
1568 -});
1569 -
1570 -function appendMessage(sender, messageText = '', messageHtml = '', images = [], isTemporary = false, botId = 'default') {
1016 +function appendMessage(sender, messageText = '', messageHtml = '', images = [], isTemporary = false) {
1571 1017 try {
1572 1018 // Determine styles based on sender type
1573 1019 let messageClass, bgColor, fontColor;
1574 1020
@@ -1589,29 +1035,25 @@
1589 1035 }
1590 1036
1591 1037 const messageDiv = $('<div>')
1592 1038 .addClass(messageClass)
1593 - .attr('dir', 'auto');
1594 -
1595 - // Only apply inline colors if AI theme is not active (let CSS handle it)
1596 - var skipColors = shouldSkipInlineColors(botId);
1597 - if (skipColors) {
1598 - messageDiv.css({
1599 - 'margin-bottom': '1em'
1600 - });
1601 - } else {
1602 - messageDiv.css({
1039 + .attr('dir', 'auto')
1040 + .css({
1603 1041 'background': bgColor,
1604 1042 'color': fontColor,
1605 1043 'margin-bottom': '1em'
1606 1044 });
1045 +
1046 + // Process the message content based on sender
1047 + let fullMessage;
1048 + if (sender === "user") {
1049 + // For user messages, apply linkify after sanitization
1050 + fullMessage = linkify(messageText);
1051 + } else {
1052 + // For bot/agent messages, preserve HTML
1053 + fullMessage = messageText;
1607 1054 }
1608 1055
1609 - // Process the message content - always run linkify to convert markdown
1610 - // links and format text. linkify() handles existing HTML safely via
1611 - // negative lookaheads that skip URLs already inside <a> tags.
1612 - let fullMessage = linkify(messageText);
1613 -
1614 1056 // Add images if provided
1615 1057 if (images && images.length > 0) {
1616 1058 fullMessage += '<div class="image-gallery" dir="auto">';
1617 1059 images.forEach(img => {
@@ -1617,9 +1059,9 @@
1617 1059 images.forEach(img => {
1618 1060 const safeTitle = sanitizeUserInput(img.title);
1619 1061 const safeUrl = encodeURI(img.image_url);
1620 1062 const safeThumbnail = encodeURI(img.thumbnail_url);
1621 -
1063 +
1622 1064 fullMessage += `
1623 1065 <div style="margin-bottom: 10px;">
1624 1066 <strong>${safeTitle}</strong><br>
1625 1067 <a href="${safeUrl}" target="_blank">
@@ -1645,32 +1087,25 @@
1645 1087 if (isTemporary) {
1646 1088 messageDiv.addClass('temporary-message');
1647 1089 }
1648 1090
1649 - // Append to the correct chatbot instance's chat-box
1650 - var $chatBox = getElement(botId, 'chat-box');
1651 - messageDiv.hide().appendTo($chatBox).fadeIn(300, function() {
1091 + messageDiv.hide().appendTo('#chat-box').fadeIn(300, function() {
1652 1092 // FIXED: Use event delegation for link tracking
1653 1093 if (sender === "bot" || sender === "agent") {
1654 - attachLinkTracking(messageDiv, messageText, botId);
1094 + attachLinkTracking(messageDiv, messageText);
1655 1095 }
1656 -
1096 +
1657 1097 if (sender === "bot") {
1658 - const lastUserMessage = $chatBox.find('.user-message').last();
1098 + const lastUserMessage = $('#chat-box').find('.user-message').last();
1659 1099 if (lastUserMessage.length) {
1660 - scrollElementToTop(lastUserMessage, botId);
1100 + scrollElementToTop(lastUserMessage);
1661 1101 }
1662 1102 }
1663 -
1664 - if ((sender === "bot" || sender === "agent") && !isTemporary) {
1665 - mxchatEnsurePrintRoot(botId);
1666 - }
1667 1103 });
1668 1104
1669 1105 if (messageText.id) {
1670 - var instance = MxChatInstances.get(botId);
1671 - instance.lastSeenMessageId = messageText.id;
1672 - hideNotification(botId);
1106 + lastSeenMessageId = messageText.id;
1107 + hideNotification();
1673 1108 }
1674 1109 } catch (error) {
1675 1110 // Error rendering message - silently continue
1676 1111 }
@@ -1676,35 +1111,34 @@
1676 1111 }
1677 1112 }
1678 1113
1679 1114 // Helper function to attach link tracking with proper event handling
1680 -function attachLinkTracking(messageDiv, messageText, botId) {
1681 - botId = botId || 'default';
1115 +function attachLinkTracking(messageDiv, messageText) {
1682 1116 // Use a slight delay to ensure DOM is ready
1683 1117 setTimeout(function() {
1684 1118 const links = messageDiv.find('a[href]').not('[data-tracked]');
1685 -
1119 +
1686 1120 links.each(function() {
1687 1121 const $link = $(this);
1688 1122 const originalHref = $link.attr('href');
1689 -
1123 +
1690 1124 // Mark as tracked to avoid duplicate handlers
1691 1125 $link.attr('data-tracked', 'true');
1692 -
1126 +
1693 1127 // Only track external URLs
1694 1128 if (originalHref && (originalHref.startsWith('http://') || originalHref.startsWith('https://'))) {
1695 1129 // Remove any existing click handlers first
1696 1130 $link.off('click.tracking');
1697 -
1131 +
1698 1132 // Add new click handler with namespace
1699 1133 $link.on('click.tracking', function(e) {
1700 1134 e.preventDefault();
1701 1135 e.stopPropagation();
1702 -
1703 - const messageContext = typeof messageText === 'string'
1704 - ? messageText.substring(0, 200)
1136 +
1137 + const messageContext = typeof messageText === 'string'
1138 + ? messageText.substring(0, 200)
1705 1139 : '';
1706 -
1140 +
1707 1141 // Track the click
1708 1142 $.ajax({
1709 1143 url: mxchatChat.ajax_url,
1710 1144 type: 'POST',
@@ -1709,9 +1143,9 @@
1709 1143 url: mxchatChat.ajax_url,
1710 1144 type: 'POST',
1711 1145 data: {
1712 1146 action: 'mxchat_track_url_click',
1713 - session_id: getChatSession(botId),
1147 + session_id: getChatSession(),
1714 1148 url: originalHref,
1715 1149 message_context: messageContext,
1716 1150 nonce: mxchatChat.nonce
1717 1151 },
@@ -1723,9 +1157,9 @@
1723 1157 window.location.href = originalHref;
1724 1158 }
1725 1159 }
1726 1160 });
1727 -
1161 +
1728 1162 return false; // Extra insurance to prevent default
1729 1163 });
1730 1164 }
1731 1165 });
@@ -1731,12 +1165,11 @@
1731 1165 });
1732 1166 }, 100); // Small delay to ensure DOM is ready
1733 1167 }
1734 1168
1735 -function replaceLastMessage(sender, responseText, responseHtml = '', images = [], botId = 'default') {
1169 +function replaceLastMessage(sender, responseText, responseHtml = '', images = []) {
1736 1170 var messageClass = sender === "user" ? "user-message" : sender === "agent" ? "agent-message" : "bot-message";
1737 - var $chatBox = getElement(botId, 'chat-box');
1738 - var lastMessageDiv = $chatBox.find('.bot-message.temporary-message, .agent-message.temporary-message').last();
1171 + var lastMessageDiv = $('#chat-box').find('.bot-message.temporary-message, .agent-message.temporary-message').last();
1739 1172
1740 1173 // Determine styles
1741 1174 let bgColor, fontColor;
1742 1175 if (sender === "user") {
@@ -1749,13 +1182,27 @@
1749 1182 bgColor = botMessageBgColor;
1750 1183 fontColor = botMessageFontColor;
1751 1184 }
1752 1185
1753 - // Always run linkify to convert markdown links and format text.
1754 - // linkify() already handles existing HTML (its URL patterns use negative lookaheads
1755 - // to avoid double-processing URLs that are already inside <a> tags).
1756 - var fullMessage = linkify(responseText);
1757 -
1186 + // FIXED: Only linkify if response doesn't already contain HTML links or tags
1187 + // This prevents double-processing of URLs that are already formatted as HTML
1188 + var fullMessage;
1189 + if (sender === "user") {
1190 + // Always linkify user messages (they're plain text)
1191 + fullMessage = linkify(responseText);
1192 + } else {
1193 + // For bot/agent messages, check if HTML already exists
1194 + if (responseText.includes('<a href=') || responseText.includes('</a>') ||
1195 + responseText.includes('<img') || responseText.includes('<div') ||
1196 + responseText.includes('<p>') || responseText.includes('<br>')) {
1197 + // Response already has HTML, don't process it
1198 + fullMessage = responseText;
1199 + } else {
1200 + // Plain text response, apply linkify
1201 + fullMessage = linkify(responseText);
1202 + }
1203 + }
1204 +
1758 1205 if (responseHtml) {
1759 1206 // Only add line breaks if there's actual text content before the HTML
1760 1207 if (fullMessage && fullMessage.trim()) {
1761 1208 fullMessage += '<br><br>' + responseHtml;
@@ -1783,91 +1230,62 @@
1783 1230 lastMessageDiv
1784 1231 .html(fullMessage)
1785 1232 .removeClass('bot-message user-message temporary-message')
1786 1233 .addClass(messageClass)
1787 - .attr('dir', 'auto');
1788 -
1789 - // Only apply inline colors if AI theme is not active (let CSS handle it)
1790 - var skipColors = mxchatChat.skip_inline_colors || shouldSkipInlineColors(botId);
1791 - if (!skipColors) {
1792 - lastMessageDiv.css({
1234 + .attr('dir', 'auto')
1235 + .css({
1793 1236 'background-color': bgColor,
1794 1237 'color': fontColor,
1795 1238 });
1796 - }
1797 1239
1798 1240 // Handle link tracking and scroll
1799 1241 if (sender === "bot" || sender === "agent") {
1800 - attachLinkTracking(lastMessageDiv, responseText, botId);
1242 + attachLinkTracking(lastMessageDiv, responseText);
1801 1243
1802 - const lastUserMessage = $chatBox.find('.user-message').last();
1244 + const lastUserMessage = $('#chat-box').find('.user-message').last();
1803 1245 if (lastUserMessage.length) {
1804 - scrollElementToTop(lastUserMessage, botId);
1246 + scrollElementToTop(lastUserMessage);
1805 1247 }
1806 1248 // Show notification if chat is hidden
1807 - var $floatingChatbot = getElement(botId, 'floating-chatbot');
1808 - if ($floatingChatbot.hasClass('hidden')) {
1809 - showNotification(botId);
1249 + if ($('#floating-chatbot').hasClass('hidden')) {
1250 + showNotification();
1810 1251 }
1811 1252 }
1812 1253
1813 1254 // Re-enable chat input after response is displayed
1814 - enableChatInput(botId);
1815 -
1816 - if (sender === "bot" || sender === "agent") {
1817 - mxchatEnsurePrintRoot(botId);
1818 - }
1255 + enableChatInput();
1819 1256 } else {
1820 - appendMessage(sender, responseText, responseHtml, images, false, botId);
1257 + appendMessage(sender, responseText, responseHtml, images);
1821 1258 // Re-enable chat input after response is displayed
1822 - enableChatInput(botId);
1259 + enableChatInput();
1823 1260 }
1824 1261 }
1825 1262
1826 1263
1827 - function appendThinkingMessage(botId) {
1828 - botId = botId || 'default';
1264 + function appendThinkingMessage() {
1265 + // Remove any existing thinking dots first
1266 + $('.thinking-dots').remove();
1829 1267
1830 - // Don't show thinking dots in live agent mode - message is just forwarded to a human
1831 - var indicator = getElementDOM(botId, 'chat-mode-indicator');
1832 - if (indicator && indicator.textContent === 'Live Agent') {
1833 - return;
1834 - }
1835 -
1836 - var $chatBox = getElement(botId, 'chat-box');
1837 -
1838 - // Remove any existing thinking dots in this bot's chat first
1839 - $chatBox.find('.thinking-dots').remove();
1840 -
1841 - // Check if we should skip inline colors (AI theme is active)
1842 - var skipColors = shouldSkipInlineColors(botId);
1843 -
1844 1268 // Retrieve the bot message font color and background color
1845 1269 var botMessageFontColor = mxchatChat.bot_message_font_color;
1846 1270 var botMessageBgColor = mxchatChat.bot_message_bg_color;
1847 1271
1848 - // Build thinking dots HTML - skip inline colors if AI theme is active
1849 - var dotStyle = skipColors ? '' : ' style="background-color: ' + botMessageFontColor + ';"';
1272 +
1850 1273 var thinkingHtml = '<div class="thinking-dots-container">' +
1851 1274 '<div class="thinking-dots">' +
1852 - '<span class="dot"' + dotStyle + '></span>' +
1853 - '<span class="dot"' + dotStyle + '></span>' +
1854 - '<span class="dot"' + dotStyle + '></span>' +
1275 + '<span class="dot" style="background-color: ' + botMessageFontColor + ';"></span>' +
1276 + '<span class="dot" style="background-color: ' + botMessageFontColor + ';"></span>' +
1277 + '<span class="dot" style="background-color: ' + botMessageFontColor + ';"></span>' +
1855 1278 '</div>' +
1856 1279 '</div>';
1857 1280
1858 - // Append the thinking dots to this bot's chat container - skip inline colors if AI theme is active
1859 - var messageStyle = skipColors ? '' : ' style="background-color: ' + botMessageBgColor + '; color: ' + botMessageFontColor + ';"';
1860 - $chatBox.append('<div class="bot-message temporary-message"' + messageStyle + '>' + thinkingHtml + '</div>');
1861 - scrollToBottom(botId);
1281 + // Append the thinking dots to the chat container (or within the temporary message div)
1282 + $("#chat-box").append('<div class="bot-message temporary-message" style="background-color: ' + botMessageBgColor + ';">' + thinkingHtml + '</div>');
1283 + scrollToBottom();
1862 1284 }
1863 -
1864 - function removeThinkingDots(botId) {
1865 - botId = botId || 'default';
1866 - var $chatBox = getElement(botId, 'chat-box');
1867 - // Remove by temporary-message class first, then fall back to any bot-message containing thinking dots
1868 - $chatBox.find('.thinking-dots').closest('.temporary-message').remove();
1869 - $chatBox.find('.bot-message .thinking-dots').closest('.bot-message').remove();
1285 +
1286 + function removeThinkingDots() {
1287 + $('.thinking-dots').closest('.temporary-message').remove();
1870 1288 }
1871 1289
1872 1290 // ====================================
1873 1291 // TEXT FORMATTING & PROCESSING
@@ -1901,12 +1319,9 @@
1901 1319 processedText = formatTextStyling(processedText);
1902 1320
1903 1321 // Process code blocks BEFORE processing links
1904 1322 processedText = formatCodeBlocks(processedText);
1905 -
1906 - // Process markdown tables BEFORE converting newlines to paragraphs
1907 - processedText = formatMarkdownTables(processedText);
1908 -
1323 +
1909 1324 // NOW convert to paragraphs
1910 1325 processedText = convertNewlinesToBreaks(processedText);
1911 1326
1912 1327 // IMPORTANT: Handle citation-style brackets FIRST [URL]
@@ -1919,63 +1334,37 @@
1919 1334 // Return as a proper link without the brackets
1920 1335 return `<a href="${safeUrl}" target="${linkTarget}">${cleanUrl}</a>`;
1921 1336 });
1922 1337
1923 - // Process markdown links: [text](url) and [](url)
1924 - // Uses balanced parenthesis matching to handle URLs containing parens
1925 - // (e.g. PDF filenames with dates like (2025-08-28).pdf)
1926 - processedText = (function(input) {
1927 - var result = '';
1928 - var i = 0;
1929 - while (i < input.length) {
1930 - // Look for [ at current position
1931 - if (input[i] === '[') {
1932 - // Find closing ]
1933 - var closeBracket = input.indexOf(']', i + 1);
1934 - if (closeBracket === -1 || closeBracket + 1 >= input.length || input[closeBracket + 1] !== '(') {
1935 - result += input[i];
1936 - i++;
1937 - continue;
1938 - }
1939 - var linkText = input.substring(i + 1, closeBracket);
1940 - // Check if URL starts with http
1941 - var urlStart = closeBracket + 2;
1942 - if (!input.substring(urlStart).match(/^https?:\/\//)) {
1943 - result += input[i];
1944 - i++;
1945 - continue;
1946 - }
1947 - // Find balanced closing paren
1948 - var depth = 1;
1949 - var j = urlStart;
1950 - while (j < input.length && depth > 0) {
1951 - if (input[j] === '(') depth++;
1952 - else if (input[j] === ')') depth--;
1953 - if (depth > 0) j++;
1954 - }
1955 - if (depth !== 0) {
1956 - result += input[i];
1957 - i++;
1958 - continue;
1959 - }
1960 - var url = input.substring(urlStart, j);
1961 - var cleanUrl = url.replace(/[\].,;!?]+$/, '');
1962 - var encodedUrl = safeEncodeUrl(cleanUrl);
1963 - if (!linkText || !linkText.trim()) {
1964 - result += '<a href="' + encodedUrl + '" target="' + linkTarget + '">' + cleanUrl + '</a>';
1965 - } else {
1966 - var safeText = sanitizeUserInput(linkText);
1967 - result += '<a href="' + encodedUrl + '" target="' + linkTarget + '">' + safeText + '</a>';
1968 - }
1969 - i = j + 1; // Skip past the closing )
1970 - } else {
1971 - result += input[i];
1972 - i++;
1973 - }
1338 + // Process proper markdown links with text: [text](url)
1339 + // This MUST have non-empty text in the first brackets
1340 + const markdownLinkPattern = /\[([^\]]+)\]\((https?:\/\/[^\s)]+)\)/g;
1341 + processedText = processedText.replace(markdownLinkPattern, (match, text, url) => {
1342 + // Make sure we have actual text (not just whitespace)
1343 + if (!text || !text.trim()) {
1344 + // If no text, treat the URL as the text
1345 + let cleanUrl = url.replace(/[.,;!?]+$/, '');
1346 + const safeUrl = safeEncodeUrl(cleanUrl);
1347 + return `<a href="${safeUrl}" target="${linkTarget}">${cleanUrl}</a>`;
1974 1348 }
1975 - return result;
1976 - })(processedText);
1349 +
1350 + // Clean the URL
1351 + let cleanUrl = url.replace(/[\].,;!?]+$/, '');
1352 + const safeUrl = safeEncodeUrl(cleanUrl);
1353 + const safeText = sanitizeUserInput(text);
1354 + return `<a href="${safeUrl}" target="${linkTarget}">${safeText}</a>`;
1355 + });
1977 1356
1357 + // Handle empty markdown links: [](url)
1358 + // This is a specific case where there's no text
1359 + const emptyMarkdownPattern = /\[\]\((https?:\/\/[^\s)]+)\)/g;
1360 + processedText = processedText.replace(emptyMarkdownPattern, (match, url) => {
1361 + let cleanUrl = url.replace(/[.,;!?]+$/, '');
1362 + const safeUrl = safeEncodeUrl(cleanUrl);
1363 + // Use the URL itself as the link text
1364 + return `<a href="${safeUrl}" target="${linkTarget}">${cleanUrl}</a>`;
1365 + });
1366 +
1978 1367 // Process phone numbers: [text](tel:number)
1979 1368 const phonePattern = /\[([^\]]+)\]\((tel:[\d+\-\s()]+)\)/g;
1980 1369 processedText = processedText.replace(phonePattern, (match, text, phone) => {
1981 1370 const safePhone = safeEncodeUrl(phone);
@@ -2127,78 +1516,9 @@
2127 1516 });
2128 1517
2129 1518 return text;
2130 1519 }
2131 -
2132 - function formatMarkdownTables(text) {
2133 - var lines = text.split('\n');
2134 - var result = [];
2135 - var i = 0;
2136 -
2137 - while (i < lines.length) {
2138 - // Check for a table: current line has pipes AND next line is a separator row
2139 - if (i + 1 < lines.length &&
2140 - lines[i].indexOf('|') !== -1 &&
2141 - /^\s*\|?[\s\-:]+(\|[\s\-:]+)+\|?\s*$/.test(lines[i + 1])) {
2142 -
2143 - var tableLines = [];
2144 - var headerLine = lines[i];
2145 - var separatorLine = lines[i + 1];
2146 - tableLines.push(headerLine);
2147 - tableLines.push(separatorLine);
2148 -
2149 - // Collect remaining table rows
2150 - var j = i + 2;
2151 - while (j < lines.length && lines[j].indexOf('|') !== -1 && lines[j].trim() !== '') {
2152 - tableLines.push(lines[j]);
2153 - j++;
2154 - }
2155 -
2156 - // Parse alignment from separator row
2157 - var sepCells = separatorLine.split('|').filter(function(c) { return c.trim() !== ''; });
2158 - var alignments = sepCells.map(function(cell) {
2159 - var trimmed = cell.trim();
2160 - if (trimmed.charAt(0) === ':' && trimmed.charAt(trimmed.length - 1) === ':') return 'center';
2161 - if (trimmed.charAt(trimmed.length - 1) === ':') return 'right';
2162 - return 'left';
2163 - });
2164 -
2165 - // Build HTML table
2166 - var html = '<div class="mxchat-table-wrapper"><table class="mxchat-table">';
2167 -
2168 - // Header row
2169 - var headerCells = tableLines[0].split('|').filter(function(c) { return c.trim() !== ''; });
2170 - html += '<thead><tr>';
2171 - headerCells.forEach(function(cell, idx) {
2172 - var align = alignments[idx] || 'left';
2173 - html += '<th style="text-align:' + align + '">' + cell.trim() + '</th>';
2174 - });
2175 - html += '</tr></thead>';
2176 -
2177 - // Body rows
2178 - html += '<tbody>';
2179 - for (var r = 2; r < tableLines.length; r++) {
2180 - var rowCells = tableLines[r].split('|').filter(function(c) { return c.trim() !== ''; });
2181 - html += '<tr>';
2182 - rowCells.forEach(function(cell, idx) {
2183 - var align = alignments[idx] || 'left';
2184 - html += '<td style="text-align:' + align + '">' + cell.trim() + '</td>';
2185 - });
2186 - html += '</tr>';
2187 - }
2188 - html += '</tbody></table></div>';
2189 -
2190 - result.push(html);
2191 - i = j;
2192 - } else {
2193 - result.push(lines[i]);
2194 - i++;
2195 - }
2196 - }
2197 -
2198 - return result.join('\n');
2199 - }
2200 -
1520 +
2201 1521 function sanitizeUserInput(text) {
2202 1522 const div = document.createElement('div');
2203 1523 div.textContent = text;
2204 1524 return div.innerHTML;
@@ -2228,21 +1548,10 @@
2228 1548 // ====================================
2229 1549 // UI & SCROLLING CONTROLS
2230 1550 // ====================================
2231 1551
2232 - function scrollToBottom(botIdOrInstant, instant) {
2233 - // Handle backward compatibility: scrollToBottom() or scrollToBottom(true/false)
2234 - var botId = 'default';
2235 - if (typeof botIdOrInstant === 'string') {
2236 - botId = botIdOrInstant;
2237 - instant = instant || false;
2238 - } else if (typeof botIdOrInstant === 'boolean') {
2239 - instant = botIdOrInstant;
2240 - } else {
2241 - instant = false;
2242 - }
2243 -
2244 - var chatBox = getElement(botId, 'chat-box');
1552 + function scrollToBottom(instant = false) {
1553 + var chatBox = $('#chat-box');
2245 1554 if (instant) {
2246 1555 // Instantly set the scroll position to the bottom
2247 1556 chatBox.scrollTop(chatBox.prop("scrollHeight"));
2248 1557 } else {
@@ -2251,15 +1560,15 @@
2251 1560 const scrollHeight = chatBox.prop("scrollHeight");
2252 1561 const initialScroll = chatBox.scrollTop();
2253 1562 const distance = scrollHeight - initialScroll;
2254 1563 const duration = 500; // Duration in ms
2255 -
1564 +
2256 1565 function smoothScroll(timestamp) {
2257 1566 if (!start) start = timestamp;
2258 1567 const progress = timestamp - start;
2259 1568 const currentScroll = initialScroll + (distance * (progress / duration));
2260 1569 chatBox.scrollTop(currentScroll);
2261 -
1570 +
2262 1571 if (progress < duration) {
2263 1572 requestAnimationFrame(smoothScroll);
2264 1573 } else {
2265 1574 chatBox.scrollTop(scrollHeight); // Ensure it's exactly at the bottom
@@ -2264,37 +1573,31 @@
2264 1573 } else {
2265 1574 chatBox.scrollTop(scrollHeight); // Ensure it's exactly at the bottom
2266 1575 }
2267 1576 }
2268 -
1577 +
2269 1578 requestAnimationFrame(smoothScroll);
2270 1579 }
2271 1580 }
2272 -
2273 - function scrollElementToTop(element, botId, topOffset) {
2274 - botId = botId || 'default';
2275 - topOffset = (typeof topOffset === 'number') ? topOffset : 2;
2276 - var chatBox = getElement(botId, 'chat-box');
1581 +
1582 + function scrollElementToTop(element) {
1583 + var chatBox = $('#chat-box');
2277 1584 var elementTop = element.position().top + chatBox.scrollTop();
2278 - chatBox.animate({ scrollTop: Math.max(0, elementTop - topOffset) }, 500);
1585 + chatBox.animate({ scrollTop: elementTop }, 500);
2279 1586 }
2280 -
2281 - function showChatWidget(botId) {
2282 - botId = botId || 'default';
2283 - var $button = getElement(botId, 'floating-chatbot-button');
1587 +
1588 + function showChatWidget() {
2284 1589 // First ensure display is set
2285 - $button.css('display', 'flex');
1590 + $('#floating-chatbot-button').css('display', 'flex');
2286 1591 // Then handle the fade
2287 - $button.fadeTo(500, 1);
1592 + $('#floating-chatbot-button').fadeTo(500, 1);
2288 1593 // Force visibility
2289 - $button.removeClass('hidden');
1594 + $('#floating-chatbot-button').removeClass('hidden');
2290 1595 }
2291 1596
2292 - function hideChatWidget(botId) {
2293 - botId = botId || 'default';
2294 - var $button = getElement(botId, 'floating-chatbot-button');
2295 - $button.css('display', 'none');
2296 - $button.addClass('hidden');
1597 + function hideChatWidget() {
1598 + $('#floating-chatbot-button').css('display', 'none');
1599 + $('#floating-chatbot-button').addClass('hidden');
2297 1600 }
2298 1601
2299 1602 function disableScroll() {
2300 1603 if (isMobile()) {
@@ -2353,43 +1656,34 @@
2353 1656 chatButton.appendChild(notificationBadge);
2354 1657
2355 1658 }
2356 1659
2357 - function showNotification(botId) {
2358 - botId = botId || 'default';
2359 - const badge = getElementDOM(botId, 'chat-notification-badge');
2360 - var $floatingChatbot = getElement(botId, 'floating-chatbot');
2361 - if (badge && $floatingChatbot.hasClass('hidden')) {
1660 + function showNotification() {
1661 + const badge = document.getElementById('chat-notification-badge');
1662 + if (badge && $('#floating-chatbot').hasClass('hidden')) {
2362 1663 badge.style.display = 'block';
2363 1664 badge.textContent = '1';
2364 1665 }
2365 1666 }
2366 -
2367 - function hideNotification(botId) {
2368 - botId = botId || 'default';
2369 - const badge = getElementDOM(botId, 'chat-notification-badge');
1667 +
1668 + function hideNotification() {
1669 + const badge = document.getElementById('chat-notification-badge');
2370 1670 if (badge) {
2371 1671 badge.style.display = 'none';
2372 1672 }
2373 1673 }
2374 -
2375 - function startNotificationChecking(botId) {
2376 - botId = botId || 'default';
1674 +
1675 + function startNotificationChecking() {
2377 1676 const chatPersistenceEnabled = mxchatChat.chat_persistence_toggle === 'on';
2378 1677 if (!chatPersistenceEnabled) return;
2379 -
2380 - createNotificationBadge(botId);
2381 - var instance = MxChatInstances.get(botId);
2382 - instance.notificationCheckInterval = setInterval(function() {
2383 - checkForNewMessages(botId);
2384 - }, 30000); // Check every 30 seconds
1678 +
1679 + createNotificationBadge();
1680 + notificationCheckInterval = setInterval(checkForNewMessages, 30000); // Check every 30 seconds
2385 1681 }
2386 -
2387 - function stopNotificationChecking(botId) {
2388 - botId = botId || 'default';
2389 - var instance = MxChatInstances.get(botId);
2390 - if (instance.notificationCheckInterval) {
2391 - clearInterval(instance.notificationCheckInterval);
1682 +
1683 + function stopNotificationChecking() {
1684 + if (notificationCheckInterval) {
1685 + clearInterval(notificationCheckInterval);
2392 1686 }
2393 1687 }
2394 1688
2395 1689 function checkForNewMessages() {
@@ -2415,35 +1709,28 @@
2415 1709 });
2416 1710 }
2417 1711
2418 1712
2419 -// ====================================
2420 -// LIVE AGENT FUNCTIONALITY
2421 -// ====================================
1713 + // ====================================
1714 + // LIVE AGENT FUNCTIONALITY
1715 + // ====================================
2422 1716
2423 -function startPolling(botId) {
2424 - botId = botId || 'default';
2425 - var instance = MxChatInstances.get(botId);
2426 - // Clear any existing interval first
2427 - stopPolling(botId);
2428 - instance.pollingInterval = setInterval(function() {
2429 - checkForAgentMessages(botId);
2430 - }, 5000);
2431 -}
1717 + function startPolling() {
1718 + // Clear any existing interval first
1719 + stopPolling();
1720 + // Start new polling interval
1721 + pollingInterval = setInterval(checkForAgentMessages, 5000);
1722 + }
2432 1723
2433 -function stopPolling(botId) {
2434 - botId = botId || 'default';
2435 - var instance = MxChatInstances.get(botId);
2436 - if (instance.pollingInterval) {
2437 - clearInterval(instance.pollingInterval);
2438 - instance.pollingInterval = null;
1724 + function stopPolling() {
1725 + if (pollingInterval) {
1726 + clearInterval(pollingInterval);
1727 + pollingInterval = null;
1728 + }
2439 1729 }
2440 -}
2441 -
2442 -function checkForAgentMessages(botId) {
2443 - botId = botId || 'default';
2444 - var instance = MxChatInstances.get(botId);
2445 - const sessionId = getChatSession(botId);
1730 +
1731 +function checkForAgentMessages() {
1732 + const sessionId = getChatSession();
2446 1733 $.ajax({
2447 1734 url: mxchatChat.ajax_url,
2448 1735 type: 'POST',
2449 1736 dataType: 'json',
@@ -2449,41 +1736,32 @@
2449 1736 dataType: 'json',
2450 1737 data: {
2451 1738 action: 'mxchat_fetch_new_messages',
2452 1739 session_id: sessionId,
2453 - last_seen_id: instance.lastSeenMessageId,
2454 - persistence_enabled: 'true',
1740 + last_seen_id: lastSeenMessageId,
1741 + persistence_enabled: 'true', // Add this too
2455 1742 nonce: mxchatChat.nonce
2456 1743 },
2457 1744 success: function (response) {
2458 1745 if (response.success && response.data?.new_messages) {
2459 1746 let hasNewMessage = false;
2460 -
1747 +
2461 1748 response.data.new_messages.forEach(function (message) {
2462 - if (message.role === "agent" && !instance.processedMessageIds.has(message.id)) {
1749 + if (message.role === "agent" && !processedMessageIds.has(message.id)) {
2463 1750 hasNewMessage = true;
2464 - appendMessage("agent", message.content, '', [], false, botId);
2465 - instance.lastSeenMessageId = message.id;
2466 - instance.processedMessageIds.add(message.id);
1751 + // CHANGE THIS LINE:
1752 + appendMessage("agent", message.content); // Instead of replaceLastMessage
1753 + lastSeenMessageId = message.id;
1754 + processedMessageIds.add(message.id);
2467 1755 }
2468 1756 });
2469 1757
2470 - if (hasNewMessage) {
2471 - enableChatInput(botId);
1758 + if (hasNewMessage && $('#floating-chatbot').hasClass('hidden')) {
1759 + showNotification();
2472 1760 }
2473 -
2474 - var $floatingChatbot = getElement(botId, 'floating-chatbot');
2475 - if (hasNewMessage && $floatingChatbot.hasClass('hidden')) {
2476 - showNotification(botId);
2477 - }
2478 -
2479 - scrollToBottom(botId, true);
1761 +
1762 + scrollToBottom(true);
2480 1763 }
2481 -
2482 - // Handle chat mode transitions (e.g. agent ended chat via !endchat)
2483 - if (response.success && response.data?.chat_mode) {
2484 - updateChatModeIndicator(response.data.chat_mode, botId);
2485 - }
2486 1764 },
2487 1765 error: function (xhr, status, error) {
2488 1766 // Polling error - silently continue
2489 1767 }
@@ -2493,29 +1771,17 @@
2493 1771 // ====================================
2494 1772 // CHAT HISTORY & PERSISTENCE
2495 1773 // ====================================
2496 1774
2497 -function loadChatHistory(botId, onComplete) {
2498 - botId = botId || 'default';
2499 - var instance = MxChatInstances.get(botId);
2500 -
1775 +function loadChatHistory() {
2501 1776 // Prevent duplicate loading
2502 - if (instance.chatHistoryLoaded) {
2503 - if (onComplete) onComplete();
1777 + if (chatHistoryLoaded) {
2504 1778 return;
2505 1779 }
2506 -
2507 - // Use getChatSession which returns null if no session exists (does NOT create one)
2508 - var sessionId = getChatSession(botId);
1780 +
1781 + var sessionId = getChatSession();
2509 1782 var chatPersistenceEnabled = mxchatChat.chat_persistence_toggle === 'on';
2510 1783
2511 - // No session yet — nothing to load. History will load after first message via ensureSession.
2512 - if (!sessionId) {
2513 - instance.chatHistoryLoaded = true;
2514 - if (onComplete) onComplete();
2515 - return;
2516 - }
2517 -
2518 1784 if (chatPersistenceEnabled && sessionId) {
2519 1785 $.ajax({
2520 1786 url: mxchatChat.ajax_url,
2521 1787 type: 'POST',
@@ -2526,12 +1792,11 @@
2526 1792 },
2527 1793 success: function(response) {
2528 1794 // Handle session reset (IP changed while user was away)
2529 1795 if (response.success === false && response.data && response.data.action === 'reset_session') {
2530 - // Silent reset — new session but don't clear UI
2531 - MxChatInstances.silentResetSession(botId);
2532 - instance.chatHistoryLoaded = true; // Prevent retry loop
2533 - if (onComplete) onComplete();
1796 + // Silently reset session - user will start fresh
1797 + resetChatSession();
1798 + chatHistoryLoaded = true; // Prevent retry loop
2534 1799 return;
2535 1800 }
2536 1801
2537 1802 // Check if the response indicates success
@@ -2537,15 +1802,15 @@
2537 1802 // Check if the response indicates success
2538 1803 if (response.success) {
2539 1804 // Handle case where conversation data exists and is an array
2540 1805 if (response.data && Array.isArray(response.data.conversation)) {
2541 - var $chatBox = getElement(botId, 'chat-box');
1806 + var $chatBox = $('#chat-box');
2542 1807 var $fragment = $(document.createDocumentFragment());
2543 - let highestMessageId = instance.lastSeenMessageId;
1808 + let highestMessageId = lastSeenMessageId;
2544 1809
2545 1810 // Update chat mode if provided
2546 1811 if (response.data.chat_mode) {
2547 - updateChatModeIndicator(response.data.chat_mode, botId);
1812 + updateChatModeIndicator(response.data.chat_mode);
2548 1813 }
2549 1814
2550 1815 // Only process if there are actual messages
2551 1816 if (response.data.conversation.length > 0) {
@@ -2550,9 +1815,9 @@
2550 1815 // Only process if there are actual messages
2551 1816 if (response.data.conversation.length > 0) {
2552 1817 // IMPORTANT: Clear existing messages before loading history
2553 1818 $chatBox.empty();
2554 -
1819 +
2555 1820 $.each(response.data.conversation, function(index, message) {
2556 1821 // Skip agent messages if persistence is off
2557 1822 if (!chatPersistenceEnabled && message.role === 'agent') {
2558 1823 return;
@@ -2587,19 +1852,9 @@
2587 1852 var content = message.content;
2588 1853 content = content.replace(/\\'/g, "'").replace(/\\"/g, '"');
2589 1854 content = decodeHTMLEntities(content);
2590 1855
2591 - // Skip linkify for messages containing structured HTML
2592 - // (forms, product cards, galleries, etc.) to avoid
2593 - // markdown formatting corrupting HTML attributes
2594 - // (e.g. underscores in name="field_name" becoming <em> tags)
2595 - if (content.includes("mxchat-product-card") ||
2596 - content.includes("mxchat-image-gallery") ||
2597 - content.includes("mxchat-featured-products") ||
2598 - content.includes("<form") ||
2599 - content.includes("<input") ||
2600 - content.includes("<select") ||
2601 - content.includes("<textarea")) {
1856 + if (content.includes("mxchat-product-card") || content.includes("mxchat-image-gallery")) {
2602 1857 messageElement.html(content);
2603 1858 } else {
2604 1859 var formattedContent = linkify(content);
2605 1860 messageElement.html(formattedContent);
@@ -2609,47 +1864,42 @@
2609 1864
2610 1865 // Track message IDs
2611 1866 if (message.id) {
2612 1867 highestMessageId = Math.max(highestMessageId, message.id);
2613 - instance.processedMessageIds.add(message.id);
1868 + processedMessageIds.add(message.id);
2614 1869 }
2615 1870 });
2616 1871
2617 1872 // Only append messages and scroll if we have content
2618 1873 $chatBox.append($fragment);
2619 - scrollToBottom(botId, true);
1874 + scrollToBottom(true);
2620 1875
2621 1876 // Collapse quick questions if we have conversation history
2622 - // BUT skip auto-collapse for embedded bots (they should stay expanded)
2623 - if (hasQuickQuestions(botId) && !isEmbeddedBot(botId)) {
2624 - collapseQuickQuestions(botId);
1877 + if (hasQuickQuestions()) {
1878 + collapseQuickQuestions();
2625 1879 }
2626 1880
2627 1881 // Update lastSeenMessageId after history loads
2628 - instance.lastSeenMessageId = highestMessageId;
1882 + lastSeenMessageId = highestMessageId;
2629 1883
2630 1884 // Only update chat mode if persistence is enabled and we have messages
2631 1885 if (chatPersistenceEnabled) {
2632 1886 var lastMessage = response.data.conversation[response.data.conversation.length - 1];
2633 1887 if (lastMessage.role === 'agent') {
2634 - updateChatModeIndicator('agent', botId);
1888 + updateChatModeIndicator('agent');
2635 1889 }
2636 1890 }
2637 -
1891 +
2638 1892 // Mark as loaded ONLY after successful load
2639 - instance.chatHistoryLoaded = true;
1893 + chatHistoryLoaded = true;
2640 1894 }
2641 1895 }
2642 1896 }
2643 - if (onComplete) onComplete();
2644 1897 },
2645 1898 error: function(xhr, status, error) {
2646 1899 // Error loading chat history - silently continue
2647 - if (onComplete) onComplete();
2648 1900 }
2649 1901 });
2650 - } else {
2651 - if (onComplete) onComplete();
2652 1902 }
2653 1903 }
2654 1904
2655 1905
@@ -2663,12 +1913,11 @@
2663 1913 element.addEventListener(eventType, handler);
2664 1914 }
2665 1915 }
2666 1916
2667 - function showActivePdf(filename, botId) {
2668 - botId = botId || 'default';
2669 - const container = getElementDOM(botId, 'active-pdf-container');
2670 - const nameElement = getElementDOM(botId, 'active-pdf-name');
1917 + function showActivePdf(filename) {
1918 + const container = document.getElementById('active-pdf-container');
1919 + const nameElement = document.getElementById('active-pdf-name');
2671 1920
2672 1921 if (!container || !nameElement) {
2673 1922 return;
2674 1923 }
@@ -2676,12 +1925,11 @@
2676 1925 nameElement.textContent = filename;
2677 1926 container.style.display = 'flex';
2678 1927 }
2679 1928
2680 - function showActiveWord(filename, botId) {
2681 - botId = botId || 'default';
2682 - const container = getElementDOM(botId, 'active-word-container');
2683 - const nameElement = getElementDOM(botId, 'active-word-name');
1929 + function showActiveWord(filename) {
1930 + const container = document.getElementById('active-word-container');
1931 + const nameElement = document.getElementById('active-word-name');
2684 1932
2685 1933 if (!container || !nameElement) {
2686 1934 return;
2687 1935 }
@@ -2688,17 +1936,15 @@
2688 1936
2689 1937 nameElement.textContent = filename;
2690 1938 container.style.display = 'flex';
2691 1939 }
2692 -
2693 - function removeActivePdf(botId) {
2694 - botId = botId || 'default';
2695 - var instance = MxChatInstances.get(botId);
2696 - const container = getElementDOM(botId, 'active-pdf-container');
2697 - const nameElement = getElementDOM(botId, 'active-pdf-name');
2698 -
2699 - if (!container || !nameElement || !instance.activePdfFile) return;
2700 -
1940 +
1941 + function removeActivePdf() {
1942 + const container = document.getElementById('active-pdf-container');
1943 + const nameElement = document.getElementById('active-pdf-name');
1944 +
1945 + if (!container || !nameElement || !activePdfFile) return;
1946 +
2701 1947 fetch(mxchatChat.ajax_url, {
2702 1948 method: 'POST',
2703 1949 headers: {
2704 1950 'Content-Type': 'application/x-www-form-urlencoded',
@@ -2704,9 +1950,9 @@
2704 1950 'Content-Type': 'application/x-www-form-urlencoded',
2705 1951 },
2706 1952 body: new URLSearchParams({
2707 1953 'action': 'mxchat_remove_pdf',
2708 - 'session_id': getChatSession(botId),
1954 + 'session_id': sessionId,
2709 1955 'nonce': mxchatChat.nonce
2710 1956 })
2711 1957 })
2712 1958 .then(response => response.json())
@@ -2757,10 +2003,9 @@
2757 2003 // ====================================
2758 2004 // CONSENT & COMPLIANCE (GDPR)
2759 2005 // ====================================
2760 2006
2761 - function initializeChatVisibility(botId) {
2762 - botId = botId || 'default';
2007 + function initializeChatVisibility() {
2763 2008 const complianzEnabled = mxchatChat.complianz_toggle === 'on' ||
2764 2009 mxchatChat.complianz_toggle === '1' ||
2765 2010 mxchatChat.complianz_toggle === 1;
2766 2011
@@ -2765,35 +2010,34 @@
2765 2010 mxchatChat.complianz_toggle === 1;
2766 2011
2767 2012 if (complianzEnabled && typeof cmplz_has_consent === "function" && typeof complianz !== 'undefined') {
2768 2013 // Initial check
2769 - checkConsentAndShowChat(botId);
2014 + checkConsentAndShowChat();
2770 2015
2771 2016 // Listen for consent changes
2772 2017 $(document).on('cmplz_status_change', function(event) {
2773 - checkConsentAndShowChat(botId);
2018 + checkConsentAndShowChat();
2774 2019 });
2775 2020 } else {
2776 2021 // If Complianz is not enabled, always show
2777 - getElement(botId, 'floating-chatbot-button')
2022 + $('#floating-chatbot-button')
2778 2023 .css('display', 'flex')
2779 2024 .removeClass('hidden no-consent')
2780 2025 .fadeTo(500, 1);
2781 -
2026 +
2782 2027 // Also check pre-chat message when Complianz is not enabled
2783 - checkPreChatDismissal(botId);
2028 + checkPreChatDismissal();
2784 2029 }
2785 2030 }
2786 2031
2787 -
2788 - function checkConsentAndShowChat(botId) {
2789 - botId = botId || 'default';
2032 +
2033 + function checkConsentAndShowChat() {
2790 2034 var consentStatus = cmplz_has_consent('marketing');
2791 2035 var consentType = complianz.consenttype;
2792 2036
2793 - let $widget = getElement(botId, 'floating-chatbot-button');
2794 - let $chatbot = getElement(botId, 'floating-chatbot');
2795 - let $preChat = getElement(botId, 'pre-chat-message');
2037 + let $widget = $('#floating-chatbot-button');
2038 + let $chatbot = $('#floating-chatbot');
2039 + let $preChat = $('#pre-chat-message');
2796 2040
2797 2041 if (consentStatus === true) {
2798 2042 $widget
2799 2043 .removeClass('no-consent')
@@ -2802,9 +2046,9 @@
2802 2046 .fadeTo(500, 1);
2803 2047 $chatbot.removeClass('no-consent');
2804 2048
2805 2049 // Show pre-chat message if not dismissed
2806 - checkPreChatDismissal(botId);
2050 + checkPreChatDismissal();
2807 2051 } else {
2808 2052 $widget
2809 2053 .addClass('no-consent')
2810 2054 .fadeTo(500, 0, function() {
@@ -2822,38 +2066,46 @@
2822 2066
2823 2067 // ====================================
2824 2068 // PRE-CHAT MESSAGE HANDLING
2825 2069 // ====================================
2826 -
2827 - function checkPreChatDismissal(botId) {
2828 - botId = botId || 'default';
2829 - try {
2830 - var dismissedAt = localStorage.getItem('mxchat_pre_chat_dismissed_' + botId);
2831 - if (dismissedAt) {
2832 - // Re-show after 24 hours
2833 - var elapsed = Date.now() - parseInt(dismissedAt, 10);
2834 - if (elapsed < 86400000) {
2835 - getElement(botId, 'pre-chat-message').hide();
2836 - return;
2070 +
2071 + function checkPreChatDismissal() {
2072 + $.ajax({
2073 + url: mxchatChat.ajax_url,
2074 + type: 'POST',
2075 + data: {
2076 + action: 'mxchat_check_pre_chat_message_status',
2077 + _ajax_nonce: mxchatChat.nonce
2078 + },
2079 + success: function(response) {
2080 + if (response.success && !response.data.dismissed) {
2081 + $('#pre-chat-message').fadeIn(250);
2082 + } else {
2083 + $('#pre-chat-message').hide();
2837 2084 }
2838 - // Expired — clear and show again
2839 - localStorage.removeItem('mxchat_pre_chat_dismissed_' + botId);
2085 + },
2086 + error: function() {
2087 + // Error checking pre-chat dismissal - silently continue
2840 2088 }
2841 - getElement(botId, 'pre-chat-message').fadeIn(250);
2842 - } catch (e) {
2843 - // localStorage unavailable — show the message
2844 - getElement(botId, 'pre-chat-message').fadeIn(250);
2845 - }
2089 + });
2846 2090 }
2847 2091
2848 - function handlePreChatDismissal(botId) {
2849 - botId = botId || 'default';
2850 - getElement(botId, 'pre-chat-message').fadeOut(200);
2851 - try {
2852 - localStorage.setItem('mxchat_pre_chat_dismissed_' + botId, String(Date.now()));
2853 - } catch (e) {
2854 - // localStorage unavailable — dismissal won't persist
2855 - }
2092 + function handlePreChatDismissal() {
2093 + $('#pre-chat-message').fadeOut(200);
2094 + $.ajax({
2095 + url: mxchatChat.ajax_url,
2096 + type: 'POST',
2097 + data: {
2098 + action: 'mxchat_dismiss_pre_chat_message',
2099 + _ajax_nonce: mxchatChat.nonce
2100 + },
2101 + success: function() {
2102 + $('#pre-chat-message').hide();
2103 + },
2104 + error: function() {
2105 + // Error dismissing pre-chat message - silently continue
2106 + }
2107 + });
2856 2108 }
2857 2109
2858 2110
2859 2111 // ====================================
@@ -2879,104 +2131,78 @@
2879 2131 // ====================================
2880 2132
2881 2133 $(document).on('click', '.mxchat-popular-question', function () {
2882 2134 var question = $(this).text();
2883 - var botId = getBotIdFromElement(this);
2884 -
2135 +
2885 2136 // Append the question as if the user typed it
2886 - appendMessage("user", question, '', [], false, botId);
2887 -
2137 + appendMessage("user", question);
2138 +
2888 2139 // Only collapse if there are questions
2889 - if (hasQuickQuestions(botId)) {
2890 - collapseQuickQuestions(botId);
2140 + if (hasQuickQuestions()) {
2141 + collapseQuickQuestions();
2891 2142 }
2892 -
2143 +
2893 2144 // Send the question to the server
2894 - sendMessageToChatbot(question, botId);
2145 + sendMessageToChatbot(question);
2895 2146 });
2896 2147
2897 2148 $(document).on('click', '.questions-toggle-btn', function(e) {
2898 2149 e.preventDefault();
2899 2150 e.stopPropagation();
2900 - var botId = getBotIdFromElement(this);
2901 - expandQuickQuestions(botId);
2151 + expandQuickQuestions();
2902 2152 });
2903 2153
2904 2154 $(document).on('click', '.questions-collapse-btn', function(e) {
2905 2155 e.preventDefault();
2906 2156 e.stopPropagation();
2907 - var botId = getBotIdFromElement(this);
2908 - collapseQuickQuestions(botId);
2157 + collapseQuickQuestions();
2909 2158 });
2910 2159
2911 - // Chatbot visibility toggle handlers - use class selector for multi-instance support
2912 - $(document).on('click', '.floating-chatbot-button', function() {
2913 - var botId = getBotIdFromElement(this);
2914 - var $chatbot = getElement(botId, 'floating-chatbot');
2915 - var $badge = getElement(botId, 'chat-notification-badge');
2916 - var $preChat = getElement(botId, 'pre-chat-message');
2917 -
2918 - if ($chatbot.hasClass('hidden')) {
2919 - $chatbot.removeClass('hidden').addClass('visible');
2160 + // Chatbot visibility toggle handlers
2161 + $(document).on('click', '#floating-chatbot-button', function() {
2162 + var chatbot = $('#floating-chatbot');
2163 + if (chatbot.hasClass('hidden')) {
2164 + chatbot.removeClass('hidden').addClass('visible');
2920 2165 $(this).addClass('hidden');
2921 - $badge.hide(); // Hide notification when opening chat
2166 + $('#chat-notification-badge').hide(); // Hide notification when opening chat
2922 2167 disableScroll();
2923 - $preChat.fadeOut(250);
2924 -
2925 - // Load chat history for returning visitors (persistence)
2926 - var chatPersistenceEnabled = typeof mxchatChat !== 'undefined' && mxchatChat.chat_persistence_toggle === 'on';
2927 - if (chatPersistenceEnabled) {
2928 - MxChatInstances.ensureSession(botId);
2929 - }
2930 -
2931 - // Deferred email check — only on first widget open
2932 - var emailBlocker = getElementDOM(botId, 'email-blocker');
2933 - var instance = MxChatInstances.get(botId);
2934 - if (emailBlocker && !instance.emailCheckDone) {
2935 - instance.emailCheckDone = true;
2936 - resolveEmailState(botId);
2937 - } else if (!emailBlocker) {
2938 - // No email collection — still route through showChatContainerForBot
2939 - // so the loader is shown while chat history loads
2940 - showChatContainerForBot(botId);
2941 - }
2168 + $('#pre-chat-message').fadeOut(250);
2942 2169 } else {
2943 - $chatbot.removeClass('visible').addClass('hidden');
2170 + chatbot.removeClass('visible').addClass('hidden');
2944 2171 $(this).removeClass('hidden');
2945 2172 enableScroll();
2946 - checkPreChatDismissal(botId);
2173 + checkPreChatDismissal();
2947 2174 }
2948 2175 });
2949 -
2950 - // Allow clicking anywhere on the title bar to close the chatbot
2951 - $(document).on('click', '.chatbot-top-bar', function() {
2952 - var botId = getBotIdFromElement(this);
2953 - getElement(botId, 'floating-chatbot').addClass('hidden').removeClass('visible');
2954 - getElement(botId, 'floating-chatbot-button').removeClass('hidden');
2176 +
2177 + $(document).on('click', '#exit-chat-button', function() {
2178 + $('#floating-chatbot').addClass('hidden').removeClass('visible');
2179 + $('#floating-chatbot-button').removeClass('hidden');
2955 2180 enableScroll();
2956 2181 });
2957 -
2182 +
2958 2183 $(document).on('click', '.close-pre-chat-message', function(e) {
2959 2184 e.stopPropagation(); // Prevent triggering the parent .pre-chat-message click
2960 - var botId = getBotIdFromElement(this);
2961 - handlePreChatDismissal(botId);
2185 + $('#pre-chat-message').fadeOut(200, function() {
2186 + $(this).remove();
2187 + });
2962 2188 });
2189 +
2963 2190
2964 -
2965 - // PDF upload button handlers - use class selector
2966 - $(document).on('click', '.pdf-upload-btn', function() {
2967 - var botId = getBotIdFromElement(this);
2968 - var pdfInput = getElementDOM(botId, 'pdf-upload');
2969 - if (pdfInput) pdfInput.click();
2970 - });
2971 -
2972 - // Word upload button handlers - use class selector
2973 - $(document).on('click', '.word-upload-btn', function() {
2974 - var botId = getBotIdFromElement(this);
2975 - var wordInput = getElementDOM(botId, 'word-upload');
2976 - if (wordInput) wordInput.click();
2977 - });
2191 + // PDF upload button handlers
2192 + if (document.getElementById('pdf-upload-btn')) {
2193 + document.getElementById('pdf-upload-btn').addEventListener('click', function() {
2194 + document.getElementById('pdf-upload').click();
2195 + });
2196 + }
2978 2197
2198 + // Word upload button handlers
2199 + if (document.getElementById('word-upload-btn')) {
2200 + document.getElementById('word-upload-btn').addEventListener('click', function() {
2201 + document.getElementById('word-upload').click();
2202 + });
2203 + }
2204 +
2979 2205 // PDF file input change handler
2980 2206 addSafeEventListener('pdf-upload', 'change', async function(e) {
2981 2207 const file = e.target.files[0];
2982 2208
@@ -3160,497 +2386,431 @@
3160 2386 });
3161 2387
3162 2388
3163 2389 // ====================================
3164 -// INIT LOADER & CHAT CONTAINER HELPERS
2390 +// EMAIL COLLECTION SETUP - FIXED VERSION
3165 2391 // ====================================
3166 -// These must be outside the email collection block so they're always available
3167 -// (used by persistence loading even when email collection is off)
3168 -
3169 -function showInitLoader(botId) {
3170 - var loader = getElementDOM(botId, 'mxchat-init-loader');
3171 - if (loader) loader.style.display = 'flex';
3172 -}
3173 -
3174 -function hideInitLoader(botId) {
3175 - var loader = getElementDOM(botId, 'mxchat-init-loader');
3176 - if (loader) loader.style.display = 'none';
3177 -}
3178 -
3179 -function showEmailFormForBot(botId) {
3180 - hideInitLoader(botId);
3181 - var emailBlocker = getElementDOM(botId, 'email-blocker');
3182 - var chatContainer = getElementDOM(botId, 'chat-container');
3183 - if (emailBlocker) emailBlocker.style.display = 'flex';
3184 - if (chatContainer) chatContainer.style.display = 'none';
3185 -}
3186 -
3187 -function showChatContainerForBot(botId) {
3188 - var emailBlocker = getElementDOM(botId, 'email-blocker');
3189 - var chatContainer = getElementDOM(botId, 'chat-container');
3190 - if (emailBlocker) emailBlocker.style.display = 'none';
3191 -
3192 - var instance = MxChatInstances.get(botId);
3193 - var chatPersistenceEnabled = mxchatChat.chat_persistence_toggle === 'on';
3194 -
3195 - // If persistence is on and history hasn't loaded yet, show loader
3196 - // while history loads to prevent flash of empty chat
3197 - if (chatPersistenceEnabled && !instance.chatHistoryLoaded) {
3198 - if (chatContainer) chatContainer.style.display = 'none';
3199 - showInitLoader(botId);
3200 - loadChatHistory(botId, function() {
3201 - hideInitLoader(botId);
3202 - if (chatContainer) chatContainer.style.display = 'flex';
3203 - scrollToBottom(botId, true);
3204 - });
3205 - } else {
3206 - hideInitLoader(botId);
3207 - if (chatContainer) chatContainer.style.display = 'flex';
3208 - if (typeof loadChatHistory === 'function') {
3209 - loadChatHistory(botId);
3210 - }
3211 - }
3212 -}
3213 -
3214 -// ====================================
3215 -// EMAIL COLLECTION SETUP - MULTI-INSTANCE VERSION
3216 -// ====================================
3217 2392 // Only run email collection setup if it's enabled
3218 2393 if (mxchatChat && mxchatChat.email_collection_enabled === 'on') {
2394 + // Email collection form setup and handlers
2395 + const emailForm = document.getElementById('email-collection-form');
2396 + const emailBlocker = document.getElementById('email-blocker');
2397 + const chatbotWrapper = document.getElementById('chat-container');
3219 2398
3220 - // Track submitting state per bot
3221 - const emailSubmittingState = {};
2399 + if (emailForm && emailBlocker && chatbotWrapper) {
2400 +
2401 + // Add loading state management
2402 + let isSubmitting = false;
2403 +
2404 + // Optimized UI transition functions
2405 + function showEmailForm() {
2406 + emailBlocker.style.display = 'flex';
2407 + chatbotWrapper.style.display = 'none';
2408 + }
3222 2409
3223 - // Add CSS animations for email form (once globally)
3224 - if (!document.getElementById('email-error-styles')) {
3225 - const style = document.createElement('style');
3226 - style.id = 'email-error-styles';
3227 - style.textContent = `
3228 - @keyframes fadeInError {
3229 - from { opacity: 0; transform: translateY(-5px); }
3230 - to { opacity: 1; transform: translateY(0); }
2410 + function showChatContainer() {
2411 + // Show chat immediately without delay
2412 + emailBlocker.style.display = 'none';
2413 + chatbotWrapper.style.display = 'flex';
2414 +
2415 + // Load chat history only after showing chat container
2416 + if (typeof loadChatHistory === 'function') {
2417 + loadChatHistory();
3231 2418 }
3232 - .email-input-shake {
3233 - animation: shake 0.5s ease-in-out;
3234 - }
3235 - @keyframes shake {
3236 - 0%, 100% { transform: translateX(0); }
3237 - 25% { transform: translateX(-5px); }
3238 - 75% { transform: translateX(5px); }
3239 - }
3240 - @keyframes spin {
3241 - from { transform: rotate(0deg); }
3242 - to { transform: rotate(360deg); }
3243 - }
3244 - .email-spinner {
3245 - display: inline-block;
3246 - vertical-align: middle;
3247 - }
3248 - `;
3249 - document.head.appendChild(style);
3250 - }
2419 + }
3251 2420
3252 - function isValidEmailAddress(email) {
3253 - const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
3254 - return emailRegex.test(email.trim()) && email.length <= 254;
3255 - }
2421 + // Enhanced email validation
2422 + function isValidEmail(email) {
2423 + const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
2424 + return emailRegex.test(email.trim()) && email.length <= 254; // RFC 5321 limit
2425 + }
3256 2426
3257 - function isValidNameInput(name) {
3258 - return name && name.trim().length >= 2 && name.trim().length <= 100;
3259 - }
2427 + // Enhanced name validation
2428 + function isValidName(name) {
2429 + return name && name.trim().length >= 2 && name.trim().length <= 100;
2430 + }
3260 2431
3261 - /**
3262 - * Replace {visitor_name} placeholder in intro message with actual visitor name
3263 - * @param {string} botId - The bot instance ID
3264 - * @param {string} visitorName - The visitor's name to insert
3265 - */
3266 - function replaceVisitorNamePlaceholder(botId, visitorName) {
3267 - var chatBox = getElementDOM(botId, 'chat-box');
3268 - if (!chatBox) return;
3269 -
3270 - // Find the first bot message (intro message)
3271 - var introMessage = chatBox.querySelector('.bot-message');
3272 - if (!introMessage) return;
3273 -
3274 - var messageContent = introMessage.querySelector('div[dir="auto"]');
3275 - if (!messageContent) return;
3276 -
3277 - var html = messageContent.innerHTML;
3278 -
3279 - // Replace {visitor_name} placeholder (case-insensitive)
3280 - if (visitorName && visitorName.trim()) {
3281 - // Escape HTML to prevent XSS
3282 - var safeName = $('<div>').text(visitorName.trim()).html();
3283 - html = html.replace(/\{visitor_name\}/gi, safeName);
3284 - } else {
3285 - // Remove placeholder and clean up spacing if no name provided
3286 - html = html.replace(/\{visitor_name\}/gi, '');
3287 - // Clean up any double spaces that might result
3288 - html = html.replace(/\s{2,}/g, ' ').trim();
2432 + // Show loading state with spinner
2433 + function setSubmissionState(loading) {
2434 + const submitButton = document.getElementById('email-submit-button');
2435 + const emailInput = document.getElementById('user-email');
2436 + const nameInput = document.getElementById('user-name');
2437 +
2438 + if (loading) {
2439 + isSubmitting = true;
2440 + if (submitButton) submitButton.disabled = true;
2441 + if (emailInput) emailInput.disabled = true;
2442 + if (nameInput) nameInput.disabled = true;
2443 +
2444 + // Store original content and add spinner
2445 + if (submitButton && !submitButton.getAttribute('data-original-html')) {
2446 + submitButton.setAttribute('data-original-html', submitButton.innerHTML);
2447 +
2448 + // Add loading spinner while keeping original text
2449 + const originalText = submitButton.textContent;
2450 + submitButton.innerHTML = `
2451 + <svg class="email-spinner" style="width: 16px; height: 16px; margin-right: 8px; animation: spin 1s linear infinite;" viewBox="0 0 24 24">
2452 + <circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" fill="none" stroke-dasharray="31.416" stroke-dashoffset="31.416">
2453 + <animate attributeName="stroke-dasharray" dur="2s" values="0 31.416;15.708 15.708;0 31.416" repeatCount="indefinite"/>
2454 + <animate attributeName="stroke-dashoffset" dur="2s" values="0;-15.708;-31.416" repeatCount="indefinite"/>
2455 + </circle>
2456 + </svg>
2457 + ${originalText}
2458 + `;
2459 +
2460 + submitButton.style.opacity = '0.8';
2461 + }
2462 + } else {
2463 + isSubmitting = false;
2464 + if (submitButton) submitButton.disabled = false;
2465 + if (emailInput) emailInput.disabled = false;
2466 + if (nameInput) nameInput.disabled = false;
2467 +
2468 + // Restore original content
2469 + if (submitButton) {
2470 + const originalHtml = submitButton.getAttribute('data-original-html');
2471 + if (originalHtml) {
2472 + submitButton.innerHTML = originalHtml;
2473 + }
2474 + submitButton.style.opacity = '1';
2475 + }
2476 + }
3289 2477 }
3290 2478
3291 - messageContent.innerHTML = html;
3292 - }
3293 -
3294 - function setEmailSubmissionState(botId, loading) {
3295 - var submitButton = getElementDOM(botId, 'email-submit-button');
3296 - var emailInput = getElementDOM(botId, 'user-email');
3297 - var nameInput = getElementDOM(botId, 'user-name');
3298 -
3299 - if (loading) {
3300 - emailSubmittingState[botId] = true;
3301 - if (submitButton) submitButton.disabled = true;
3302 - if (emailInput) emailInput.disabled = true;
3303 - if (nameInput) nameInput.disabled = true;
3304 -
3305 - if (submitButton && !submitButton.getAttribute('data-original-html')) {
3306 - submitButton.setAttribute('data-original-html', submitButton.innerHTML);
3307 - const originalText = submitButton.textContent;
3308 - submitButton.innerHTML = `
3309 - <svg class="email-spinner" style="width: 16px; height: 16px; margin-right: 8px; animation: spin 1s linear infinite;" viewBox="0 0 24 24">
3310 - <circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" fill="none" stroke-dasharray="31.416" stroke-dashoffset="31.416">
3311 - <animate attributeName="stroke-dasharray" dur="2s" values="0 31.416;15.708 15.708;0 31.416" repeatCount="indefinite"/>
3312 - <animate attributeName="stroke-dashoffset" dur="2s" values="0;-15.708;-31.416" repeatCount="indefinite"/>
3313 - </circle>
3314 - </svg>
3315 - ${originalText}
2479 + // Error display functions
2480 + function showEmailError(message) {
2481 + clearEmailError();
2482 +
2483 + const errorDiv = document.createElement('div');
2484 + errorDiv.className = 'email-error';
2485 + errorDiv.style.cssText = `
2486 + color: #e74c3c;
2487 + font-size: 12px;
2488 + margin-top: 8px;
2489 + padding: 4px 0;
2490 + animation: fadeInError 0.3s ease;
2491 + `;
2492 + errorDiv.textContent = message;
2493 +
2494 + // Add CSS animation if not already present
2495 + if (!document.getElementById('email-error-styles')) {
2496 + const style = document.createElement('style');
2497 + style.id = 'email-error-styles';
2498 + style.textContent = `
2499 + @keyframes fadeInError {
2500 + from { opacity: 0; transform: translateY(-5px); }
2501 + to { opacity: 1; transform: translateY(0); }
2502 + }
2503 + .email-input-shake {
2504 + animation: shake 0.5s ease-in-out;
2505 + }
2506 + @keyframes shake {
2507 + 0%, 100% { transform: translateX(0); }
2508 + 25% { transform: translateX(-5px); }
2509 + 75% { transform: translateX(5px); }
2510 + }
2511 + @keyframes spin {
2512 + from { transform: rotate(0deg); }
2513 + to { transform: rotate(360deg); }
2514 + }
2515 + .email-spinner {
2516 + display: inline-block;
2517 + vertical-align: middle;
2518 + }
3316 2519 `;
3317 - submitButton.style.opacity = '0.8';
2520 + document.head.appendChild(style);
3318 2521 }
3319 - } else {
3320 - emailSubmittingState[botId] = false;
3321 - if (submitButton) submitButton.disabled = false;
3322 - if (emailInput) emailInput.disabled = false;
3323 - if (nameInput) nameInput.disabled = false;
3324 -
3325 - if (submitButton) {
3326 - const originalHtml = submitButton.getAttribute('data-original-html');
3327 - if (originalHtml) {
3328 - submitButton.innerHTML = originalHtml;
3329 - }
3330 - submitButton.style.opacity = '1';
2522 +
2523 + emailForm.appendChild(errorDiv);
2524 +
2525 + // Add shake animation to inputs
2526 + const emailInput = document.getElementById('user-email');
2527 + const nameInput = document.getElementById('user-name');
2528 +
2529 + if (emailInput) {
2530 + emailInput.classList.add('email-input-shake');
2531 + setTimeout(() => {
2532 + emailInput.classList.remove('email-input-shake');
2533 + }, 500);
3331 2534 }
2535 +
2536 + if (nameInput) {
2537 + nameInput.classList.add('email-input-shake');
2538 + setTimeout(() => {
2539 + nameInput.classList.remove('email-input-shake');
2540 + }, 500);
2541 + }
3332 2542 }
3333 - }
3334 2543
3335 - function showEmailError(botId, message) {
3336 - clearEmailError(botId);
3337 -
3338 - var emailForm = getElementDOM(botId, 'email-collection-form');
3339 - if (!emailForm) return;
3340 -
3341 - const errorDiv = document.createElement('div');
3342 - errorDiv.className = 'email-error';
3343 - errorDiv.style.cssText = `
3344 - color: #e74c3c;
3345 - font-size: 12px;
3346 - margin-top: 8px;
3347 - padding: 4px 0;
3348 - animation: fadeInError 0.3s ease;
3349 - `;
3350 - errorDiv.textContent = message;
3351 - emailForm.appendChild(errorDiv);
3352 -
3353 - // Add shake animation to inputs
3354 - var emailInput = getElementDOM(botId, 'user-email');
3355 - var nameInput = getElementDOM(botId, 'user-name');
3356 -
3357 - if (emailInput) {
3358 - emailInput.classList.add('email-input-shake');
3359 - setTimeout(() => emailInput.classList.remove('email-input-shake'), 500);
3360 - }
3361 - if (nameInput) {
3362 - nameInput.classList.add('email-input-shake');
3363 - setTimeout(() => nameInput.classList.remove('email-input-shake'), 500);
3364 - }
3365 - }
3366 -
3367 - function clearEmailError(botId) {
3368 - var emailForm = getElementDOM(botId, 'email-collection-form');
3369 - if (emailForm) {
2544 + function clearEmailError() {
3370 2545 const existingErrors = emailForm.querySelectorAll('.email-error');
3371 2546 existingErrors.forEach(error => error.remove());
3372 2547 }
3373 - }
3374 2548
3375 - // Resolve email state using server-side data when available, AJAX fallback otherwise
3376 - function resolveEmailState(botId) {
3377 - if (mxchatChat.skip_email_check && mxchatChat.initial_email_state) {
3378 - if (mxchatChat.initial_email_state.show_email_form) {
3379 - showEmailFormForBot(botId);
3380 - } else {
3381 - showChatContainerForBot(botId);
3382 - }
3383 - } else {
3384 - checkSessionAndEmailForBot(botId);
3385 - }
3386 - }
2549 + // MAIN FORM SUBMIT HANDLER
2550 + // Remove any existing event listeners first
2551 + emailForm.removeEventListener('submit', handleFormSubmit);
3387 2552
3388 - function checkSessionAndEmailForBot(botId) {
3389 - const sessionId = MxChatInstances.ensureSession(botId);
2553 + // Add the form submit handler
2554 + emailForm.addEventListener('submit', handleFormSubmit);
3390 2555
3391 - // Hide both panels while we check — show loader instead
3392 - var emailBlocker = getElementDOM(botId, 'email-blocker');
3393 - var chatContainer = getElementDOM(botId, 'chat-container');
3394 - if (emailBlocker) emailBlocker.style.display = 'none';
3395 - if (chatContainer) chatContainer.style.display = 'none';
3396 - showInitLoader(botId);
2556 + function handleFormSubmit(event) {
2557 + event.preventDefault();
2558 + event.stopPropagation();
3397 2559
3398 - fetch(mxchatChat.ajax_url, {
3399 - method: 'POST',
3400 - headers: {
3401 - 'Content-Type': 'application/x-www-form-urlencoded',
3402 - },
3403 - body: new URLSearchParams({
3404 - action: 'mxchat_check_email_provided',
3405 - session_id: sessionId,
3406 - nonce: mxchatChat.nonce,
3407 - })
3408 - })
3409 - .then((response) => {
3410 - if (!response.ok) {
3411 - throw new Error(`HTTP error! status: ${response.status}`);
2560 + // Prevent double submission
2561 + if (isSubmitting) {
2562 + return false;
3412 2563 }
3413 - return response.json();
3414 - })
3415 - .then((data) => {
3416 - if (data.success) {
3417 - if (data.data.logged_in || data.data.email) {
3418 - showChatContainerForBot(botId);
3419 - } else {
3420 - showEmailFormForBot(botId);
3421 - }
3422 - } else {
3423 - showEmailFormForBot(botId);
3424 - }
3425 - })
3426 - .catch((error) => {
3427 - showEmailFormForBot(botId);
3428 - });
3429 - }
3430 2564
3431 - // Event delegation for email form submission
3432 - $(document).on('submit', '.email-collection-form', function(e) {
3433 - e.preventDefault();
3434 - e.stopPropagation();
2565 + const userEmail = document.getElementById('user-email').value.trim();
2566 + const nameInput = document.getElementById('user-name');
2567 + const userName = nameInput ? nameInput.value.trim() : '';
2568 + const sessionId = getChatSession();
3435 2569
3436 - var botId = getBotIdFromElement(this);
2570 + // Validate email before submission
2571 + if (!userEmail) {
2572 + showEmailError('Please enter your email address.');
2573 + return false;
2574 + }
3437 2575
3438 - // Prevent double submission
3439 - if (emailSubmittingState[botId]) {
3440 - return false;
3441 - }
2576 + if (!isValidEmail(userEmail)) {
2577 + showEmailError('Please enter a valid email address.');
2578 + return false;
2579 + }
3442 2580
3443 - var emailInput = getElementDOM(botId, 'user-email');
3444 - var nameInput = getElementDOM(botId, 'user-name');
3445 - var userEmail = emailInput ? emailInput.value.trim() : '';
3446 - var userName = nameInput ? nameInput.value.trim() : '';
3447 - var sessionId = MxChatInstances.ensureSession(botId);
2581 + // Validate name if field exists
2582 + if (nameInput && !isValidName(userName)) {
2583 + showEmailError('Please enter a valid name (2-100 characters).');
2584 + return false;
2585 + }
3448 2586
3449 - // Validate email
3450 - if (!userEmail) {
3451 - showEmailError(botId, 'Please enter your email address.');
3452 - return false;
3453 - }
2587 + // Clear any existing errors
2588 + clearEmailError();
2589 + setSubmissionState(true);
3454 2590
3455 - if (!isValidEmailAddress(userEmail)) {
3456 - showEmailError(botId, 'Please enter a valid email address.');
3457 - return false;
3458 - }
2591 + // Prepare form data with optional name
2592 + const formData = new URLSearchParams({
2593 + action: 'mxchat_handle_save_email_and_response',
2594 + email: userEmail,
2595 + session_id: sessionId,
2596 + nonce: mxchatChat.nonce,
2597 + });
3459 2598
3460 - // Validate name if field exists and has content
3461 - if (nameInput && userName && !isValidNameInput(userName)) {
3462 - showEmailError(botId, 'Please enter a valid name (2-100 characters).');
3463 - return false;
3464 - }
2599 + // Add name to form data if provided
2600 + if (userName) {
2601 + formData.append('name', userName);
2602 + }
3465 2603
3466 - clearEmailError(botId);
3467 - setEmailSubmissionState(botId, true);
2604 + fetch(mxchatChat.ajax_url, {
2605 + method: 'POST',
2606 + headers: {
2607 + 'Content-Type': 'application/x-www-form-urlencoded',
2608 + },
2609 + body: formData
2610 + })
2611 + .then((response) => {
2612 + if (!response.ok) {
2613 + throw new Error(`HTTP error! status: ${response.status}`);
2614 + }
2615 + return response.json();
2616 + })
2617 + .then((data) => {
2618 + setSubmissionState(false);
3468 2619
3469 - // Prepare form data
3470 - const formData = new URLSearchParams({
3471 - action: 'mxchat_handle_save_email_and_response',
3472 - email: userEmail,
3473 - session_id: sessionId,
3474 - nonce: mxchatChat.nonce,
3475 - });
2620 + if (data.success) {
2621 + // Show chat immediately
2622 + showChatContainer();
3476 2623
3477 - if (userName) {
3478 - formData.append('name', userName);
2624 + // Handle bot response if provided
2625 + if (data.message && typeof appendMessage === 'function') {
2626 + setTimeout(() => {
2627 + appendMessage('bot', data.message);
2628 + if (typeof scrollToBottom === 'function') {
2629 + scrollToBottom();
2630 + }
2631 + }, 100);
2632 + }
2633 + } else {
2634 + showEmailError(data.message || 'Failed to save email. Please try again.');
2635 + }
2636 + })
2637 + .catch((error) => {
2638 + setSubmissionState(false);
2639 + showEmailError('An error occurred. Please try again.');
2640 + });
2641 +
2642 + return false; // Extra prevention
3479 2643 }
3480 2644
3481 - fetch(mxchatChat.ajax_url, {
3482 - method: 'POST',
3483 - headers: {
3484 - 'Content-Type': 'application/x-www-form-urlencoded',
3485 - },
3486 - body: formData
3487 - })
3488 - .then((response) => {
3489 - if (!response.ok) {
3490 - throw new Error(`HTTP error! status: ${response.status}`);
3491 - }
3492 - return response.json();
3493 - })
3494 - .then((data) => {
3495 - setEmailSubmissionState(botId, false);
2645 + // Real-time email validation
2646 + const emailInput = document.getElementById('user-email');
2647 + if (emailInput) {
2648 + let validationTimeout;
2649 +
2650 + emailInput.addEventListener('input', function() {
2651 + // Clear previous validation timeout
2652 + if (validationTimeout) {
2653 + clearTimeout(validationTimeout);
2654 + }
2655 +
2656 + // Debounce validation
2657 + validationTimeout = setTimeout(() => {
2658 + const email = this.value.trim();
2659 + clearEmailError();
2660 +
2661 + if (email && !isValidEmail(email)) {
2662 + showEmailError('Please enter a valid email address.');
2663 + }
2664 + }, 500);
2665 + });
3496 2666
3497 - if (data.success) {
3498 - showChatContainerForBot(botId);
2667 + // Handle Enter key
2668 + emailInput.addEventListener('keypress', function(e) {
2669 + if (e.key === 'Enter' && !isSubmitting) {
2670 + e.preventDefault();
2671 + emailForm.dispatchEvent(new Event('submit'));
2672 + }
2673 + });
2674 + }
3499 2675
3500 - // Replace {visitor_name} placeholder in intro message with actual name
3501 - if (userName) {
3502 - replaceVisitorNamePlaceholder(botId, userName);
3503 - } else {
3504 - // Remove placeholder if no name provided
3505 - replaceVisitorNamePlaceholder(botId, '');
2676 + // Real-time name validation
2677 + const nameInput = document.getElementById('user-name');
2678 + if (nameInput) {
2679 + let nameValidationTimeout;
2680 +
2681 + nameInput.addEventListener('input', function() {
2682 + // Clear previous validation timeout
2683 + if (nameValidationTimeout) {
2684 + clearTimeout(nameValidationTimeout);
3506 2685 }
2686 +
2687 + // Debounce validation
2688 + nameValidationTimeout = setTimeout(() => {
2689 + const name = this.value.trim();
2690 + clearEmailError();
2691 +
2692 + if (name && !isValidName(name)) {
2693 + showEmailError('Name must be between 2 and 100 characters.');
2694 + }
2695 + }, 500);
2696 + });
3507 2697
3508 - if (data.message && typeof appendMessage === 'function') {
3509 - setTimeout(() => {
3510 - appendMessage('bot', data.message, '', [], false, botId);
3511 - if (typeof scrollToBottom === 'function') {
3512 - scrollToBottom(botId);
3513 - }
3514 - }, 100);
2698 + // Handle Enter key
2699 + nameInput.addEventListener('keypress', function(e) {
2700 + if (e.key === 'Enter' && !isSubmitting) {
2701 + e.preventDefault();
2702 + emailForm.dispatchEvent(new Event('submit'));
3515 2703 }
2704 + });
2705 + }
2706 +
2707 + // Initial state check
2708 + if (mxchatChat.skip_email_check && mxchatChat.initial_email_state) {
2709 + const emailState = mxchatChat.initial_email_state;
2710 + if (emailState.show_email_form) {
2711 + showEmailForm();
3516 2712 } else {
3517 - showEmailError(botId, data.message || 'Failed to save email. Please try again.');
2713 + showChatContainer();
3518 2714 }
3519 - })
3520 - .catch((error) => {
3521 - setEmailSubmissionState(botId, false);
3522 - showEmailError(botId, 'An error occurred. Please try again.');
3523 - });
3524 -
3525 - return false;
3526 - });
3527 -
3528 - // Real-time email validation using event delegation
3529 - $(document).on('input', '.mxchat-email-input', function() {
3530 - var botId = getBotIdFromElement(this);
3531 - var $input = $(this);
3532 -
3533 - // Clear previous timeout
3534 - clearTimeout($input.data('validationTimeout'));
3535 -
3536 - // Debounce validation
3537 - var timeout = setTimeout(() => {
3538 - var email = this.value.trim();
3539 - clearEmailError(botId);
3540 -
3541 - if (email && !isValidEmailAddress(email)) {
3542 - showEmailError(botId, 'Please enter a valid email address.');
3543 - }
3544 - }, 500);
3545 -
3546 - $input.data('validationTimeout', timeout);
3547 - });
3548 -
3549 - // Handle Enter key in email input
3550 - $(document).on('keypress', '.mxchat-email-input', function(e) {
3551 - if (e.key === 'Enter') {
3552 - e.preventDefault();
3553 - var botId = getBotIdFromElement(this);
3554 - if (!emailSubmittingState[botId]) {
3555 - $(this).closest('.email-collection-form').submit();
3556 - }
2715 + } else {
2716 + // Check email status via AJAX
2717 + setTimeout(checkSessionAndEmail, 100);
3557 2718 }
3558 - });
3559 2719
3560 - // Handle Enter key in name input
3561 - $(document).on('keypress', '.mxchat-name-input', function(e) {
3562 - if (e.key === 'Enter') {
3563 - e.preventDefault();
3564 - var botId = getBotIdFromElement(this);
3565 - if (!emailSubmittingState[botId]) {
3566 - $(this).closest('.email-collection-form').submit();
3567 - }
2720 + // Check if email exists for the current session
2721 + function checkSessionAndEmail() {
2722 + const sessionId = getChatSession();
2723 +
2724 + fetch(mxchatChat.ajax_url, {
2725 + method: 'POST',
2726 + headers: {
2727 + 'Content-Type': 'application/x-www-form-urlencoded',
2728 + },
2729 + body: new URLSearchParams({
2730 + action: 'mxchat_check_email_provided',
2731 + session_id: sessionId,
2732 + nonce: mxchatChat.nonce,
2733 + })
2734 + })
2735 + .then((response) => {
2736 + if (!response.ok) {
2737 + throw new Error(`HTTP error! status: ${response.status}`);
2738 + }
2739 + return response.json();
2740 + })
2741 + .then((data) => {
2742 + if (data.success) {
2743 + if (data.data.logged_in || data.data.email) {
2744 + showChatContainer();
2745 + } else {
2746 + showEmailForm();
2747 + }
2748 + } else {
2749 + // On error, default to showing email form
2750 + showEmailForm();
2751 + }
2752 + })
2753 + .catch((error) => {
2754 + // Email check failed - default to email form
2755 + showEmailForm();
2756 + });
3568 2757 }
3569 - });
3570 2758
3571 - // Initialize email check for all bot instances
3572 - // For floating bots: defer until widget is opened (zero passive AJAX)
3573 - // For embedded bots: check immediately since the form is visible
3574 - $('.mxchat-chatbot-wrapper').each(function() {
3575 - var botId = $(this).data('bot-id') || 'default';
3576 - var emailBlocker = getElementDOM(botId, 'email-blocker');
3577 -
3578 - if (emailBlocker) {
3579 - if (isEmbeddedBot(botId)) {
3580 - // Embedded bots are always visible — check now
3581 - resolveEmailState(botId);
3582 - }
3583 - // Floating bots: handled in the widget open handler
3584 - } else if (isEmbeddedBot(botId)) {
3585 - // Embedded bot, no email collection — load history with loader
3586 - var chatPersistenceEnabled = typeof mxchatChat !== 'undefined' && mxchatChat.chat_persistence_toggle === 'on';
3587 - if (chatPersistenceEnabled) {
3588 - MxChatInstances.ensureSession(botId);
3589 - showChatContainerForBot(botId);
3590 - }
3591 - }
3592 - });
2759 + } else {
2760 + // Email collection is enabled but essential elements are missing - silently continue
2761 + }
3593 2762 }
3594 2763
3595 - // Open chatbot when pre-chat message is clicked - use class selector for multi-instance
3596 - $(document).on('click', '.pre-chat-message', function() {
3597 - var botId = getBotIdFromElement(this);
3598 - var $chatbot = getElement(botId, 'floating-chatbot');
3599 - if ($chatbot.hasClass('hidden')) {
3600 - $chatbot.removeClass('hidden').addClass('visible');
3601 - getElement(botId, 'floating-chatbot-button').addClass('hidden');
3602 - handlePreChatDismissal(botId);
2764 + // Open chatbot when pre-chat message is clicked
2765 + $(document).on('click', '#pre-chat-message', function() {
2766 + var chatbot = $('#floating-chatbot');
2767 + if (chatbot.hasClass('hidden')) {
2768 + chatbot.removeClass('hidden').addClass('visible');
2769 + $('#floating-chatbot-button').addClass('hidden');
2770 + $('#pre-chat-message').fadeOut(250); // Hide pre-chat message
3603 2771 disableScroll(); // Disable scroll when chatbot opens
3604 -
3605 - // Load chat history for returning visitors (persistence)
3606 - var chatPersistenceEnabled = typeof mxchatChat !== 'undefined' && mxchatChat.chat_persistence_toggle === 'on';
3607 - if (chatPersistenceEnabled) {
3608 - MxChatInstances.ensureSession(botId);
3609 - }
3610 -
3611 - // Deferred email check — only on first widget open
3612 - var emailBlocker = getElementDOM(botId, 'email-blocker');
3613 - var instance = MxChatInstances.get(botId);
3614 - if (emailBlocker && !instance.emailCheckDone) {
3615 - instance.emailCheckDone = true;
3616 - resolveEmailState(botId);
3617 - } else if (!emailBlocker) {
3618 - showChatContainerForBot(botId);
3619 - }
3620 2772 }
3621 2773 });
3622 2774
3623 - // Legacy duplicate close handler removed — handled by single event delegation above
2775 + var closeButton = document.querySelector('.close-pre-chat-message');
2776 + if (closeButton) {
2777 + closeButton.addEventListener('click', function() {
2778 + $('#pre-chat-message').fadeOut(200); // Hide the message
3624 2779
3625 -
3626 -function hasQuickQuestions(botId) {
3627 - botId = botId || 'default';
3628 - var questionsContainer = getElementDOM(botId, 'mxchat-popular-questions');
3629 - if (!questionsContainer) return false;
3630 - const questionButtons = questionsContainer.querySelectorAll('.mxchat-popular-question');
2780 + // Send an AJAX request to set the transient flag for 24 hours
2781 + $.ajax({
2782 + url: mxchatChat.ajax_url,
2783 + type: 'POST',
2784 + data: {
2785 + action: 'mxchat_dismiss_pre_chat_message',
2786 + _ajax_nonce: mxchatChat.nonce
2787 + },
2788 + success: function() {
2789 + // Ensure the message is hidden after dismissal
2790 + $('#pre-chat-message').hide();
2791 + },
2792 + error: function() {
2793 + // Error dismissing pre-chat message - silently continue
2794 + }
2795 + });
2796 + });
2797 + }
2798 +
2799 +
2800 +function hasQuickQuestions() {
2801 + const questionButtons = document.querySelectorAll('#mxchat-popular-questions .mxchat-popular-question');
3631 2802 return questionButtons.length > 0;
3632 2803 }
3633 2804
3634 -/**
3635 - * Check if a bot is embedded (not floating)
3636 - * Embedded bots don't have a .floating-chatbot wrapper
3637 - */
3638 -function isEmbeddedBot(botId) {
3639 - botId = botId || 'default';
3640 - var floatingWrapper = document.getElementById('floating-chatbot-' + botId);
3641 - return !floatingWrapper;
3642 -}
3643 -
3644 -function collapseQuickQuestions(botId) {
3645 - botId = botId || 'default';
3646 - const questionsContainer = getElementDOM(botId, 'mxchat-popular-questions');
3647 - if (questionsContainer && hasQuickQuestions(botId)) {
2805 +function collapseQuickQuestions() {
2806 + const questionsContainer = document.getElementById('mxchat-popular-questions');
2807 + if (questionsContainer && hasQuickQuestions()) {
3648 2808 questionsContainer.classList.add('collapsed');
3649 2809 questionsContainer.classList.add('has-been-collapsed');
3650 2810 try {
3651 - sessionStorage.setItem('mxchat_questions_collapsed_' + botId, 'true');
3652 - sessionStorage.setItem('mxchat_questions_has_been_collapsed_' + botId, 'true');
2811 + sessionStorage.setItem('mxchat_questions_collapsed', 'true');
2812 + sessionStorage.setItem('mxchat_questions_has_been_collapsed', 'true');
3653 2813 } catch (e) {
3654 2814 // Ignore if sessionStorage is not available
3655 2815 }
3656 2816 }
@@ -3655,15 +2815,14 @@
3655 2815 }
3656 2816 }
3657 2817 }
3658 2818
3659 -function expandQuickQuestions(botId) {
3660 - botId = botId || 'default';
3661 - const questionsContainer = getElementDOM(botId, 'mxchat-popular-questions');
3662 - if (questionsContainer && hasQuickQuestions(botId)) {
2819 +function expandQuickQuestions() {
2820 + const questionsContainer = document.getElementById('mxchat-popular-questions');
2821 + if (questionsContainer && hasQuickQuestions()) {
3663 2822 questionsContainer.classList.remove('collapsed');
3664 2823 try {
3665 - sessionStorage.setItem('mxchat_questions_collapsed_' + botId, 'false');
2824 + sessionStorage.setItem('mxchat_questions_collapsed', 'false');
3666 2825 } catch (e) {
3667 2826 // Ignore if sessionStorage is not available
3668 2827 }
3669 2828 }
@@ -3668,24 +2827,18 @@
3668 2827 }
3669 2828 }
3670 2829 }
3671 2830
3672 -function checkQuickQuestionsState(botId) {
3673 - botId = botId || 'default';
3674 - if (!hasQuickQuestions(botId)) {
2831 +function checkQuickQuestionsState() {
2832 + if (!hasQuickQuestions()) {
3675 2833 return; // Don't do anything if no questions exist
3676 2834 }
3677 -
3678 - // Skip restoring collapsed state for embedded bots - they should always start expanded
3679 - if (isEmbeddedBot(botId)) {
3680 - return;
3681 - }
3682 -
2835 +
3683 2836 try {
3684 - const isCollapsed = sessionStorage.getItem('mxchat_questions_collapsed_' + botId);
3685 - const hasBeenCollapsed = sessionStorage.getItem('mxchat_questions_has_been_collapsed_' + botId);
3686 -
3687 - const questionsContainer = getElementDOM(botId, 'mxchat-popular-questions');
2837 + const isCollapsed = sessionStorage.getItem('mxchat_questions_collapsed');
2838 + const hasBeenCollapsed = sessionStorage.getItem('mxchat_questions_has_been_collapsed');
2839 +
2840 + const questionsContainer = document.getElementById('mxchat-popular-questions');
3688 2841 if (questionsContainer) {
3689 2842 if (hasBeenCollapsed === 'true') {
3690 2843 questionsContainer.classList.add('has-been-collapsed');
3691 2844 }
@@ -3698,36 +2851,32 @@
3698 2851 }
3699 2852 }
3700 2853
3701 2854 // Global delegation for dynamically added links as fallback
3702 -// Use class selector for multi-instance support
3703 -$(document).on('click', '.chat-box a[href]:not([data-tracked])', function(e) {
2855 +$(document).on('click', '#chat-box a[href]:not([data-tracked])', function(e) {
3704 2856 const $link = $(this);
3705 2857 const messageDiv = $link.closest('.bot-message, .agent-message');
3706 -
2858 +
3707 2859 // Only process bot/agent message links
3708 2860 if (messageDiv.length > 0) {
3709 2861 const originalHref = $link.attr('href');
3710 -
2862 +
3711 2863 if (originalHref && (originalHref.startsWith('http://') || originalHref.startsWith('https://'))) {
3712 2864 e.preventDefault();
3713 2865 e.stopPropagation();
3714 -
2866 +
3715 2867 // Mark as tracked
3716 2868 $link.attr('data-tracked', 'true');
3717 -
3718 - // Get bot ID from the chat box context
3719 - var botId = getBotIdFromElement(this);
3720 -
2869 +
3721 2870 // Get message context from the message div
3722 2871 const messageText = messageDiv.text().substring(0, 200);
3723 -
2872 +
3724 2873 $.ajax({
3725 2874 url: mxchatChat.ajax_url,
3726 2875 type: 'POST',
3727 2876 data: {
3728 2877 action: 'mxchat_track_url_click',
3729 - session_id: getChatSession(botId),
2878 + session_id: getChatSession(),
3730 2879 url: originalHref,
3731 2880 message_context: messageText,
3732 2881 nonce: mxchatChat.nonce
3733 2882 },
@@ -3738,57 +2887,49 @@
3738 2887 window.location.href = originalHref;
3739 2888 }
3740 2889 }
3741 2890 });
3742 -
2891 +
3743 2892 return false;
3744 2893 }
3745 2894 }
3746 2895 });
3747 2896
3748 - // ====================================
3749 - // MAIN INITIALIZATION
3750 - // ====================================
2897 +
2898 +
2899 +
2900 +// ====================================
2901 +// MAIN INITIALIZATION
2902 +// ====================================
3751 2903
3752 - // Initialize all chatbot instances on the page
3753 - initializeAllInstances();
2904 +if ($('#floating-chatbot').hasClass('hidden')) {
2905 + $('#floating-chatbot-button').removeClass('hidden');
2906 +}
2907 +// Initialize when document is ready
2908 +setFullHeight();
2909 +trackOriginatingPage();
3754 2910
3755 - // Legacy initialization for single bot compatibility
3756 - $('.floating-chatbot.hidden').each(function() {
3757 - var botId = getBotIdFromElement(this);
3758 - getElement(botId, 'floating-chatbot-button').removeClass('hidden');
3759 - });
2911 +// Only load chat history if email collection is disabled
2912 +if (mxchatChat.email_collection_enabled !== 'on') {
2913 + loadChatHistory();
2914 +}
3760 2915
3761 - // Initialize when document is ready
3762 - setFullHeight();
2916 +initializeChatVisibility();
3763 2917
3764 - // Note: trackOriginatingPage() and loadChatHistory() are now deferred
3765 - // until the user's first interaction via MxChatInstances.ensureSession()
3766 -
3767 - // Initialize chat visibility for all instances
3768 - $('.mxchat-chatbot-wrapper').each(function() {
3769 - var botId = $(this).data('bot-id') || 'default';
3770 - initializeChatVisibility(botId);
3771 - });
3772 -
3773 - // Make functions globally available for add-ons
3774 - window.hasQuickQuestions = hasQuickQuestions;
3775 - window.collapseQuickQuestions = collapseQuickQuestions;
3776 - window.appendMessage = appendMessage;
3777 - window.appendThinkingMessage = appendThinkingMessage;
3778 - window.scrollToBottom = scrollToBottom;
3779 - window.scrollElementToTop = scrollElementToTop;
3780 - window.replaceLastMessage = replaceLastMessage;
3781 - window.callMxChat = callMxChat;
3782 - window.callMxChatStream = callMxChatStream;
3783 - window.shouldUseStreaming = shouldUseStreaming;
3784 - window.getChatSession = getChatSession;
3785 - window.getPageContext = getPageContext;
3786 - window.updateStreamingMessage = updateStreamingMessage;
3787 - window.MxChatInstances = MxChatInstances;
3788 - window.getElement = getElement;
3789 - window.getElementDOM = getElementDOM;
3790 - window.getBotIdFromElement = getBotIdFromElement;
2918 +// Make functions globally available for add-ons
2919 +window.hasQuickQuestions = hasQuickQuestions;
2920 +window.collapseQuickQuestions = collapseQuickQuestions;
2921 +window.appendMessage = appendMessage;
2922 +window.appendThinkingMessage = appendThinkingMessage;
2923 +window.scrollToBottom = scrollToBottom;
2924 +window.scrollElementToTop = scrollElementToTop;
2925 +window.replaceLastMessage = replaceLastMessage;
2926 +window.callMxChat = callMxChat;
2927 +window.callMxChatStream = callMxChatStream;
2928 +window.shouldUseStreaming = shouldUseStreaming;
2929 +window.getChatSession = getChatSession;
2930 +window.getPageContext = getPageContext;
2931 +window.updateStreamingMessage = updateStreamingMessage;
3791 2932
3792 2933 }); // End of jQuery ready
3793 2934
3794 2935