PluginProbe
MxChat – AI Chatbot & Content Generation for WordPress / 2.5.6
MxChat – AI Chatbot & Content Generation for WordPress v2.5.6
3.2.21 3.2.20 3.2.19 3.2.18 3.2.17 3.2.16 3.2.15 3.2.14 3.2.12 3.2.13 3.2.11 3.2.10 3.2.9 3.2.8 3.2.7 3.2.6 3.2.5 3.2.4 3.2.3 3.2.2 3.2.1 2.0.3 2.0.4 2.0.5 2.0.6 All 152 releases
← All changes | js/mxchat-admin.js +133 -981 3.2.62.5.6 View file →
@@ -82,31 +82,8 @@
82 82 }
83 83 }
84 84 }
85 85
86 -// Theme Migration Notice Dismissal Function
87 -function dismissThemeMigrationNotice() {
88 - if (typeof jQuery !== 'undefined' && typeof mxchatThemeMigration !== 'undefined') {
89 - jQuery.post(mxchatThemeMigration.ajaxurl, {
90 - action: 'dismiss_theme_migration_notice',
91 - nonce: mxchatThemeMigration.nonce
92 - }, function(response) {
93 - if (response.success) {
94 - jQuery('#mxchat-theme-migration-notice').fadeOut(300);
95 - }
96 - }).fail(function() {
97 - // Fallback: just hide the notice if AJAX fails
98 - jQuery('#mxchat-theme-migration-notice').fadeOut(300);
99 - });
100 - } else {
101 - // Fallback for cases where jQuery or localized data isn't available
102 - var notice = document.getElementById('mxchat-theme-migration-notice');
103 - if (notice) {
104 - notice.style.display = 'none';
105 - }
106 - }
107 -}
108 -
109 86 // Updated mxchatOpenActionModal function to integrate with the new selector
110 87 function mxchatOpenActionModal(isEdit = false, actionId = '', label = '', phrases = '', threshold = 85, callbackFunction = '') {
111 88 const modal = document.getElementById('mxchat-action-modal');
112 89 if (!modal) return;
@@ -408,101 +385,15 @@
408 385
409 386 // Handle real-time range slider value updates
410 387 $autosaveSections.find('input[type="range"]').on('input', function() {
411 388 const value = $(this).val();
412 - const $slider = $(this);
413 - const sliderId = $slider.attr('id');
414 - // Find the corresponding value display span (convention: id_value)
415 - const $valueSpan = $('#' + sliderId + '_value');
416 - if ($valueSpan.length) {
417 - $valueSpan.text(value);
418 - } else {
419 - // Fallback for similarity_threshold which uses threshold_value
420 - $('#threshold_value').text(value);
421 - }
389 + $('#threshold_value').text(value);
422 390 });
423 391
424 392 // Handle all input changes (including range slider)
425 - // Store pending AJAX requests and debounce timers per field to prevent freezing
426 - const pendingRequests = {};
427 - const fieldDebounceTimers = {};
428 -
429 - // Helper function to save rate limit fields with request tracking
430 - function triggerFieldSave($field, name, pendingRequests) {
431 - const value = $field.val();
432 -
433 - // Remove any existing feedback containers for this field
434 - $field.siblings('.feedback-container').remove();
435 - $field.parent().find('.feedback-container').remove();
436 -
437 - // Create feedback container
438 - const feedbackContainer = $('<div class="feedback-container"></div>');
439 - const spinner = $('<div class="saving-spinner"></div>');
440 - const successIcon = $('<div class="success-icon">✔</div>');
441 - $field.after(feedbackContainer);
442 - feedbackContainer.append(spinner);
443 -
444 - // Rate limits use the main settings action
445 - const ajaxAction = 'mxchat_save_setting';
446 - const nonce = mxchatAdmin.setting_nonce;
447 -
448 - // Store the AJAX request so it can be aborted if needed
449 - pendingRequests[name] = $.ajax({
450 - url: mxchatAdmin.ajax_url,
451 - type: 'POST',
452 - data: {
453 - action: ajaxAction,
454 - name: name,
455 - value: value,
456 - _ajax_nonce: nonce
457 - },
458 - success: function(response) {
459 - delete pendingRequests[name];
460 - if (response.success) {
461 - spinner.fadeOut(200, function() {
462 - feedbackContainer.append(successIcon);
463 - successIcon.fadeIn(200).delay(800).fadeOut(200, function() {
464 - feedbackContainer.remove();
465 - });
466 - });
467 - } else {
468 - feedbackContainer.remove();
469 - }
470 - },
471 - error: function(xhr, textStatus, error) {
472 - delete pendingRequests[name];
473 - // Don't show error for aborted requests
474 - if (textStatus !== 'abort') {
475 - feedbackContainer.remove();
476 - }
477 - }
478 - });
479 - }
480 -
481 - $autosaveSections.find('input, textarea, select').not('#model, #openrouter_selected_model').on('change', function() {
393 + $autosaveSections.find('input, textarea, select').not('#model, #openrouter_selected_model').on('change', function() {
482 394 const $field = $(this);
483 395 const name = $field.attr('name');
484 -
485 - // Debounce rate limit fields to prevent UI freezing from rapid changes
486 - if (name && name.indexOf('rate_limits') !== -1) {
487 - // Clear any pending timer for this field
488 - if (fieldDebounceTimers[name]) {
489 - clearTimeout(fieldDebounceTimers[name]);
490 - }
491 - // Abort any pending AJAX request for this field
492 - if (pendingRequests[name]) {
493 - pendingRequests[name].abort();
494 - // Remove any existing feedback containers for this field
495 - $field.siblings('.feedback-container').remove();
496 - $field.parent().find('.feedback-container').remove();
497 - }
498 - // Debounce the save operation
499 - const fieldRef = $field;
500 - fieldDebounceTimers[name] = setTimeout(function() {
501 - triggerFieldSave(fieldRef, name, pendingRequests);
502 - }, 300);
503 - return;
504 - }
505 396
506 397 // Skip saving for API key fields that haven't been interacted with and are empty
507 398 const isApiKeyField = name && (
508 399 name === 'loops_api_key' ||
@@ -544,26 +435,11 @@
544 435 const successIcon = $('<div class="success-icon">✔</div>');
545 436
546 437 // Position feedback container based on input type
547 438 if ($field.closest('.toggle-switch').length) {
548 - // Try td first (old layout), then mxc-field-control (new card layout), then fallback to after toggle
549 - var $container = $field.closest('td');
550 - if (!$container.length) {
551 - $container = $field.closest('.mxc-field-control');
552 - }
553 - if ($container.length) {
554 - $container.append(feedbackContainer);
555 - } else {
556 - $field.closest('.toggle-switch').after(feedbackContainer);
557 - }
439 + $field.closest('td').append(feedbackContainer);
558 440 } else if ($field.closest('.mxchat-toggle-switch').length) {
559 - // Try mxchat-toggle-container first, then parent div, then fallback to after toggle
560 - var $toggleContainer = $field.closest('.mxchat-toggle-container');
561 - if ($toggleContainer.length) {
562 - $toggleContainer.append(feedbackContainer);
563 - } else {
564 - $field.closest('.mxchat-toggle-switch').after(feedbackContainer);
565 - }
441 + $field.closest('.mxchat-toggle-container').append(feedbackContainer);
566 442 } else if ($field.closest('.slider-container').length) {
567 443 $field.closest('.slider-container').after(feedbackContainer);
568 444 } else {
569 445 $field.after(feedbackContainer);
@@ -571,17 +447,14 @@
571 447 feedbackContainer.append(spinner);
572 448
573 449 // Determine which AJAX action and nonce to use:
574 450 var ajaxAction, nonce;
575 - // *** UPDATED: Add Pinecone fields, chunking fields, ACF fields, and custom meta to prompts action ***
451 + // *** UPDATED: Add Pinecone fields to prompts action ***
576 452 if (name.indexOf('mxchat_prompts_options') !== -1 ||
577 - name === 'mxchat_auto_sync_posts' ||
453 + name === 'mxchat_auto_sync_posts' ||
578 454 name === 'mxchat_auto_sync_pages' ||
579 455 name.indexOf('mxchat_auto_sync_') === 0 ||
580 - name.indexOf('mxchat_pinecone_addon_options') !== -1 ||
581 - name.indexOf('mxchat_chunk') === 0 ||
582 - name.indexOf('mxchat_acf_field_') === 0 ||
583 - name === 'mxchat_custom_meta_whitelist') { // Chunking, ACF field settings, and custom meta
456 + name.indexOf('mxchat_pinecone_addon_options') !== -1) { // *** ADD THIS LINE ***
584 457 ajaxAction = 'mxchat_save_prompts_setting';
585 458 nonce = mxchatPromptsAdmin.prompts_setting_nonce;
586 459 } else {
587 460 // Otherwise, use the existing AJAX action.
@@ -797,127 +670,71 @@
797 670 }, 500)
798 671 });
799 672 });
800 673
674 + // Reinitialize color pickers when switching tabs
675 + $('.mxchat-tab-button').on('click.mxchat', function() {
676 + setTimeout(function() {
677 + $('.my-color-field:visible').wpColorPicker('close');
678 + }, 100);
679 + });
801 680 }
802 681
803 -// ========================================
804 -// POST TYPE VISIBILITY SETTINGS
805 -// ========================================
806 -(function() {
807 - const $appendToBody = $('#append_to_body');
808 - const $visibilityOptions = $('#post-type-visibility-options');
809 - const $modeRadios = $('input[name="post_type_visibility_mode"]');
810 - const $postTypeList = $('#post-type-list');
811 - const $postTypeCheckboxes = $('input[name="post_type_visibility_list[]"]');
812 -
813 - // Toggle visibility options based on auto-display toggle
814 - $appendToBody.on('change', function() {
815 - if ($(this).is(':checked')) {
816 - $visibilityOptions.slideDown(200);
817 - } else {
818 - $visibilityOptions.slideUp(200);
682 +// Initialize tabs system
683 +function initTabs() {
684 + // Remove any existing handlers first
685 + $('.mxchat-tab-button').off('click.mxchat');
686 +
687 + // Add new click handlers
688 + $('.mxchat-tab-button').on('click.mxchat', function(e) {
689 + e.preventDefault();
690 + e.stopPropagation();
691 +
692 + var $this = $(this);
693 +
694 + // Get tab ID from data-tab attribute
695 + var tabId = $this.data('tab') || 'chatbot';
696 +
697 + // Safety check for empty tabId
698 + if (!tabId) {
699 + //console.warn('No tab identifier found');
700 + return;
819 701 }
820 - });
821 -
822 - // Toggle post type list based on mode selection
823 - $modeRadios.on('change', function() {
824 - const mode = $(this).val();
825 - if (mode === 'all') {
826 - $postTypeList.slideUp(200);
702 +
703 + // Update tab buttons
704 + $('.mxchat-tab-button').removeClass('active');
705 + $this.addClass('active');
706 +
707 + // Update content areas - with safety check
708 + $('.mxchat-tab-content').removeClass('active');
709 + var $targetTab = $('#' + tabId);
710 + if ($targetTab.length) {
711 + $targetTab.addClass('active');
712 + // Removed localStorage saving functionality
827 713 } else {
828 - $postTypeList.slideDown(200);
714 + //console.warn('Tab content #' + tabId + ' not found');
829 715 }
830 -
831 - // Save mode via AJAX
832 - savePostTypeVisibility('post_type_visibility_mode', mode);
833 716 });
717 +}
834 718
835 - // Save post type list when checkboxes change
836 - $postTypeCheckboxes.on('change', function() {
837 - // Collect all checked post types
838 - const selectedPostTypes = [];
839 - $postTypeCheckboxes.filter(':checked').each(function() {
840 - selectedPostTypes.push($(this).val());
841 - });
719 +// Initialize tabs and handle events
720 +initTabs();
721 +$(document).on('widget-added widget-updated postbox-toggled', initTabs);
842 722
843 - // Save as JSON array
844 - savePostTypeVisibility('post_type_visibility_list', JSON.stringify(selectedPostTypes));
845 - });
723 +// Always activate the first tab (Chatbot)
724 +$('.mxchat-tab-button').first().trigger('click.mxchat');
725 +
846 726
847 - // Helper function to save post type visibility settings
848 - function savePostTypeVisibility(name, value) {
849 - if (typeof mxchatAdmin === 'undefined') return;
850 -
851 - // Find the container element for feedback
852 - const $container = name === 'post_type_visibility_mode'
853 - ? $('.mxchat-visibility-mode')
854 - : $postTypeList;
855 -
856 - // Remove any existing feedback
857 - $container.find('.mxchat-save-feedback').remove();
858 -
859 - // Create feedback element
860 - const $feedback = $('<span class="mxchat-save-feedback" style="margin-left: 10px; font-size: 12px;"></span>');
861 - $feedback.text('Saving...').css('color', '#666');
862 -
863 - if (name === 'post_type_visibility_mode') {
864 - $container.append($feedback);
865 - } else {
866 - $container.before($feedback);
867 - }
868 -
869 - $.ajax({
870 - url: mxchatAdmin.ajax_url,
871 - type: 'POST',
872 - data: {
873 - action: 'mxchat_save_setting',
874 - name: name,
875 - value: value,
876 - _ajax_nonce: mxchatAdmin.setting_nonce
877 - },
878 - success: function(response) {
879 - if (response.success) {
880 - $feedback.text('✓ Saved').css('color', '#46b450');
881 - setTimeout(function() {
882 - $feedback.fadeOut(300, function() {
883 - $(this).remove();
884 - });
885 - }, 1500);
886 - } else {
887 - $feedback.text('Error saving').css('color', '#dc3232');
888 - }
889 - },
890 - error: function() {
891 - $feedback.text('Error saving').css('color', '#dc3232');
892 - }
893 - });
894 - }
895 -})();
896 -
897 727 // Toggle visibility handlers
898 728 function toggleVisibility(selector) {
899 729 $(selector).on('click', function() {
900 730 var inputField = $(this).prev('input');
901 - // Check if this is a CSS-masked field (type="text" with mxchat-api-key-field class)
902 - if (inputField.hasClass('mxchat-api-key-field')) {
903 - // Use CSS class toggle for CSS-masked fields
904 - if (inputField.hasClass('mxchat-show-key')) {
905 - inputField.removeClass('mxchat-show-key');
906 - $(this).text('Show');
907 - } else {
908 - inputField.addClass('mxchat-show-key');
909 - $(this).text('Hide');
910 - }
731 + if (inputField.attr('type') === 'password') {
732 + inputField.attr('type', 'text');
733 + $(this).text('Hide');
911 734 } else {
912 - // Legacy type toggle for password fields
913 - if (inputField.attr('type') === 'password') {
914 - inputField.attr('type', 'text');
915 - $(this).text('Hide');
916 - } else {
917 - inputField.attr('type', 'password');
918 - $(this).text('Show');
919 - }
735 + inputField.attr('type', 'password');
736 + $(this).text('Show');
920 737 }
921 738 });
922 739 }
923 740
@@ -994,9 +811,8 @@
994 811 <button class="mxchat-model-category-btn" data-category="openai">OpenAI</button>
995 812 <button class="mxchat-model-category-btn" data-category="claude">Claude</button>
996 813 <button class="mxchat-model-category-btn" data-category="xai">X.AI</button>
997 814 <button class="mxchat-model-category-btn" data-category="deepseek">DeepSeek</button>
998 - <button class="mxchat-model-category-btn" data-category="custom">Custom / Local</button>
999 815 </div>
1000 816 <div class="mxchat-model-selector-grid" id="mxchat_models_grid"></div>
1001 817 </div>
1002 818 <div class="mxchat-model-selector-modal-footer">
@@ -1017,41 +833,35 @@
1017 833 openrouter: [
1018 834 { value: 'openrouter', label: 'OpenRouter', description: 'Access 100+ models from multiple providers (add API key to browse)' }
1019 835 ],
1020 836 gemini: [
1021 - { value: 'gemini-3-pro-preview', label: 'Gemini 3 Pro', description: 'Most intelligent model - multimodal understanding & agentic' },
1022 - { value: 'gemini-3-flash-preview', label: 'Gemini 3 Flash', description: 'Most balanced - speed, scale & frontier intelligence' },
1023 - { value: 'gemini-2.5-pro', label: 'Gemini 2.5 Pro', description: 'Advanced thinking - code, math, STEM & long context' },
1024 - { value: 'gemini-2.5-flash', label: 'Gemini 2.5 Flash', description: 'Best price-performance with thinking capabilities' },
1025 - { value: 'gemini-2.5-flash-lite', label: 'Gemini 2.5 Flash-Lite', description: 'Ultra fast - optimized for cost & high throughput' },
1026 - { value: 'gemini-2.0-flash', label: 'Gemini 2.0 Flash', description: 'Deprecated March 2026' },
1027 - { value: 'gemini-2.0-flash-lite', label: 'Gemini 2.0 Flash-Lite', description: 'Deprecated March 2026' },
1028 - { value: 'gemini-1.5-pro', label: 'Gemini 1.5 Pro', description: 'Deprecated September 2025' },
1029 - { value: 'gemini-1.5-flash', label: 'Gemini 1.5 Flash', description: 'Deprecated September 2025' },
837 + { value: 'gemini-2.0-flash', label: 'Gemini 2.0 Flash', description: 'Next-Gen features, speed & multimodal generation' },
838 + { value: 'gemini-2.0-flash-lite', label: 'Gemini 2.0 Flash-Lite', description: 'Cost-efficient with low latency' },
839 + { value: 'gemini-1.5-pro', label: 'Gemini 1.5 Pro', description: 'Complex reasoning tasks requiring more intelligence' },
840 + { value: 'gemini-1.5-flash', label: 'Gemini 1.5 Flash', description: 'Fast and versatile performance' },
1030 841 ],
1031 842 openai: [
1032 - { value: 'gpt-5.5', label: 'GPT-5.5', description: 'Latest Flagship — newest OpenAI reasoning and coding model' },
1033 - { value: 'gpt-5.4', label: 'GPT-5.4', description: 'Flagship reasoning and coding model' },
1034 - { value: 'gpt-5.4-mini', label: 'GPT-5.4 Mini', description: 'Fast and affordable with 400K context' },
1035 - { value: 'gpt-5.4-nano', label: 'GPT-5.4 Nano', description: 'Fastest and cheapest for lightweight tasks' },
1036 - { value: 'gpt-5.3-chat-latest', label: 'GPT-5.3 Chat', description: 'Optimized for natural conversations with reduced hallucinations' },
1037 - { value: 'gpt-5.2', label: 'GPT-5.2', description: 'Best general-purpose & agentic model with fast responses' },
1038 - { value: 'gpt-5.1-chat-latest', label: 'GPT-5.1 Chat Latest', description: 'Recommended for most use cases' },
1039 843 { value: 'gpt-5.1-2025-11-13', label: 'GPT-5.1', description: 'Flagship for coding & agentic tasks with low reasoning (400K context)' },
1040 844 { value: 'gpt-5', label: 'GPT-5', description: 'Flagship for coding, reasoning, and agentic tasks across domains' },
1041 - { value: 'gpt-5-mini', label: 'GPT-5 Mini', description: 'Fast and lightweight' },
845 + { value: 'gpt-5-mini', label: 'GPT-5 Mini', description: 'Faster, more cost-efficient for well-defined tasks and precise prompts' },
1042 846 { value: 'gpt-5-nano', label: 'GPT-5 Nano', description: 'Fastest and cheapest; ideal for summarization and classification' },
847 + { value: 'gpt-4.1-2025-04-14', label: 'GPT-4.1', description: 'Flagship model for complex tasks' },
848 + { value: 'gpt-4o', label: 'GPT-4o', description: 'Recommended for most use cases' },
849 + { value: 'gpt-4o-mini', label: 'GPT-4o Mini', description: 'Fast and lightweight' },
850 + { value: 'gpt-4-turbo', label: 'GPT-4 Turbo', description: 'High-performance model' },
851 + { value: 'gpt-4', label: 'GPT-4', description: 'High intelligence model' },
852 + { value: 'gpt-3.5-turbo', label: 'GPT-3.5 Turbo', description: 'Affordable and fast' },
1043 853 ],
1044 854 claude: [
1045 - { value: 'claude-opus-4-7', label: 'Claude Opus 4.7', description: 'Latest Flagship — newest Anthropic flagship model' },
1046 - { value: 'claude-opus-4-6', label: 'Claude Opus 4.6', description: 'Most capable Claude model - recommended' },
1047 - { value: 'claude-sonnet-4-6', label: 'Claude Sonnet 4.6', description: 'Latest Sonnet - excellent balance of speed and capability' },
1048 - { value: 'claude-opus-4-5', label: 'Claude Opus 4.5', description: 'Highly capable for complex tasks' },
1049 855 { value: 'claude-sonnet-4-5-20250929', label: 'Claude Sonnet 4.5', description: 'Best for complex agents and coding' },
1050 856 { value: 'claude-opus-4-1-20250805', label: 'Claude Opus 4.1', description: 'Exceptional for specialized complex tasks' },
1051 857 { value: 'claude-haiku-4-5-20251001', label: 'Claude Haiku 4.5', description: 'Fastest and most intelligent Haiku' },
1052 - { value: 'claude-opus-4-20250514', label: 'Claude 4 Opus', description: 'Complex tasks' },
858 + { value: 'claude-opus-4-20250514', label: 'Claude 4 Opus', description: 'Most capable Claude model' },
1053 859 { value: 'claude-sonnet-4-20250514', label: 'Claude 4 Sonnet', description: 'High performance' },
860 + { value: 'claude-3-7-sonnet-20250219', label: 'Claude 3.7 Sonnet', description: 'High intelligence' },
861 + { value: 'claude-3-opus-20240229', label: 'Claude 3 Opus', description: 'Highly complex tasks' },
862 + { value: 'claude-3-sonnet-20240229', label: 'Claude 3 Sonnet', description: 'Balanced performance' },
863 + { value: 'claude-3-haiku-20240307', label: 'Claude 3 Haiku', description: 'Fastest Claude model' },
1054 864 ],
1055 865 xai: [
1056 866 { value: 'grok-4-1-fast-reasoning', label: 'Grok 4.1 Fast (Reasoning)', description: '2M context window and reasoning' },
1057 867 { value: 'grok-4-1-fast-non-reasoning', label: 'Grok 4.1 Fast (Non-Reasoning)', description: '2M context window and faster responses' },
@@ -1064,11 +874,8 @@
1064 874 ],
1065 875 deepseek: [
1066 876 { value: 'deepseek-chat', label: 'DeepSeek-V3', description: 'Advanced AI assistant' },
1067 877 ],
1068 - custom: [
1069 - { value: 'custom-provider', label: 'Custom Provider', description: 'OpenAI-compatible local LLM (Ollama, LM Studio, vLLM, llama.cpp, Azure OpenAI) — configure Base URL, key, and model in API Keys tab' },
1070 - ],
1071 878 };
1072 879
1073 880 let allModels = [];
1074 881 Object.keys(models).forEach(key => {
@@ -1109,9 +916,8 @@
1109 916 if (modelValue.startsWith('gemini-')) return '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 48 48" class="mxchat-model-icon-gemini"><defs><path id="a" d="M44.5 20H24v8.5h11.8C34.7 33.9 30.1 37 24 37c-7.2 0-13-5.8-13-13s5.8-13 13-13c3.1 0 5.9 1.1 8.1 2.9l6.4-6.4C34.6 4.1 29.6 2 24 2 11.8 2 2 11.8 2 24s9.8 22 22 22c11 0 21-8 21-22 0-1.3-.2-2.7-.5-4z"></path></defs><clipPath id="b"><use xlink:href="#a" overflow="visible"></use></clipPath><path clip-path="url(#b)" fill="#FBBC05" d="M0 37V11l17 13z"></path><path clip-path="url(#b)" fill="#EA4335" d="M0 11l17 13 7-6.1L48 14V0H0z"></path><path clip-path="url(#b)" fill="#34A853" d="M0 37l30-23 7.9 1L48 0v48H0z"></path><path clip-path="url(#b)" fill="#4285F4" d="M48 48L17 24l-4-3 35-10z"></path></svg>';
1110 917 if (modelValue.startsWith('gpt-')) return '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 320" class="mxchat-model-icon-openai"><path fill="currentColor" d="M297 131a80.6 80.6 0 0 0-93.7-104.2 80.6 80.6 0 0 0-137 29A80.6 80.6 0 0 0 23 189a80.6 80.6 0 0 0 93.7 104.2 80.6 80.6 0 0 0 137-29A80.7 80.7 0 0 0 297.1 131zM176.9 299c-14 .1-27.6-4.8-38.4-13.8l1.9-1 63.7-36.9c3.3-1.8 5.3-5.3 5.2-9v-89.9l27 15.6c.3.1.4.4.5.7v74.4a60 60 0 0 1-60 60zM47.9 244a59.7 59.7 0 0 1-7.1-40.1l1.9 1.1 63.7 36.8c3.2 1.9 7.2 1.9 10.5 0l77.8-45V228c0 .3-.2.6-.4.8L129.9 266a60 60 0 0 1-82-22zM31.2 105c7-12.2 18-21.5 31.2-26.3v75.8c0 3.7 2 7.2 5.2 9l77.8 45-27 15.5a1 1 0 0 1-.9 0L53.1 187a60 60 0 0 1-22-82zm221.2 51.5-77.8-45 27-15.5a1 1 0 0 1 .9 0l64.4 37.1a60 60 0 0 1-9.3 108.2v-75.8c0-3.7-2-7.2-5.2-9zm26.8-40.4-1.9-1.1-63.7-36.8a10.4 10.4 0 0 0-10.5 0L125.4 123V92c0-.3 0-.6.3-.8L190.1 54a60 60 0 0 1 89.1 62.1zm-168.5 55.4-27-15.5a1 1 0 0 1-.4-.7V80.9a60 60 0 0 1 98.3-46.1l-1.9 1L116 72.8a10.3 10.3 0 0 0-5.2 9v89.8zm14.6-31.5 34.7-20 34.6 20v40L160 200l-34.7-20z"></path></svg>';
1111 918 if (modelValue.startsWith('claude-')) return '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 176" fill="none" class="mxchat-model-icon-claude"><path fill="currentColor" d="m147.487 0l70.081 175.78H256L185.919 0zM66.183 106.221l23.98-61.774l23.98 61.774zM70.07 0L0 175.78h39.18l14.33-36.914h73.308l14.328 36.914h39.179L110.255 0z"></path></svg>';
1112 919 if (modelValue.startsWith('grok-')) return '<svg fill="currentColor" fill-rule="evenodd" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="mxchat-model-icon-xai"><path d="M6.469 8.776L16.512 23h-4.464L2.005 8.776H6.47zm-.004 7.9l2.233 3.164L6.467 23H2l4.465-6.324zM22 2.582V23h-3.659V7.764L22 2.582zM22 1l-9.952 14.095-2.233-3.163L17.533 1H22z"></path></svg>';
1113 - if (modelValue === 'custom-provider' || modelValue.startsWith('custom-')) return '<span class="dashicons dashicons-admin-site-alt3" style="font-size: 24px; color: #2c8a3d;"></span>';
1114 920 if (modelValue.startsWith('deepseek-')) return '<svg height="1em" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg" class="mxchat-model-icon-deepseek"><path d="M23.748 4.482c-.254-.124-.364.113-.512.234-.051.039-.094.09-.137.136-.372.397-.806.657-1.373.626-.829-.046-1.537.214-2.163.848-.133-.782-.575-1.248-1.247-1.548-.352-.156-.708-.311-.955-.65-.172-.241-.219-.51-.305-.774-.055-.16-.11-.323-.293-.35-.2-.031-.278.136-.356.276-.313.572-.434 1.202-.422 1.84.027 1.436.633 2.58 1.838 3.393.137.093.172.187.129.323-.082.28-.18.552-.266.833-.055.179-.137.217-.329.14a5.526 5.526 0 01-1.736-1.18c-.857-.828-1.631-1.742-2.597-2.458a11.365 11.365 0 00-.689-.471c-.985-.957.13-1.743.388-1.836.27-.098.093-.432-.779-.428-.872.004-1.67.295-2.687.684a3.055 3.055 0 01-.465.137 9.597 9.597 0 00-2.883-.102c-1.885.21-3.39 1.102-4.497 2.623C.082 8.606-.231 10.684.152 12.85c.403 2.284 1.569 4.175 3.36 5.653 1.858 1.533 3.997 2.284 6.438 2.14 1.482-.085 3.133-.284 4.994-1.86.47.234.962.327 1.78.397.63.059 1.236-.03 1.705-.128.735-.156.684-.837.419-.961-2.155-1.004-1.682-.595-2.113-.926 1.096-1.296 2.746-2.642 3.392-7.003.05-.347.007-.565 0-.845-.004-.17.035-.237.23-.256a4.173 4.173 0 001.545-.475c1.396-.763 1.96-2.015 2.093-3.517.02-.23-.004-.467-.247-.588zM11.581 18c-2.089-1.642-3.102-2.183-3.52-2.16-.392.024-.321.471-.235.763.09.288.207.486.371.739.114.167.192.416-.113.603-.673.416-1.842-.14-1.897-.167-1.361-.802-2.5-1.86-3.301-3.307-.774-1.393-1.224-2.887-1.298-4.482-.02-.386.093-.522.477-.592a4.696 4.696 0 011.529-.039c2.132.312 3.946 1.265 5.468 2.774.868.86 1.525 1.887 2.202 2.891.72 1.066 1.494 2.082 2.48 2.914.348.292.625.514.891.677-.802.09-2.14.11-3.054-.614zm1-6.44a.306.306 0 01.415-.287.302.302 0 01.2.288.306.306 0 01-.31.307.303.303 0 01-.304-.308zm3.11 1.596c-.2.081-.399.151-.59.16a1.245 1.245 0 01-.798-.254c-.274-.23-.47-.358-.552-.758a1.73 1.73 0 01.016-.588c.07-.327-.008-.537-.239-.727-.187-.156-.426-.199-.688-.199a.559.559 0 01-.254-.078c-.11-.054-.2-.19-.114-.358.028-.054.16-.186.192-.21.356-.202.767-.136 1.146.016.352.144.618.408 1.001.782.391.451.462.576.685.914.176.265.336.537.445.848.067.195-.019.354-.25.452z" fill="currentColor"></path></svg>';
1115 921 return '<span class="dashicons dashicons-admin-generic mxchat-model-icon-generic"></span>';
1116 922 }
1117 923
@@ -1624,71 +1430,8 @@
1624 1430 });
1625 1431
1626 1432 }
1627 1433
1628 -// 3.2.3: Confirmation dialog shown when the user attempts to switch embedding
1629 -// models after they've already embedded content with a different model. Mixing
1630 -// embeddings from two models silently breaks similarity matching.
1631 -function showEmbeddingSwitchWarning(data, newValue, onChoice) {
1632 - $('#mxchat_embedding_switch_warning').remove();
1633 -
1634 - const dimsBlock = data.dims_differ ? `
1635 - <div class="mxchat-embed-warn-dims">
1636 - <strong>Dimension mismatch:</strong>
1637 - Existing vectors are ${data.active_dims}-dimensional, but ${data.new_label}
1638 - produces ${data.new_dims}-dimensional vectors.
1639 - If you use Pinecone, your index will reject queries entirely until you re-embed.
1640 - </div>` : '';
1641 -
1642 - const $modal = $(`
1643 - <div id="mxchat_embedding_switch_warning" class="mxchat-embed-warn-overlay">
1644 - <div class="mxchat-embed-warn-dialog">
1645 - <div class="mxchat-embed-warn-header">
1646 - <span class="mxchat-embed-warn-icon">⚠️</span>
1647 - <h3>Switching embedding models will break similarity matching</h3>
1648 - </div>
1649 - <div class="mxchat-embed-warn-body">
1650 - <p>
1651 - Your knowledge base and actions are currently embedded with
1652 - <code>${data.active_label}</code>. Switching to
1653 - <code>${data.new_label}</code> means new queries are embedded with
1654 - a different model than the stored vectors — the chatbot will return
1655 - inaccurate results or fail to match anything.
1656 - </p>
1657 - ${dimsBlock}
1658 - <p><strong>To switch safely:</strong></p>
1659 - <ol>
1660 - <li>Go to <em>Knowledge Base</em> and delete all existing entries.</li>
1661 - <li>Go to <em>Actions</em> and delete all existing actions.</li>
1662 - <li>Come back here, switch the model, then re-import your content and re-add your actions.</li>
1663 - </ol>
1664 - </div>
1665 - <div class="mxchat-embed-warn-footer">
1666 - <button type="button" class="button button-secondary" id="mxchat_embed_warn_cancel">Cancel — keep ${data.active_label}</button>
1667 - <button type="button" class="button button-primary mxchat-embed-warn-danger" id="mxchat_embed_warn_continue">Switch anyway (I'll handle it)</button>
1668 - </div>
1669 - </div>
1670 - </div>
1671 - `);
1672 -
1673 - $('body').append($modal);
1674 -
1675 - let resolved = false;
1676 - function resolve(confirmed) {
1677 - if (resolved) return;
1678 - resolved = true;
1679 - $modal.remove();
1680 - if (typeof onChoice === 'function') onChoice(confirmed);
1681 - }
1682 -
1683 - // Click on the overlay background dismisses (cancel)
1684 - $modal.on('click', function(e) {
1685 - if (e.target === $modal[0]) resolve(false);
1686 - });
1687 - $modal.find('#mxchat_embed_warn_cancel').on('click', function() { resolve(false); });
1688 - $modal.find('#mxchat_embed_warn_continue').on('click', function() { resolve(true); });
1689 -}
1690 -
1691 1434 // Embedding model selector - completely separate from chat model selector
1692 1435 function setupMxChatEmbeddingModelSelector() {
1693 1436 const $embeddingModelSelect = $('#embedding_model');
1694 1437
@@ -1782,11 +1525,11 @@
1782 1525 }
1783 1526 ],
1784 1527 gemini: [
1785 1528 {
1786 - value: 'gemini-embedding-001',
1787 - label: 'Gemini Embedding',
1788 - description: 'Stable SOTA embeddings (1536 dimensions, 8K context)'
1529 + value: 'gemini-embedding-exp-03-07',
1530 + label: 'Gemini Embedding',
1531 + description: 'Experimental SOTA embeddings (1536 dimensions, 8K context)'
1789 1532 }
1790 1533 ]
1791 1534 };
1792 1535
@@ -1869,53 +1612,25 @@
1869 1612 const activeCategory = $('.mxchat-embedding-model-selector-categories .mxchat-embedding-model-category-btn.active').data('category');
1870 1613 populateEmbeddingModelsGrid(searchTerm, activeCategory);
1871 1614 });
1872 1615
1873 - // 3.2.3: Commit a model change — same as the original click handler, just
1874 - // factored out so it can be invoked from both the safe path and the
1875 - // post-confirmation path.
1876 - function commitEmbeddingModelChange(modelValue) {
1616 + // Use a direct selector to avoid conflicts with other card elements
1617 + $(document).on('click.embeddingModelSelector', '.mxchat-embedding-model-selector-grid .mxchat-embedding-model-selector-card', function(e) {
1618 + e.stopPropagation(); // Prevent event bubbling
1619 + const modelValue = $(this).data('value');
1620 +
1621 + // Important: Only update this specific select element
1877 1622 $embeddingModelSelect.val(modelValue);
1623 +
1624 + // Manually trigger change only on this element
1878 1625 const changeEvent = new Event('change', { bubbles: true });
1879 1626 $embeddingModelSelect[0].dispatchEvent(changeEvent);
1627 +
1628 + // Update button text
1880 1629 updateButtonText();
1630 +
1631 + // Hide modal
1881 1632 $('#' + embeddingModalId).hide();
1882 - }
1883 -
1884 - // Use a direct selector to avoid conflicts with other card elements
1885 - $(document).on('click.embeddingModelSelector', '.mxchat-embedding-model-selector-grid .mxchat-embedding-model-selector-card', function(e) {
1886 - e.stopPropagation(); // Prevent event bubbling
1887 - const modelValue = $(this).data('value');
1888 - const previousValue = $embeddingModelSelect.val();
1889 -
1890 - // No-op if the user clicked the already-selected card
1891 - if (modelValue === previousValue) {
1892 - $('#' + embeddingModalId).hide();
1893 - return;
1894 - }
1895 -
1896 - // 3.2.3: Preflight — if the user has content embedded with a different
1897 - // model, surface a confirmation dialog before committing the switch.
1898 - $.post(ajaxurl, {
1899 - action: 'mxchat_check_embedding_switch',
1900 - security: (typeof mxchatAdmin !== 'undefined' ? mxchatAdmin.nonce : ''),
1901 - new_model: modelValue
1902 - }).done(function(resp) {
1903 - if (resp && resp.success && resp.data && resp.data.is_mismatch) {
1904 - showEmbeddingSwitchWarning(resp.data, modelValue, function(confirmed) {
1905 - if (confirmed) {
1906 - commitEmbeddingModelChange(modelValue);
1907 - }
1908 - });
1909 - } else {
1910 - commitEmbeddingModelChange(modelValue);
1911 - }
1912 - }).fail(function() {
1913 - // If preflight fails, fall back to the original behavior so a network
1914 - // hiccup doesn't block legitimate model switches.
1915 - commitEmbeddingModelChange(modelValue);
1916 - });
1917 - return;
1918 1633 });
1919 1634
1920 1635 // Close modal when clicking outside - use namespaced events
1921 1636 $(window).on('click.embeddingModelSelector', function(event) {
@@ -1940,22 +1655,8 @@
1940 1655
1941 1656 // Inline Edit Functionality
1942 1657 $('.edit-button').on('click', function() {
1943 1658 var row = $(this).closest('tr');
1944 -
1945 - // Clear URL field if it's a manual content URL (mxchat:// protocol)
1946 - var urlEdit = row.find('.url-edit');
1947 - if (urlEdit.length && urlEdit.val().indexOf('mxchat://') === 0) {
1948 - urlEdit.val('');
1949 - }
1950 -
1951 - // Expand the accordion to show the edit textarea (fixes short content editing)
1952 - var contentFull = row.find('.mxchat-content-full');
1953 - if (contentFull.length && contentFull.is(':hidden')) {
1954 - contentFull.show();
1955 - row.find('.mxchat-content-preview').hide();
1956 - }
1957 -
1958 1659 row.find('.content-view, .url-view').hide();
1959 1660 row.find('.content-edit, .url-edit').show();
1960 1661 row.find('.edit-button').hide();
1961 1662 row.find('.save-button').show();
@@ -1988,25 +1689,21 @@
1988 1689 },
1989 1690 success: function(response) {
1990 1691 button.prop('disabled', false);
1991 1692 button.text('Save');
1992 -
1693 +
1993 1694 if (response.success) {
1994 1695 row.find('.content-view').html(newContent.replace(/\n/g, "<br>"));
1995 1696 if (newUrl) {
1996 - row.find('.url-view').html('<a href="' + newUrl + '" target="_blank"><span class="dashicons dashicons-external"></span> View Source</a>');
1697 + row.find('.url-view').html('<a href="' + newUrl + '" target="_blank">' + newUrl + '</a>');
1997 1698 } else {
1998 - row.find('.url-view').html('<span class="mxchat-na">Manual Content</span>');
1699 + row.find('.url-view').html('N/A');
1999 1700 }
2000 -
1701 +
2001 1702 row.find('.content-edit, .url-edit').hide();
2002 1703 row.find('.content-view, .url-view').show();
2003 1704 row.find('.save-button').hide();
2004 1705 row.find('.edit-button').show();
2005 -
2006 - // Restore accordion state - show preview, hide full content
2007 - row.find('.mxchat-content-preview').show();
2008 - row.find('.mxchat-content-full').hide();
2009 1706 } else {
2010 1707 alert('Error saving content: ' + (response.data?.message || 'Unknown error'));
2011 1708 }
2012 1709 },
@@ -2213,14 +1910,24 @@
2213 1910 const actionLabel = this.dataset.label;
2214 1911 const actionIcon = this.querySelector('.dashicons').getAttribute('class').replace('dashicons dashicons-', '');
2215 1912 const actionDescription = this.querySelector('p').textContent;
2216 1913
2217 - // Check if this is a promotional card (add-on not installed)
2218 - const isPromo = this.dataset.promo === 'true';
2219 -
2220 - if (isPromo || (addonName && !isInstalled)) {
2221 - // Add-on required but not installed — show informational notice
2222 - const addonDisplayName = this.querySelector('.mxchat-addon-info')?.textContent?.replace('Requires ', '').replace('— Get Add-on', '').trim() || addonName + ' Add-on';
1914 + // Pro check using the proper detection method
1915 + const proIsActivated = typeof mxchatAdmin !== 'undefined' &&
1916 + (mxchatAdmin.is_activated === '1' ||
1917 + mxchatAdmin.is_activated === 'true' ||
1918 + mxchatAdmin.is_activated === true);
1919 +
1920 + // Handle different states
1921 + if (isPro && !proIsActivated) {
1922 + // Pro feature but no Pro license
1923 + showProFeatureNotice();
1924 + return;
1925 + }
1926 +
1927 + if (addonName && !isInstalled) {
1928 + // Add-on required but not installed
1929 + const addonDisplayName = this.querySelector('.mxchat-addon-info')?.textContent?.replace('Requires ', '') || addonName + ' Add-on';
2223 1930 showAddonRequiredNotice(addonDisplayName);
2224 1931 return;
2225 1932 }
2226 1933
@@ -2632,27 +2339,37 @@
2632 2339 }
2633 2340 });
2634 2341
2635 2342 jQuery(document).ready(function($) {
2636 - // Auto-expand custom post types container if any are checked
2637 - // Note: Click handler is in admin-knowledge-page.php inline script (initCustomPostTypesToggle)
2343 + // Toggle custom post types container
2344 + $('#mxchat-custom-post-types-toggle').on('click', function(e) {
2345 + e.preventDefault();
2346 +
2347 + $('#mxchat-custom-post-types-container').slideToggle(300);
2348 +
2349 + // Rotate the toggle icon
2350 + const $icon = $(this).find('.mxchat-accordion-icon');
2351 + if ($('#mxchat-custom-post-types-container').is(':visible')) {
2352 + $icon.css('transform', 'rotate(180deg)');
2353 + $(this).closest('.mxchat-settings-accordion').addClass('active');
2354 + } else {
2355 + $icon.css('transform', 'rotate(0deg)');
2356 + $(this).closest('.mxchat-settings-accordion').removeClass('active');
2357 + }
2358 + });
2359 +
2360 + // If there are any selections made, auto-expand the container
2638 2361 function autoExpandIfNeeded() {
2639 - const $container = $('#mxchat-custom-post-types-container');
2640 - const $toggleBtn = $('#mxchat-custom-post-types-toggle');
2641 -
2642 - if ($container.length === 0) return;
2643 -
2644 - const hasCheckedItems = $container.find('input[type="checkbox"]:checked').length > 0;
2645 -
2362 + // Check if any checkbox in the container is checked
2363 + const hasCheckedItems = $('#mxchat-custom-post-types-container input[type="checkbox"]:checked').length > 0;
2364 +
2646 2365 if (hasCheckedItems) {
2647 - $container.show();
2648 - const $icon = $toggleBtn.find('span:last-child');
2649 - if ($icon.length) {
2650 - $icon.text('▲');
2651 - }
2366 + $('#mxchat-custom-post-types-container').show();
2367 + $('#mxchat-custom-post-types-toggle .mxchat-accordion-icon').css('transform', 'rotate(180deg)');
2368 + $('.mxchat-settings-accordion').addClass('active');
2652 2369 }
2653 2370 }
2654 -
2371 +
2655 2372 // Run on page load
2656 2373 autoExpandIfNeeded();
2657 2374 });
2658 2375
@@ -3063,572 +2780,7 @@
3063 2780 refreshAPIKeyStatus();
3064 2781 }
3065 2782
3066 2783 // Run when model changes
3067 - $('#model').on('change', function() {
3068 - updateChatModelAPIStatus();
3069 - updateWebSearchToggleVisibility();
3070 - });
2784 + $('#model').on('change', function() { updateChatModelAPIStatus(); });
3071 2785 $('#embedding_model').on('change', function() { updateEmbeddingModelAPIStatus(); });
3072 -
3073 - // Web Search toggle visibility based on model
3074 - function updateWebSearchToggleVisibility() {
3075 - var selectedModel = $('#model').val();
3076 - var $wrapper = $('#web-search-toggle-wrapper');
3077 - var $unavailableMessage = $('#web-search-unavailable-message');
3078 -
3079 - if (!$wrapper.length) return; // Element doesn't exist
3080 -
3081 - // Get the list of supported OpenAI models from data attribute
3082 - var openaiModelsAttr = $wrapper.data('openai-models');
3083 - var unsupportedModelsAttr = $wrapper.data('unsupported-models');
3084 -
3085 - var openaiModels = openaiModelsAttr ? openaiModelsAttr.split(',') : [];
3086 - var unsupportedModels = unsupportedModelsAttr ? unsupportedModelsAttr.split(',') : [];
3087 -
3088 - // Check if selected model is an OpenAI model that supports web search
3089 - var isOpenAI = openaiModels.includes(selectedModel);
3090 - var isSupported = isOpenAI && !unsupportedModels.includes(selectedModel);
3091 -
3092 - if (isSupported) {
3093 - $wrapper.show();
3094 - $unavailableMessage.hide();
3095 - } else {
3096 - $wrapper.hide();
3097 - $unavailableMessage.show();
3098 - }
3099 - }
3100 -
3101 - // Run on page load
3102 - updateWebSearchToggleVisibility();
3103 -});
3104 -
3105 -// Transcripts Metrics Dashboard
3106 -jQuery(document).ready(function($) {
3107 - // Tab switching functionality
3108 - $('.mxchat-metrics-tab').on('click', function() {
3109 - const tabName = $(this).data('tab');
3110 -
3111 - // Update tab buttons
3112 - $('.mxchat-metrics-tab').removeClass('active');
3113 - $(this).addClass('active');
3114 -
3115 - // Update panels
3116 - $('.mxchat-metrics-panel').removeClass('active');
3117 - $(`.mxchat-metrics-panel[data-panel="${tabName}"]`).addClass('active');
3118 -
3119 - // Initialize chart if activity tab is shown
3120 - if (tabName === 'activity' && typeof mxchatChartData !== 'undefined') {
3121 - // Small delay to ensure the canvas is visible
3122 - setTimeout(function() {
3123 - initActivityChart();
3124 - }, 50);
3125 - }
3126 - });
3127 -
3128 - // Initialize chart function
3129 - function initActivityChart() {
3130 - const canvas = document.getElementById('mxchat-activity-chart');
3131 - if (!canvas) return;
3132 -
3133 - // Check if chart already exists and destroy it
3134 - if (canvas.chartInstance) {
3135 - canvas.chartInstance.destroy();
3136 - }
3137 -
3138 - const ctx = canvas.getContext('2d');
3139 -
3140 - // Create gradient for chats line
3141 - const chatsGradient = ctx.createLinearGradient(0, 0, 0, 300);
3142 - chatsGradient.addColorStop(0, 'rgba(102, 126, 234, 0.3)');
3143 - chatsGradient.addColorStop(1, 'rgba(102, 126, 234, 0.05)');
3144 -
3145 - // Create gradient for messages line
3146 - const messagesGradient = ctx.createLinearGradient(0, 0, 0, 300);
3147 - messagesGradient.addColorStop(0, 'rgba(118, 75, 162, 0.3)');
3148 - messagesGradient.addColorStop(1, 'rgba(118, 75, 162, 0.05)');
3149 -
3150 - // Simple chart without external library
3151 - canvas.chartInstance = new SimpleChart(canvas, {
3152 - labels: mxchatChartData.labels,
3153 - datasets: [
3154 - {
3155 - label: 'Chats',
3156 - data: mxchatChartData.chats,
3157 - borderColor: '#667eea',
3158 - backgroundColor: chatsGradient,
3159 - fill: true
3160 - },
3161 - {
3162 - label: 'Messages',
3163 - data: mxchatChartData.messages,
3164 - borderColor: '#764ba2',
3165 - backgroundColor: messagesGradient,
3166 - fill: true
3167 - }
3168 - ]
3169 - });
3170 - }
3171 -
3172 - // Simple chart implementation (no external dependencies)
3173 - class SimpleChart {
3174 - constructor(canvas, config) {
3175 - this.canvas = canvas;
3176 - this.ctx = canvas.getContext('2d');
3177 - this.config = config;
3178 - this.padding = { top: 20, right: 20, bottom: 40, left: 50 };
3179 - this.render();
3180 - }
3181 -
3182 - destroy() {
3183 - this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
3184 - }
3185 -
3186 - render() {
3187 - const dpr = window.devicePixelRatio || 1;
3188 - const rect = this.canvas.getBoundingClientRect();
3189 -
3190 - this.canvas.width = rect.width * dpr;
3191 - this.canvas.height = rect.height * dpr;
3192 - this.ctx.scale(dpr, dpr);
3193 -
3194 - this.canvas.style.width = rect.width + 'px';
3195 - this.canvas.style.height = rect.height + 'px';
3196 -
3197 - const width = rect.width - this.padding.left - this.padding.right;
3198 - const height = rect.height - this.padding.top - this.padding.bottom;
3199 -
3200 - // Find max value
3201 - let maxValue = 0;
3202 - this.config.datasets.forEach(dataset => {
3203 - const max = Math.max(...dataset.data);
3204 - if (max > maxValue) maxValue = max;
3205 - });
3206 -
3207 - // Add some padding to max value
3208 - maxValue = Math.ceil(maxValue * 1.1);
3209 - if (maxValue === 0) maxValue = 10;
3210 -
3211 - // Draw grid lines
3212 - this.ctx.strokeStyle = '#e5e7eb';
3213 - this.ctx.lineWidth = 1;
3214 - const gridLines = 5;
3215 -
3216 - for (let i = 0; i <= gridLines; i++) {
3217 - const y = this.padding.top + (height / gridLines) * i;
3218 - this.ctx.beginPath();
3219 - this.ctx.moveTo(this.padding.left, y);
3220 - this.ctx.lineTo(this.padding.left + width, y);
3221 - this.ctx.stroke();
3222 -
3223 - // Draw y-axis labels
3224 - const value = maxValue - (maxValue / gridLines) * i;
3225 - this.ctx.fillStyle = '#6b7280';
3226 - this.ctx.font = '12px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
3227 - this.ctx.textAlign = 'right';
3228 - this.ctx.fillText(Math.round(value), this.padding.left - 10, y + 4);
3229 - }
3230 -
3231 - // Draw datasets
3232 - this.config.datasets.forEach(dataset => {
3233 - const points = [];
3234 - const xStep = width / (this.config.labels.length - 1 || 1);
3235 -
3236 - dataset.data.forEach((value, index) => {
3237 - const x = this.padding.left + (xStep * index);
3238 - const y = this.padding.top + height - (value / maxValue * height);
3239 - points.push({ x, y, value });
3240 - });
3241 -
3242 - // Draw filled area
3243 - if (dataset.fill && dataset.backgroundColor) {
3244 - this.ctx.fillStyle = dataset.backgroundColor;
3245 - this.ctx.beginPath();
3246 - this.ctx.moveTo(points[0].x, this.padding.top + height);
3247 - points.forEach(point => {
3248 - this.ctx.lineTo(point.x, point.y);
3249 - });
3250 - this.ctx.lineTo(points[points.length - 1].x, this.padding.top + height);
3251 - this.ctx.closePath();
3252 - this.ctx.fill();
3253 - }
3254 -
3255 - // Draw line
3256 - this.ctx.strokeStyle = dataset.borderColor;
3257 - this.ctx.lineWidth = 3;
3258 - this.ctx.lineCap = 'round';
3259 - this.ctx.lineJoin = 'round';
3260 -
3261 - this.ctx.beginPath();
3262 - points.forEach((point, index) => {
3263 - if (index === 0) {
3264 - this.ctx.moveTo(point.x, point.y);
3265 - } else {
3266 - this.ctx.lineTo(point.x, point.y);
3267 - }
3268 - });
3269 - this.ctx.stroke();
3270 -
3271 - // Draw points
3272 - points.forEach(point => {
3273 - this.ctx.fillStyle = '#ffffff';
3274 - this.ctx.beginPath();
3275 - this.ctx.arc(point.x, point.y, 5, 0, Math.PI * 2);
3276 - this.ctx.fill();
3277 - this.ctx.strokeStyle = dataset.borderColor;
3278 - this.ctx.lineWidth = 2;
3279 - this.ctx.stroke();
3280 - });
3281 - });
3282 -
3283 - // Draw x-axis labels
3284 - const xStep = width / (this.config.labels.length - 1 || 1);
3285 - this.ctx.fillStyle = '#6b7280';
3286 - this.ctx.font = '12px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
3287 - this.ctx.textAlign = 'center';
3288 -
3289 - this.config.labels.forEach((label, index) => {
3290 - const x = this.padding.left + (xStep * index);
3291 - this.ctx.fillText(label, x, this.padding.top + height + 20);
3292 - });
3293 -
3294 - // Draw legend
3295 - let legendX = this.padding.left;
3296 - const legendY = rect.height - 10;
3297 -
3298 - this.config.datasets.forEach((dataset, index) => {
3299 - // Color box
3300 - this.ctx.fillStyle = dataset.borderColor;
3301 - this.ctx.fillRect(legendX, legendY - 8, 12, 12);
3302 -
3303 - // Label
3304 - this.ctx.fillStyle = '#374151';
3305 - this.ctx.font = '12px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
3306 - this.ctx.textAlign = 'left';
3307 - this.ctx.fillText(dataset.label, legendX + 18, legendY);
3308 -
3309 - legendX += this.ctx.measureText(dataset.label).width + 40;
3310 - });
3311 - }
3312 - }
3313 -
3314 - // Initialize chart on page load if we're on the activity tab
3315 - if ($('.mxchat-metrics-tab.active').data('tab') === 'activity' && typeof mxchatChartData !== 'undefined') {
3316 - setTimeout(function() {
3317 - initActivityChart();
3318 - }, 100);
3319 - }
3320 -
3321 - // ========================================
3322 - // SLACK TEST CONNECTION
3323 - // ========================================
3324 - $('#mxchat-test-slack-connection').on('click', function() {
3325 - var $button = $(this);
3326 - var $result = $('#mxchat-slack-test-result');
3327 - var originalText = $button.html();
3328 -
3329 - // Show loading state
3330 - $button.prop('disabled', true).html(
3331 - '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="margin-right: 8px; animation: spin 1s linear infinite;"><circle cx="12" cy="12" r="10" stroke-dasharray="32" stroke-dashoffset="12"/></svg>' +
3332 - 'Testing...'
3333 - );
3334 -
3335 - $.ajax({
3336 - url: ajaxurl,
3337 - type: 'POST',
3338 - data: {
3339 - action: 'mxchat_test_slack_connection',
3340 - nonce: mxchatAdmin.nonce
3341 - },
3342 - success: function(response) {
3343 - $result.show();
3344 - if (response.success) {
3345 - $result.html(
3346 - '<div style="background: #d4edda; border: 1px solid #c3e6cb; color: #155724; padding: 16px; border-radius: 8px;">' +
3347 - '<strong style="display: block; margin-bottom: 8px;">✓ Connection Successful!</strong>' +
3348 - '<pre style="margin: 0; white-space: pre-wrap; font-size: 13px;">' + escapeHtml(response.data.message) + '</pre>' +
3349 - '</div>'
3350 - );
3351 - } else {
3352 - var bgColor = response.data.partial ? '#fff3cd' : '#f8d7da';
3353 - var borderColor = response.data.partial ? '#ffeeba' : '#f5c6cb';
3354 - var textColor = response.data.partial ? '#856404' : '#721c24';
3355 - var icon = response.data.partial ? '⚠' : '✗';
3356 - var title = response.data.partial ? 'Partial Success - Missing Scopes' : 'Connection Failed';
3357 -
3358 - $result.html(
3359 - '<div style="background: ' + bgColor + '; border: 1px solid ' + borderColor + '; color: ' + textColor + '; padding: 16px; border-radius: 8px;">' +
3360 - '<strong style="display: block; margin-bottom: 8px;">' + icon + ' ' + title + '</strong>' +
3361 - '<pre style="margin: 0; white-space: pre-wrap; font-size: 13px;">' + escapeHtml(response.data.message) + '</pre>' +
3362 - (response.data.missing_scopes ? '<p style="margin: 12px 0 0; font-size: 13px;">Add these scopes in your Slack app settings and reinstall the app.</p>' : '') +
3363 - '</div>'
3364 - );
3365 - }
3366 - },
3367 - error: function() {
3368 - $result.show().html(
3369 - '<div style="background: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; padding: 16px; border-radius: 8px;">' +
3370 - '<strong>✗ Request Failed</strong><br>Could not connect to the server. Please try again.' +
3371 - '</div>'
3372 - );
3373 - },
3374 - complete: function() {
3375 - $button.prop('disabled', false).html(originalText);
3376 - }
3377 - });
3378 - });
3379 -
3380 - // Helper function to escape HTML
3381 - function escapeHtml(text) {
3382 - var div = document.createElement('div');
3383 - div.appendChild(document.createTextNode(text));
3384 - return div.innerHTML;
3385 - }
3386 -
3387 - // ========================================
3388 - // DEBUG & OPTIMIZATION TOOLS
3389 - // ========================================
3390 -
3391 - // Debug Mode Toggle
3392 - $('#mxchat_debug_mode').on('change', function() {
3393 - var $toggle = $(this);
3394 - var enabled = $toggle.is(':checked') ? 'on' : 'off';
3395 - var $label = $toggle.closest('label');
3396 -
3397 - // Add loading indicator next to the toggle label
3398 - var $indicator = $label.find('.mxchat-save-indicator');
3399 - if ($indicator.length === 0) {
3400 - $indicator = $('<span class="mxchat-save-indicator" style="margin-left: 10px;"></span>');
3401 - $label.append($indicator);
3402 - }
3403 - $indicator.html('<span class="mxchat-saving-spinner"></span>').show();
3404 -
3405 - $.ajax({
3406 - url: ajaxurl,
3407 - type: 'POST',
3408 - data: {
3409 - action: 'mxchat_toggle_debug_mode',
3410 - enabled: enabled,
3411 - _ajax_nonce: mxchatAdmin.setting_nonce
3412 - },
3413 - success: function(response) {
3414 - if (response.success) {
3415 - // Show success indicator
3416 - $indicator.html('<span class="mxchat-save-success">✓</span>');
3417 - setTimeout(function() {
3418 - $indicator.fadeOut(300);
3419 - }, 2000);
3420 -
3421 - // Always refresh the log after toggling
3422 - refreshDebugLog();
3423 - } else {
3424 - $indicator.html('<span class="mxchat-save-error">✗</span>');
3425 - alert(response.data.message || 'Error toggling debug mode');
3426 - $toggle.prop('checked', !$toggle.is(':checked'));
3427 - }
3428 - },
3429 - error: function() {
3430 - $indicator.html('<span class="mxchat-save-error">✗</span>');
3431 - alert('Error toggling debug mode');
3432 - $toggle.prop('checked', !$toggle.is(':checked'));
3433 - }
3434 - });
3435 - });
3436 -
3437 - // Refresh Debug Log
3438 - function refreshDebugLog() {
3439 - var $container = $('#mxchat-debug-log');
3440 - var $countBadge = $('#mxchat-log-count');
3441 -
3442 - $.ajax({
3443 - url: ajaxurl,
3444 - type: 'POST',
3445 - data: {
3446 - action: 'mxchat_get_debug_log',
3447 - _ajax_nonce: mxchatAdmin.setting_nonce
3448 - },
3449 - success: function(response) {
3450 - if (response.success) {
3451 - var log = response.data.log;
3452 - var count = response.data.count;
3453 -
3454 - if (count > 0) {
3455 - $countBadge.text(count + ' entries').show();
3456 - var html = '<div class="mxchat-debug-log-entries">';
3457 - log.forEach(function(entry) {
3458 - var typeClass = 'mxchat-log-type-' + entry.type;
3459 - var typeLabel = entry.type.replace(/_/g, ' ').toUpperCase();
3460 - html += '<div class="mxchat-debug-log-entry ' + typeClass + '">';
3461 - html += '<div class="mxchat-log-header">';
3462 - html += '<span class="mxchat-log-type">' + escapeHtml(typeLabel) + '</span>';
3463 - html += '<span class="mxchat-log-time">' + escapeHtml(entry.time) + '</span>';
3464 - html += '</div>';
3465 - html += '<div class="mxchat-log-message">' + escapeHtml(entry.message) + '</div>';
3466 - if (entry.data) {
3467 - html += '<div class="mxchat-log-data">' + escapeHtml(JSON.stringify(entry.data, null, 2)) + '</div>';
3468 - }
3469 - html += '</div>';
3470 - });
3471 - html += '</div>';
3472 - $container.html(html);
3473 - } else {
3474 - $countBadge.hide();
3475 - $container.html(
3476 - '<div class="mxchat-debug-log-empty">' +
3477 - '<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" style="opacity: 0.3;"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/></svg>' +
3478 - '<p>No log entries yet. Enable debug mode to start logging.</p>' +
3479 - '</div>'
3480 - );
3481 - }
3482 - }
3483 - }
3484 - });
3485 - }
3486 -
3487 - // Load debug log on page load
3488 - if ($('#mxchat-debug-log').length) {
3489 - refreshDebugLog();
3490 - }
3491 -
3492 - // Refresh Log Button
3493 - $('#mxchat-refresh-log').on('click', function() {
3494 - var $btn = $(this);
3495 - $btn.prop('disabled', true);
3496 - refreshDebugLog();
3497 - setTimeout(function() {
3498 - $btn.prop('disabled', false);
3499 - }, 500);
3500 - });
3501 -
3502 - // Clear Log Button
3503 - $('#mxchat-clear-log').on('click', function() {
3504 - if (!confirm('Are you sure you want to clear the debug log?')) {
3505 - return;
3506 - }
3507 -
3508 - var $btn = $(this);
3509 - $btn.prop('disabled', true);
3510 -
3511 - $.ajax({
3512 - url: ajaxurl,
3513 - type: 'POST',
3514 - data: {
3515 - action: 'mxchat_clear_debug_log',
3516 - _ajax_nonce: mxchatAdmin.setting_nonce
3517 - },
3518 - success: function(response) {
3519 - if (response.success) {
3520 - refreshDebugLog();
3521 - } else {
3522 - alert(response.data.message || 'Error clearing log');
3523 - }
3524 - },
3525 - error: function() {
3526 - alert('Error clearing log');
3527 - },
3528 - complete: function() {
3529 - $btn.prop('disabled', false);
3530 - }
3531 - });
3532 - });
3533 -
3534 - // Export Settings Button
3535 - $('#mxchat-export-settings').on('click', function() {
3536 - var $btn = $(this);
3537 - var originalHtml = $btn.html();
3538 - $btn.prop('disabled', true).html(
3539 - '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="animation: spin 1s linear infinite;"><circle cx="12" cy="12" r="10" stroke-dasharray="32" stroke-dashoffset="12"/></svg> Exporting...'
3540 - );
3541 -
3542 - $.ajax({
3543 - url: ajaxurl,
3544 - type: 'POST',
3545 - data: {
3546 - action: 'mxchat_export_settings',
3547 - _ajax_nonce: mxchatAdmin.setting_nonce
3548 - },
3549 - success: function(response) {
3550 - if (response.success) {
3551 - // Create and download the JSON file
3552 - var dataStr = JSON.stringify(response.data.settings, null, 2);
3553 - var blob = new Blob([dataStr], { type: 'application/json' });
3554 - var url = URL.createObjectURL(blob);
3555 - var a = document.createElement('a');
3556 - a.href = url;
3557 - a.download = response.data.filename;
3558 - document.body.appendChild(a);
3559 - a.click();
3560 - document.body.removeChild(a);
3561 - URL.revokeObjectURL(url);
3562 - } else {
3563 - alert(response.data.message || 'Error exporting settings');
3564 - }
3565 - },
3566 - error: function() {
3567 - alert('Error exporting settings');
3568 - },
3569 - complete: function() {
3570 - $btn.prop('disabled', false).html(originalHtml);
3571 - }
3572 - });
3573 - });
3574 -
3575 - // Reset Settings Modal
3576 - var $resetModal = $('#mxchat-reset-modal');
3577 - var $resetConfirmInput = $('#mxchat-reset-confirmation');
3578 - var $resetConfirmBtn = $('#mxchat-reset-confirm');
3579 -
3580 - $('#mxchat-reset-settings').on('click', function() {
3581 - $resetModal.fadeIn(200);
3582 - $resetConfirmInput.val('').focus();
3583 - $resetConfirmBtn.prop('disabled', true);
3584 - });
3585 -
3586 - $('#mxchat-reset-modal-close, #mxchat-reset-cancel, .mxch-modal-backdrop').on('click', function() {
3587 - $resetModal.fadeOut(200);
3588 - });
3589 -
3590 - $resetConfirmInput.on('input', function() {
3591 - var value = $(this).val().toUpperCase();
3592 - $resetConfirmBtn.prop('disabled', value !== 'RESET');
3593 - });
3594 -
3595 - $resetConfirmBtn.on('click', function() {
3596 - var $btn = $(this);
3597 - var confirmation = $resetConfirmInput.val();
3598 -
3599 - $btn.prop('disabled', true).text('Resetting...');
3600 -
3601 - $.ajax({
3602 - url: ajaxurl,
3603 - type: 'POST',
3604 - data: {
3605 - action: 'mxchat_reset_all_settings',
3606 - confirmation: confirmation,
3607 - _ajax_nonce: mxchatAdmin.setting_nonce
3608 - },
3609 - success: function(response) {
3610 - if (response.success) {
3611 - alert(response.data.message);
3612 - window.location.reload();
3613 - } else {
3614 - alert(response.data.message || 'Error resetting settings');
3615 - $btn.prop('disabled', false).text('Reset All Settings');
3616 - }
3617 - },
3618 - error: function() {
3619 - alert('Error resetting settings');
3620 - $btn.prop('disabled', false).text('Reset All Settings');
3621 - }
3622 - });
3623 - });
3624 -
3625 - // Load debug log on page load if we're on the optimization section
3626 - if ($('#optimization').hasClass('active') || window.location.hash === '#optimization') {
3627 - refreshDebugLog();
3628 - }
3629 -
3630 - // Also refresh when switching to optimization tab
3631 - $(document).on('click', '[data-section="optimization"]', function() {
3632 - setTimeout(refreshDebugLog, 100);
3633 - });
3634 2786 });