", {class:"cr-upload-images-containers cr-upload-images-container-" + (lastIndex + i)}); let progressBar = jQuery("

", {class:"cr-upload-images-pbar"}); progressBar.append( jQuery("

", {class:"cr-upload-images-pbarin"}) ); if( -1 === uploadFiles[0].files[i].type.indexOf( 'image' ) ) { container.append( jQuery( "" ) ); } else{ container.append( jQuery("", {class:"cr-upload-images-thumbnail",src:URL.createObjectURL(uploadFiles[0].files[i])}) ); } container.append( progressBar ); let removeButton = jQuery("'; html += '

'; html += '

'; document.querySelectorAll('.wpaicg_modal_content')[0].innerHTML = html; wpaicgImageCloseModal(); }, image_generator: function(data, start, max, multi_steps,form_action){ let that = this; const xhttp = new XMLHttpRequest(); xhttp.open('POST', wpaicgParams.ajax_url); xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xhttp.send(data); xhttp.onreadystatechange = function(oEvent) { if (xhttp.readyState === 4) { if (xhttp.status === 200) { var wpaicg_response = this.responseText; res = JSON.parse(wpaicg_response); if(res.status === 'success'){ for(var idx = 0; idx < res.imgs.length; idx++){ let idImageBox = idx; if(multi_steps){ idImageBox = start -1; } var img = res.imgs[idx]; var html = '

'; if(wpaicgParams.logged_in === '1') { html += ''; } html += ''; html += ''; html += ''; html += ''; if(wpaicgParams.logged_in === '1') { html += '

'; } else { html += '

'; } html += '

'; that.wpaicgImageGrid.innerHTML += html; } if(multi_steps){ if(start === max){ wpaicgImageRmLoading(that.wpaicgImageGenerateBtn); that.wpaicgImageSelectAll.classList.remove('selectall') that.wpaicgImageSelectAll.innerHTML = wpaicgSelectAllText; that.wpaicgImageSelectAll.style.display = 'block'; that.wpaicgImageLoading.style.display = 'none'; that.wpaicgImageSaveBtn.style.display = 'block'; } else{ that.image_generator(data, start+1, max, multi_steps,form_action) } } else{ if(form_action === 'wpaicg_image_generator'){ let endTime = new Date(); let timeDiff = endTime - that.wpaicgStartTime; timeDiff = timeDiff/1000; data += '&action=wpaicg_image_log&duration='+timeDiff+'&_wpnonce_image_log='+wpaicgImageNonce+'&shortcode=['+wpaicgImageShortcode+']&source_id='+wpaicgImageSourceID; const xhttp = new XMLHttpRequest(); xhttp.open('POST', wpaicgParams.ajax_url); xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xhttp.send(data); xhttp.onreadystatechange = function (oEvent) { if (xhttp.readyState === 4) { } } } wpaicgImageRmLoading(that.wpaicgImageGenerateBtn); that.wpaicgImageSelectAll.classList.remove('selectall') that.wpaicgImageSelectAll.innerHTML = ''; that.wpaicgImageSelectAll.style.display = 'block'; that.wpaicgImageLoading.style.display = 'none'; that.wpaicgImageSaveBtn.style.display = 'block'; } } else{ wpaicgImageRmLoading(that.wpaicgImageGenerateBtn); that.wpaicgImageLoading.style.display = 'none'; let errorMessage = document.createElement('div'); errorMessage.style.color = '#f00'; errorMessage.classList.add('wpaicg-image-error'); errorMessage.innerHTML = res.msg; that.wpaicgImageGenerated.prepend(errorMessage); setTimeout(function (){ errorMessage.remove(); },3000); } } else{ that.wpaicgImageLoading.style.display = 'none'; wpaicgImageRmLoading(that.wpaicgImageGenerateBtn); alert('Something went wrong'); } } } }, save_image: function (items,start){ let that = this; if(start >= items.length){ that.wpaicgImageConvertBar.getElementsByTagName('small')[0].innerHTML = items.length+'/'+items.length; that.wpaicgImageConvertBar.getElementsByTagName('span')[0].style.width = '100%'; that.wpaicgImageMessage.innerHTML = wpaicgParams.languages.save_image_success; wpaicgImageRmLoading(that.wpaicgImageSaveBtn); setTimeout(function (){ that.wpaicgImageMessage.innerHTML = ''; },2000) } else{ var id = items[start]; var item = document.getElementById('wpaicg-image-item-'+id); var data = 'action=wpaicg_save_image_media'; data += '&image_alt='+item.querySelectorAll('.wpaicg-image-item-alt')[0].value; data += '&image_title='+item.querySelectorAll('.wpaicg-image-item-title')[0].value; data += '&image_caption='+item.querySelectorAll('.wpaicg-image-item-caption')[0].value; data += '&image_description='+item.querySelectorAll('.wpaicg-image-item-description')[0].value; data += '&image_url='+encodeURIComponent(item.querySelectorAll('.wpaicg-image-item-select')[0].value); data +='&nonce='+wpaicgImageSaveNonce; const xhttp = new XMLHttpRequest(); xhttp.open('POST', wpaicgParams.ajax_url); xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xhttp.send(data); xhttp.onreadystatechange = function(oEvent) { if (xhttp.readyState === 4) { if (xhttp.status === 200) { var wpaicg_response = this.responseText; res = JSON.parse(wpaicg_response); if(res.status === 'success'){ var currentPos = start+1; var percent = Math.ceil(currentPos*100/items.length); that.wpaicgImageConvertBar.getElementsByTagName('small')[0].innerHTML = currentPos+'/'+items.length; that.wpaicgImageConvertBar.getElementsByTagName('span')[0].style.width = percent+'%'; that.save_image(items, start+1); } else{ that.wpaicgImageConvertBar.classList.add('wpaicg_error'); wpaicgImageRmLoading(that.wpaicgImageSaveBtn); alert(res.msg); } } else { alert(wpaicgParams.languages.wrong); that.wpaicgImageConvertBar.classList.add('wpaicg_error'); wpaicgImageRmLoading(that.wpaicgImageSaveBtn); } } } } }, image: function (){ let that = this; let wpaicgImageForm = document.getElementById('wpaicg-image-generator-form'); if(wpaicgImageForm){ this.wpaicgImageForm = wpaicgImageForm; this.wpaicgImageGenerated = wpaicgImageForm.getElementsByClassName('image-generated')[0]; this.wpaicgImageGrid = wpaicgImageForm.getElementsByClassName('image-grid')[0]; this.wpaicgImageLoading = wpaicgImageForm.getElementsByClassName('image-generate-loading')[0]; this.wpaicgImageSaveBtn = wpaicgImageForm.getElementsByClassName('image-generator-save')[0]; this.wpaicgImageMessage = wpaicgImageForm.getElementsByClassName('wpaicg_message')[0]; this.wpaicgImageConvertBar = wpaicgImageForm.getElementsByClassName('wpaicg-convert-bar')[0]; this.wpaicg_image_modal_close = wpaicgImageForm.getElementsByClassName('wpaicg_image_modal_close'); this.wpaicgNumberImages = wpaicgImageForm.querySelector('select[name=num_images]'); this.wpaicgImageGenerateBtn = wpaicgImageForm.getElementsByClassName('wpaicg_button_generate')[0]; this.wpaicgImageSelectAll = wpaicgImageForm.getElementsByClassName('wpaicg_image_select_all')[0]; this.wpaicgImageSaveBtn.addEventListener('click', function (e) { var items = []; document.querySelectorAll('.wpaicg-image-item input[type=checkbox]').forEach(function (item) { if (item.checked) { items.push(item.getAttribute('data-id')); } }); if (items.length) { that.wpaicgImageConvertBar.style.display = 'block'; that.wpaicgImageConvertBar.classList.remove('wpaicg_error'); that.wpaicgImageConvertBar.getElementsByTagName('small')[0].innerHTML = '0/' + items.length; that.wpaicgImageConvertBar.getElementsByTagName('span')[0].style.width = 0; that.wpaicgImageMessage.innerHTML = ''; wpaicgImageLoadingEffect(that.wpaicgImageSaveBtn); that.save_image(items, 0); } else { alert(wpaicgParams.languages.select_save_error); } }) this.wpaicgImageSelectAll.addEventListener('click', function (e) { if (that.wpaicgImageSelectAll.classList.contains('selectall')) { that.wpaicgImageSelectAll.classList.remove('selectall'); that.wpaicgImageSelectAll.innerHTML = wpaicgSelectAllText; document.querySelectorAll('.wpaicg-image-item input[type=checkbox]').forEach(function (item) { item.checked = false; }) } else { that.wpaicgImageSelectAll.classList.add('selectall'); that.wpaicgImageSelectAll.innerHTML = wpaicgParams.languages.unselect; document.querySelectorAll('.wpaicg-image-item input[type=checkbox]').forEach(function (item) { item.checked = true; }) } }); wpaicgImageForm.addEventListener('submit', function (e) { e.preventDefault(); var form_action = wpaicgImageForm.querySelectorAll('input[name=action]')[0].value; if (form_action === 'wpaicg_image_stable_diffusion') { that.wpaicgNumberImages = wpaicgImageForm.querySelector('select[name=num_outputs]'); } var num_images = parseInt(that.wpaicgNumberImages.value); if (num_images > 0) { var wpaicg_error = false; if (form_action === 'wpaicg_image_stable_diffusion') { var prompt_strength = parseFloat(document.getElementById('prompt_strength').value); var num_inference_steps = parseFloat(document.getElementById('num_inference_steps').value); var guidance_scale = parseFloat(document.getElementById('guidance_scale').value); if (prompt_strength < 0 || prompt_strength > 1) { wpaicg_error = wpaicgParams.languages.prompt_strength } else if (num_inference_steps < 1 || num_inference_steps > 500) { wpaicg_error = wpaicgParams.languages.num_inference_steps } else if (guidance_scale < 1 || guidance_scale > 20) { wpaicg_error = wpaicgParams.languages.guidance_scale } } if (wpaicg_error) { alert(wpaicg_error); } else { const queryString = new URLSearchParams(new FormData(wpaicgImageForm)).toString(); that.wpaicgImageSaveBtn.style.display = 'none'; wpaicgImageLoadingEffect(that.wpaicgImageGenerateBtn); that.wpaicgImageConvertBar.style.display = 'none'; that.wpaicgImageLoading.style.display = 'flex'; that.wpaicgImageGrid.innerHTML = ''; that.wpaicgImageSelectAll.style.display = 'none'; let wpaicgImageError = document.getElementsByClassName('wpaicg-image-error'); if (wpaicgImageError.length) { wpaicgImageError[0].remove(); } if (form_action === 'wpaicg_image_stable_diffusion') { that.image_generator(queryString, 1, num_images, true, form_action); } else { that.wpaicgStartTime = new Date(); that.image_generator(queryString, 1, num_images, false, form_action); } } } else { alert(wpaicgParams.languages.error_image) } return false; }); } } } window['wpaicgInit'] = wpaicgInit.init(); ; function loadConversations() { var clientId = localStorage.getItem('wpaicg_chat_client_id'); if (!clientId) { // Show conversation starters for each chat interface when there are no conversations showAllConversationStarters(); return; } // Load conversations for both chat interfaces loadChatInterface('.wpaicg-chat-shortcode', 'shortcode', clientId); loadChatInterface('.wpaicg-chatbox', 'widget', clientId); } function showAllConversationStarters() { // Target both interfaces var containers = ['.wpaicg-chat-shortcode', '.wpaicg-chatbox']; containers.forEach(containerSelector => { var chatContainers = document.querySelectorAll(containerSelector); chatContainers.forEach(chatContainer => { showConversationStarters(chatContainer); }); }); } function loadChatInterface(containerSelector, type, clientId) { var chatContainers = document.querySelectorAll(containerSelector); chatContainers.forEach(chatContainer => { // Read autoload chat conversations setting, default to '0' if not set var autoloadConversations = chatContainer.getAttribute('data-autoload_chat_conversations'); if (autoloadConversations === null) { autoloadConversations = '1'; // Default value if attribute does not exist } // Fetch the bot ID based on the type var botId = chatContainer.getAttribute('data-bot-id') || '0'; // Determine the history key based on whether it's a custom bot or not var historyKey = botId !== '0' ? `wpaicg_chat_history_custom_bot_${botId}_${clientId}` : `wpaicg_chat_history_${type}_${clientId}`; if (autoloadConversations === '0') { // Retrieve and display the chat history var chatHistory = localStorage.getItem(historyKey); if (chatHistory) { chatHistory = JSON.parse(chatHistory); // Convert old format messages to new format chatHistory = chatHistory.map(message => { if (typeof message === 'string') { return { id: '', // Old messages won't have an ID, so leave it empty text: message }; } return message; // Leave new format messages as is }); // Save the updated history back to localStorage in the new format localStorage.setItem(historyKey, JSON.stringify(chatHistory)); var chatBox = chatContainer.querySelector('.wpaicg-chatbox-messages, .wpaicg-chat-shortcode-messages'); // Generalized selector if (!chatBox) { console.error(`No chat box found within the ${type} container.`); return; } chatBox.innerHTML = ''; // Clears the chat box chatHistory.forEach(message => { reconstructMessage(chatBox, message, chatContainer); }); chatBox.appendChild(document.createElement('br')); requestAnimationFrame(() => { requestAnimationFrame(() => { chatBox.scrollTop = chatBox.scrollHeight; // Scrolls to the bottom }); }); hideConversationStarter(chatContainer); } else { showConversationStarters(chatContainer); } } else { showConversationStarters(chatContainer); } }); } function reconstructMessage(chatBox, message, chatContainer) { var messageElement = document.createElement('li'); // Check if message is an object and has a 'text' property var messageText = typeof message === 'object' && message.text ? message.text : message; // Determine if the message is from the user or AI var isUserMessage = messageText.startsWith('Human:'); var isWidget = chatContainer.classList.contains('wpaicg-chatbox'); // Apply the correct class based on message source and container type if (isUserMessage) { messageElement.className = isWidget ? 'wpaicg-chat-user-message' : 'wpaicg-user-message'; } else { messageElement.className = isWidget ? 'wpaicg-chat-ai-message' : 'wpaicg-ai-message'; } // Format the message content var formattedMessage = messageText.replace('Human:', '').replace('AI:', '').replace(/\n/g, '
'); var userBgColor = chatContainer.getAttribute('data-user-bg-color'); var aiBgColor = chatContainer.getAttribute('data-ai-bg-color'); var fontSize = chatContainer.getAttribute('data-fontsize'); var fontColor = chatContainer.getAttribute('data-color'); var useAvatar = parseInt(chatContainer.getAttribute('data-use-avatar')) || 0; var userAvatar = chatContainer.getAttribute('data-user-avatar'); var aiAvatar = chatContainer.getAttribute('data-ai-avatar'); var displayName = isUserMessage ? (useAvatar ? `

` : 'You:') : (useAvatar ? `

` : 'AI:'); messageElement.style.backgroundColor = isUserMessage ? userBgColor : aiBgColor; messageElement.style.color = fontColor; messageElement.style.fontSize = fontSize; messageElement.innerHTML = `

${displayName} ${formattedMessage}

`; chatBox.appendChild(messageElement); } function hideConversationStarter(chatContainer) { var starters = chatContainer.querySelectorAll('.wpaicg-conversation-starters'); starters.forEach(starter => starter.style.display = 'none'); } function showConversationStarters(chatContainer) { const startersContainer = chatContainer.querySelector('.wpaicg-conversation-starters'); if (startersContainer) { // Check if the container exists startersContainer.style.visibility = 'visible'; // Make the container visible if it exists const starters = startersContainer.querySelectorAll('.wpaicg-conversation-starter'); starters.forEach((starter, index) => { setTimeout(() => { starter.style.opacity = "1"; starter.style.transform = "translateY(0)"; }, index * 150); // Staggered appearance }); } } function wpaicgChatShortcodeSize() { var wpaicgWindowWidth = window.innerWidth; var wpaicgWindowHeight = window.innerHeight; var chatShortcodes = document.getElementsByClassName('wpaicg-chat-shortcode'); if (chatShortcodes !== null && chatShortcodes.length) { for (var i = 0; i < chatShortcodes.length; i++) { var chatShortcode = chatShortcodes[i]; var parentChat = chatShortcode.parentElement; var parentWidth = parentChat.offsetWidth; var chatWidth = chatShortcode.getAttribute('data-width'); var chatHeight = chatShortcode.getAttribute('data-height'); var chatFooter = chatShortcode.getAttribute('data-footer') === 'true'; var chatBar = chatShortcode.getAttribute('data-has-bar'); var chatRounded = parseFloat(chatShortcode.getAttribute('data-chat_rounded')); var textRounded = parseFloat(chatShortcode.getAttribute('data-text_rounded')); var textHeight = parseFloat(chatShortcode.getAttribute('data-text_height')); var textInput = chatShortcode.getElementsByClassName('wpaicg-chat-shortcode-typing')[0]; textInput.style.height = textHeight + 'px'; textInput.style.borderRadius = textRounded + 'px'; chatShortcode.style.borderRadius = chatRounded + 'px'; chatShortcode.style.overflow = 'hidden'; chatWidth = chatWidth !== null ? chatWidth : '350'; chatHeight = chatHeight !== null ? chatHeight : '400'; if (chatShortcode.classList.contains('wpaicg-fullscreened')) { parentWidth = wpaicgWindowWidth; chatWidth = resolveDimension(chatWidth, parentWidth); chatHeight = resolveDimension(chatHeight, wpaicgWindowHeight); var chatPreviewBot = chatShortcode.closest('.wpaicg-bot-preview'); if (chatPreviewBot && chatPreviewBot.offsetWidth < chatWidth) { chatWidth = chatPreviewBot.offsetWidth; } chatShortcode.style.width = chatWidth + 'px'; chatShortcode.style.maxWidth = chatWidth + 'px'; chatShortcode.style.height = chatHeight + 'px'; chatShortcode.style.maxHeight = chatHeight + 'px'; chatShortcode.style.marginTop = 0; var deduceHeight = 69; if (chatFooter) { deduceHeight += 60; // Adjusted for footer height } if (chatBar) { deduceHeight += 30; } var chatMessages = chatShortcode.getElementsByClassName('wpaicg-chat-shortcode-messages')[0]; chatMessages.style.height = (chatHeight - deduceHeight - textHeight) + 'px'; // Scroll to the bottom chatMessages.scrollTop = chatMessages.scrollHeight; } else { // Original non-fullscreen logic if (chatWidth.indexOf('%') < 0) { if (chatWidth.indexOf('px') < 0) { chatWidth = parseFloat(chatWidth); } else { chatWidth = parseFloat(chatWidth.replace(/px/g, '')); } } else { chatWidth = parseFloat(chatWidth.replace(/%/g, '')); if (chatWidth < 100) { chatWidth = chatWidth * parentWidth / 100; } else { chatWidth = ''; } } if (chatHeight.indexOf('%') < 0) { if (chatHeight.indexOf('px') < 0) { chatHeight = parseFloat(chatHeight); } else { chatHeight = parseFloat(chatHeight.replace(/px/g, '')); } } else { chatHeight = parseFloat(chatHeight.replace(/%/g, '')); chatHeight = chatHeight * wpaicgWindowHeight / 100; } if (chatWidth !== '') { chatShortcode.style.width = chatWidth + 'px'; chatShortcode.style.maxWidth = chatWidth + 'px'; } else { chatShortcode.style.width = ''; chatShortcode.style.maxWidth = ''; } if (chatShortcode.classList.contains('wpaicg-fullscreened')) { chatShortcode.style.marginTop = 0; } else { chatShortcode.style.marginTop = ''; } var chatMessages = chatShortcode.getElementsByClassName('wpaicg-chat-shortcode-messages')[0]; var deduceHeight = 69; if (chatFooter) { deduceHeight += 60; // Adjusted for footer height } if (chatBar) { deduceHeight += 30; } chatMessages.style.height = (chatHeight - deduceHeight) + 'px'; } } } } function wpaicgChatBoxSize() { var wpaicgWindowWidth = window.innerWidth; var wpaicgWindowHeight = window.innerHeight; var chatWidgets = document.getElementsByClassName('wpaicg_chat_widget_content'); var chatPreviewBox = document.getElementsByClassName('wpaicg-chatbox-preview-box'); if (chatWidgets.length) { for (var i = 0; i < chatWidgets.length; i++) { var chatWidget = chatWidgets[i]; var chatbox = chatWidget.getElementsByClassName('wpaicg-chatbox')[0]; var chatWidth = chatbox.getAttribute('data-width') || '350'; var chatHeight = chatbox.getAttribute('data-height') || '400'; var chatFooter = chatbox.getAttribute('data-footer'); var chatboxBar = chatbox.getElementsByClassName('wpaicg-chatbox-action-bar'); var textHeight = parseFloat(chatbox.getAttribute('data-text_height')); // Adjust dimensions for the preview box if present if (chatPreviewBox.length && chatPreviewBox[0].offsetWidth) { wpaicgWindowWidth = chatPreviewBox[0].offsetWidth; } // Calculate dimensions dynamically chatWidth = resolveDimension(chatWidth, wpaicgWindowWidth); chatHeight = resolveDimension(chatHeight, wpaicgWindowHeight); chatbox.style.width = chatWidth + 'px'; chatbox.style.height = chatHeight + 'px'; chatWidget.style.width = chatWidth + 'px'; chatWidget.style.height = chatHeight + 'px'; if (chatPreviewBox.length) { chatPreviewBox[0].style.height = (chatHeight + 125) + 'px'; // Adjusting preview box height } // Adjusting heights for content and message areas var actionBarHeight = chatboxBar.length ? 40 : 0; // Assuming action bar height is 40 var footerHeight = chatFooter ? 60 : 0; // Adjusting footer height if enabled var contentHeight = chatHeight - textHeight - actionBarHeight - footerHeight - 20; // Including some padding var messagesHeight = contentHeight - 20; // Additional space for inner padding or margins var chatboxContent = chatWidget.getElementsByClassName('wpaicg-chatbox-content')[0]; var chatboxMessages = chatWidget.getElementsByClassName('wpaicg-chatbox-messages')[0]; chatboxContent.style.height = contentHeight + 'px'; chatboxMessages.style.height = messagesHeight + 'px'; // Ensure last message is visible chatboxMessages.scrollTop = chatboxMessages.scrollHeight; } } } function resolveDimension(value, totalSize) { if (value.includes('%')) { return parseFloat(value) / 100 * totalSize; } else if (value.includes('px')) { return parseFloat(value.replace('px', '')); } return parseFloat(value); // Default to parsing the value as pixels if no units are specified } function wpaicgChatInit() { let wpaicgMicIcon = ''; let wpaicgStopIcon = ''; var wpaicgChatStream; var wpaicgChatRec; var wpaicgInput; var wpaicgChatAudioContext = window.AudioContext || window.webkitAudioContext; var wpaicgaudioContext; var wpaicgMicBtns = document.querySelectorAll('.wpaicg-mic-icon'); var wpaicgChatTyping = document.querySelectorAll('.wpaicg-chatbox-typing'); var wpaicgShortcodeTyping = document.querySelectorAll('.wpaicg-chat-shortcode-typing'); var wpaicgChatSend = document.querySelectorAll('.wpaicg-chatbox-send'); var wpaicgShortcodeSend = document.querySelectorAll('.wpaicg-chat-shortcode-send'); var wpaicgChatFullScreens = document.getElementsByClassName('wpaicg-chatbox-fullscreen'); var wpaicgChatCloseButtons = document.getElementsByClassName('wpaicg-chatbox-close-btn'); var wpaicgChatDownloadButtons = document.getElementsByClassName('wpaicg-chatbox-download-btn'); var wpaicg_chat_widget_toggles = document.getElementsByClassName('wpaicg_toggle'); var wpaicg_chat_widgets = document.getElementsByClassName('wpaicg_chat_widget'); var imageInputThumbnail = null; // Variable to store the image thumbnail function setupConversationStarters() { const starters = document.querySelectorAll('.wpaicg-conversation-starter'); starters.forEach(starter => { starter.addEventListener('click', function() { const messageText = starter.innerText || starter.textContent; const chatContainer = starter.closest('.wpaicg-chat-shortcode') || starter.closest('.wpaicg-chatbox'); const type = chatContainer.classList.contains('wpaicg-chat-shortcode') ? 'shortcode' : 'widget'; const typingInput = type === 'shortcode' ? chatContainer.querySelector('.wpaicg-chat-shortcode-typing') : chatContainer.querySelector('.wpaicg-chatbox-typing'); typingInput.value = messageText; wpaicgSendChatMessage(chatContainer, typingInput, type); // Hide all starters starters.forEach(starter => { starter.style.display = 'none'; }); }); }); } setupConversationStarters(); var imageIcon = document.querySelector('.wpaicg-img-icon'); var spinner = document.querySelector('.wpaicg-img-spinner'); var thumbnailPlaceholder = document.querySelector('.wpaicg-thumbnail-placeholder'); if (imageIcon) { imageIcon.addEventListener('click', function() { var imageInput = document.getElementById('imageUpload'); imageInput.click(); }); } var imageInput = document.getElementById('imageUpload'); if (imageInput) { imageInput.addEventListener('change', function() { if (this.files && this.files[0]) { var file = this.files[0]; // Store the file reference here // Show the spinner and hide the image icon imageIcon.style.display = 'none'; spinner.style.display = 'inline-block'; imageIcon.title = file.name; // Optional: show image name on hover // Hide the spinner and show the image icon and thumbnail after a delay setTimeout(function() { spinner.style.display = 'none'; imageIcon.style.display = 'inline-block'; // Re-display image icon // Now set the thumbnail image using the stored file reference thumbnailPlaceholder.style.backgroundImage = `url(${URL.createObjectURL(file)})`; thumbnailPlaceholder.style.backgroundSize = 'cover'; thumbnailPlaceholder.style.backgroundPosition = 'center'; thumbnailPlaceholder.style.backgroundRepeat = 'no-repeat'; thumbnailPlaceholder.style.display = 'inline-block'; // Display thumbnail }, 2000); } }); } // Function to set up event listeners on all clear chat buttons function setupClearChatButtons() { var wpaicgChatClearButtons = document.querySelectorAll('.wpaicg-chatbox-clear-btn'); wpaicgChatClearButtons.forEach(button => { button.addEventListener('click', function() { var chatContainer = button.closest('[data-bot-id]'); // Finds the nearest parent with 'data-bot-id' if (chatContainer) { var botId = chatContainer.getAttribute('data-bot-id') || '0'; var clientId = localStorage.getItem('wpaicg_chat_client_id'); clearChatHistory(botId, clientId, chatContainer); } }); }); } // Function to clear the chat history from local storage and the display function clearChatHistory(botId, clientId, chatContainer) { var isCustomBot = botId !== '0'; var type = chatContainer.classList.contains('wpaicg-chat-shortcode') ? 'shortcode' : 'widget'; // Determine the type based on class var historyKey = isCustomBot ? `wpaicg_chat_history_custom_bot_${botId}_${clientId}` : `wpaicg_chat_history_${type}_${clientId}`; // Adjust history key based on type // Remove the item from local storage localStorage.removeItem(historyKey); // Clear the chat display var chatBoxSelector = '.wpaicg-chatbox-messages, .wpaicg-chat-shortcode-messages'; // Generalized selector for both types var chatBox = chatContainer.querySelector(chatBoxSelector); if (chatBox) { chatBox.innerHTML = ''; // Clear the chat box visually } } // Call this function once your DOM is fully loaded or at the end of your script setupClearChatButtons(); if(wpaicg_chat_widget_toggles !== null && wpaicg_chat_widget_toggles.length){ for(var i=0;i/g, ">") .replace(/"/g, """) .replace(/'/g, "'"); } function wpaicgstartChatRecording() { let constraints = {audio: true, video: false} navigator.mediaDevices.getUserMedia(constraints).then(function (stream) { wpaicgaudioContext = new wpaicgChatAudioContext(); wpaicgChatStream = stream; wpaicgInput = wpaicgaudioContext.createMediaStreamSource(stream); wpaicgChatRec = new Recorder(wpaicgInput, {numChannels: 1}); wpaicgChatRec.record(); }) } function wpaicgstopChatRecording(mic) { wpaicgChatRec.stop(); wpaicgChatStream.getAudioTracks()[0].stop(); wpaicgChatRec.exportWAV(function (blob) { let type = mic.getAttribute('data-type'); let parentChat; let chatContent; let chatTyping; if (type === 'widget') { parentChat = mic.closest('.wpaicg-chatbox'); chatContent = parentChat.querySelectorAll('.wpaicg-chatbox-content')[0]; chatTyping = parentChat.querySelectorAll('.wpaicg-chatbox-typing')[0]; } else { parentChat = mic.closest('.wpaicg-chat-shortcode'); chatContent = parentChat.querySelectorAll('.wpaicg-chat-shortcode-content')[0]; chatTyping = parentChat.querySelectorAll('.wpaicg-chat-shortcode-typing')[0]; } wpaicgSendChatMessage(parentChat, chatTyping, type, blob); }); } // Function to generate a random string function generateRandomString(length) { let result = ''; let characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; let charactersLength = characters.length; for (let i = 0; i < length; i++) { result += characters.charAt(Math.floor(Math.random() * charactersLength)); } return result; } function setupButtonListeners(isCopyEnabled, isFeedbackEnabled, class_ai_item, emptyClipboardSVG, checkedClipboardSVG, thumbsUpSVG, thumbsDownSVG, showFeedbackModal, aiBg, fontColor, usrBg, chat, wpaicg_nonce, chatbot_identity) { let hideTimeout; // Show buttons on hover or touchstart of the icon container jQuery(document).on('mouseenter touchstart', `li.${class_ai_item} .wpaicg-icon-container`, function (event) { clearTimeout(hideTimeout); // Prevent triggering on scroll or unintended touches if (event.type === 'touchstart') { event.stopPropagation(); } const buttons = jQuery(this).find('.wpaicg-copy-button, .wpaicg-thumbs-up-button, .wpaicg-thumbs-down-button'); // Display copy button if enabled if (isCopyEnabled) { buttons.filter('.wpaicg-copy-button').css({ display: 'inline-block', opacity: 1, visibility: 'visible' }); } // Display feedback buttons if enabled if (isFeedbackEnabled) { buttons.filter('.wpaicg-thumbs-up-button, .wpaicg-thumbs-down-button').css({ display: 'inline-block', opacity: 1, visibility: 'visible' }); } }); // Hide buttons after leaving the icon container jQuery(document).on('mouseleave touchend', `li.${class_ai_item} .wpaicg-icon-container`, function () { const buttons = jQuery(this).find('.wpaicg-copy-button, .wpaicg-thumbs-up-button, .wpaicg-thumbs-down-button'); hideTimeout = setTimeout(() => { buttons.css({ opacity: 0, visibility: 'hidden', display: 'none' }); }, 2000); }); // Copy text functionality remains unchanged jQuery(document).on('click', '.wpaicg-copy-button', function () { const chatId = jQuery(this).data('chat-id'); const messageText = document.getElementById(chatId).innerText; navigator.clipboard.writeText(messageText).then(() => { // Change icon to check mark jQuery(this).html(checkedClipboardSVG); setTimeout(() => { // Reset icon to original after 2 seconds jQuery(this).html(emptyClipboardSVG); }, 2000); }).catch(err => console.error('Failed to copy text: ', err)); }); // Feedback functionality remains unchanged jQuery(document).on('click', '.wpaicg-thumbs-up-button, .wpaicg-thumbs-down-button', function () { const feedbackType = jQuery(this).hasClass('wpaicg-thumbs-up-button') ? 'up' : 'down'; const chatId = jQuery(this).data('chat-id').replace('wpaicg-chat-message-', ''); showFeedbackModal(feedbackType, chatId, aiBg, fontColor, usrBg, chat, wpaicg_nonce, chatbot_identity); }); } function showFeedbackModal(feedbackType, chatId, bgColor, textColor, usrBg, chat, wpaicg_nonce, chatbot_identity) { const chatWidget = jQuery('.wpaicg_chat_widget'); const feedbackTitle = chat.getAttribute('data-feedback_title') || 'Feedback'; const feedbackMessage = chat.getAttribute('data-feedback_message') || 'Please provide details: (optional)'; const feedbackSuccessMessage = chat.getAttribute('data-feedback_success') || 'Thank you for your feedback!'; const chatShortcode = jQuery(chat).closest('.wpaicg-chat-shortcode'); const wasFullscreen = chatShortcode.hasClass('wpaicg-fullscreened'); if (wasFullscreen) { // Exit fullscreen mode before showing feedback modal const fullScreenBtn = chatShortcode.find('.wpaicg-chatbox-fullscreen'); wpaicgFullScreen(fullScreenBtn[0]); // Exit fullscreen } if (chatWidget.hasClass('wpaicg_widget_open')) { chatWidget.data('was-open', true); chatWidget.removeClass('wpaicg_widget_open'); } else { chatWidget.data('was-open', false); } const modalHtml = ` `; jQuery('body').append(modalHtml); jQuery('.wpaicg-feedback-modal-close').on('click', function () { jQuery('.wpaicg-feedback-modal-overlay').fadeOut(300, function () { jQuery(this).remove(); if (wasFullscreen) { // Restore fullscreen after feedback modal is closed const fullScreenBtn = chatShortcode.find('.wpaicg-chatbox-fullscreen'); wpaicgFullScreen(fullScreenBtn[0]); // Re-enter fullscreen } if (chatWidget.data('was-open')) { chatWidget.addClass('wpaicg_widget_open'); } }); }); jQuery('.wpaicg-feedback-modal-submit').on('click', function() { const modal = jQuery(this).closest('.wpaicg-feedback-modal'); const feedbackText = modal.find('.wpaicg-feedback-textarea').val(); const feedbackType = jQuery(this).data('feedback-type'); const chatId = jQuery(this).data('chat-id'); const nonce = wpaicg_nonce; const submitButton = jQuery(this); const spinner = submitButton.find('.wpaicg-feedback-spinner'); const feedbackMessageElement = modal.find('.wpaicg-feedback-message'); spinner.show(); submitButton.prop('disabled', true); jQuery.ajax({ url: wpaicgParams.ajax_url, method: 'POST', data: { action: 'wpaicg_submit_feedback', chatId: chatId, feedbackType: feedbackType, feedbackDetails: feedbackText, _wpnonce: nonce, chatbot_id: chatbot_identity, }, success: function(response) { feedbackMessageElement.html(`${feedbackSuccessMessage}`).fadeIn(300); setTimeout(() => { jQuery('.wpaicg-feedback-modal-overlay').fadeOut(300, function() { jQuery(this).remove(); if (chatWidget.data('was-open')) { chatWidget.addClass('wpaicg_widget_open'); } if (wasFullscreen) { const fullScreenBtn = chatShortcode.find('.wpaicg-chatbox-fullscreen'); wpaicgFullScreen(fullScreenBtn[0]); // Re-enter fullscreen } }); }, 2000); }, error: function(error) { feedbackMessageElement.html(`Error. Please try again later.`).fadeIn(300); setTimeout(() => { jQuery('.wpaicg-feedback-modal-overlay').fadeOut(300, function() { jQuery(this).remove(); if (chatWidget.data('was-open')) { chatWidget.addClass('wpaicg_widget_open'); } if (wasFullscreen) { const fullScreenBtn = chatShortcode.find('.wpaicg-chatbox-fullscreen'); wpaicgFullScreen(fullScreenBtn[0]); // Re-enter fullscreen } }); }, 2000); }, complete: function() { spinner.hide(); submitButton.prop('disabled', false); } }); }); } function wpaicgSendChatMessage(chat, typing, type, blob) { hideConversationStarters(); let wpaicg_box_typing = typing; let wpaicg_ai_thinking, wpaicg_messages_box, class_user_item, class_ai_item; let wpaicgMessage = ''; let wpaicgData = new FormData(); let wpaicg_you = chat.getAttribute('data-you') + ':'; let wpaicg_ai_name = chat.getAttribute('data-ai-name') + ':'; let wpaicg_nonce = chat.getAttribute('data-nonce'); let wpaicg_use_avatar = parseInt(chat.getAttribute('data-use-avatar')); let wpaicg_bot_id = parseInt(chat.getAttribute('data-bot-id')); let wpaicg_user_avatar = chat.getAttribute('data-user-avatar'); let wpaicg_ai_avatar = chat.getAttribute('data-ai-avatar'); let wpaicg_user_bg = chat.getAttribute('data-user-bg-color'); let wpaicg_font_size = chat.getAttribute('data-fontsize'); let wpaicg_speech = chat.getAttribute('data-speech'); let wpaicg_voice = chat.getAttribute('data-voice'); let elevenlabs_model = chat.getAttribute('data-elevenlabs-model'); if (elevenlabs_model === null || elevenlabs_model === undefined) { elevenlabs_model = chat.getAttribute('data-elevenlabs_model'); } let elevenlabs_voice = chat.getAttribute('data-elevenlabs-voice'); if (elevenlabs_voice === null || elevenlabs_voice === undefined) { elevenlabs_voice = chat.getAttribute('data-elevenlabs_voice'); } let wpaicg_voice_error = chat.getAttribute('data-voice-error'); let wpaicg_typewriter_effect = chat.getAttribute('data-typewriter-effect'); let wpaicg_typewriter_speed = chat.getAttribute('data-typewriter-speed'); let url = chat.getAttribute('data-url'); let post_id = chat.getAttribute('data-post-id'); let wpaicg_ai_bg = chat.getAttribute('data-ai-bg-color'); let wpaicg_font_color = chat.getAttribute('data-color'); let voice_service = chat.getAttribute('data-voice_service'); let voice_language = chat.getAttribute('data-voice_language'); let voice_name = chat.getAttribute('data-voice_name'); let voice_device = chat.getAttribute('data-voice_device'); let openai_model = chat.getAttribute('data-openai_model'); let openai_voice = chat.getAttribute('data-openai_voice'); let openai_output_format = chat.getAttribute('data-openai_output_format'); let openai_voice_speed = chat.getAttribute('data-openai_voice_speed'); let openai_stream_nav = chat.getAttribute('data-openai_stream_nav'); let voice_speed = chat.getAttribute('data-voice_speed'); let voice_pitch = chat.getAttribute('data-voice_pitch'); var chat_pdf = chat.getAttribute('data-pdf'); // Handle image upload var imageInput = document.getElementById('imageUpload'); var imageUrl = ''; // Variable to store the URL of the uploaded image for preview if(imageInput){ if (imageInput.files && imageInput.files[0]) { // Append image file to FormData object wpaicgData.append('image', imageInput.files[0], imageInput.files[0].name); // Create a URL for the uploaded image file for preview imageUrl = URL.createObjectURL(imageInput.files[0]); } } if (type === 'widget') { wpaicg_ai_thinking = chat.getElementsByClassName('wpaicg-bot-thinking')[0]; wpaicg_messages_box = chat.getElementsByClassName('wpaicg-chatbox-messages')[0]; class_user_item = 'wpaicg-chat-user-message'; class_ai_item = 'wpaicg-chat-ai-message'; wpaicg_messages_box.scrollTop = wpaicg_messages_box.scrollHeight; // Retrieve all message elements const messages = wpaicg_messages_box.querySelectorAll('li'); // Ensure messages exist and scroll to the last message if (messages.length > 0) { messages[messages.length - 1].scrollIntoView(); } } else { wpaicg_ai_thinking = chat.getElementsByClassName('wpaicg-bot-thinking')[0]; wpaicg_messages_box = chat.getElementsByClassName('wpaicg-chat-shortcode-messages')[0]; class_user_item = 'wpaicg-user-message'; class_ai_item = 'wpaicg-ai-message'; } if (wpaicg_use_avatar) { wpaicg_you = '

'; wpaicg_ai_name = '

'; } wpaicg_ai_thinking.style.display = 'block'; let wpaicg_question = wpaicgescapeHtml(wpaicg_box_typing.value); if (!wpaicg_question.trim() && blob === undefined) { wpaicg_ai_thinking.style.display = 'none'; return; // Exit the function if no message or blob is provided } wpaicgMessage += '

'; wpaicgMessage += '' + wpaicg_you + ''; wpaicgData.append('_wpnonce', wpaicg_nonce); wpaicgData.append('post_id', post_id); if(chat_pdf && chat_pdf !== null) { wpaicgData.append('namespace', chat_pdf); } wpaicgData.append('url', url); if (type === 'widget') { wpaicgData.append('action', 'wpaicg_chatbox_message'); } else { wpaicgData.append('action', 'wpaicg_chat_shortcode_message'); } if (blob !== undefined) { let url = URL.createObjectURL(blob); wpaicgMessage += '

'; wpaicgData.append('audio', blob, 'wpaicg-chat-recording.wav'); } else if (wpaicg_question !== '') { wpaicgData.append('message', wpaicg_question); wpaicgMessage += wpaicg_question.replace(/\n/g,'
'); } wpaicgData.append('bot_id',wpaicg_bot_id); wpaicgMessage += '

'; // If an image URL is available, add an tag to display the image if (imageUrl !== '') { wpaicgMessage += '

'; wpaicgMessage += '

'; // Closing the div tag wpaicgMessage += '

'; } wpaicg_messages_box.innerHTML += wpaicgMessage; wpaicg_messages_box.scrollTop = wpaicg_messages_box.scrollHeight; // Hide the thumbnail placeholder var thumbnailPlaceholder = document.querySelector('.wpaicg-thumbnail-placeholder'); if (thumbnailPlaceholder) { thumbnailPlaceholder.style.display = 'none'; // Hide the thumbnail after message is sent } // Reset the image input after sending the message if imageInput exists first if (imageInput) { imageInput.value = ''; } let chat_type = chat.getAttribute('data-type'); let stream_nav; let chatbot_identity; // Check if it's a bot with dynamic ID if (wpaicg_bot_id && wpaicg_bot_id !== "0") { stream_nav = openai_stream_nav; chatbot_identity = 'custom_bot_' + wpaicg_bot_id; } else { // Check if it's a shortcode or widget based on chat_type if (chat_type === "shortcode") { stream_nav = chat.getAttribute('data-openai_stream_nav'); chatbot_identity = 'shortcode'; } else if (chat_type === "widget") { stream_nav = chat.getAttribute('data-openai_stream_nav'); chatbot_identity = 'widget'; } } wpaicgData.append('chatbot_identity', chatbot_identity); // Check for existing client_id in localStorage let clientID = localStorage.getItem('wpaicg_chat_client_id'); if (!clientID) { // Generate and store a new client ID if not found clientID = generateRandomString(10); // Generate a 10 character string localStorage.setItem('wpaicg_chat_client_id', clientID); } //append client_id to wpaicgData wpaicgData.append('wpaicg_chat_client_id', clientID); // Hide the image thumbnail after sending the message if (imageInputThumbnail) { imageInputThumbnail.style.display = 'none'; } // Function to update chat history in local storage for a specific bot identity function updateChatHistory(message, sender, wpaicg_randomnum) { let chatHistoryKey = 'wpaicg_chat_history_' + chatbot_identity + '_' + clientID; let chatHistory = localStorage.getItem(chatHistoryKey); chatHistory = chatHistory ? JSON.parse(chatHistory) : []; // Format and add the new message let formattedMessage = (sender === 'user' ? "Human: " : "AI: ") + message.trim(); chatHistory.push({ id: wpaicg_randomnum, text: formattedMessage, }); // Keep only the last 10 messages if there are more than 5 if (chatHistory.length > 10) { chatHistory = chatHistory.slice(-10); } // Calculate total character count let totalCharCount = chatHistory.reduce((total, msg) => total + msg.length, 0); // Clear chat history if total character count exceeds 20000 if (totalCharCount > 20000) { chatHistory = []; } localStorage.setItem(chatHistoryKey, JSON.stringify(chatHistory)); } if (stream_nav === "1") { updateChatHistory(wpaicg_question, 'user'); wpaicgData.append('wpaicg_chat_history', localStorage.getItem('wpaicg_chat_history_' + chatbot_identity + '_' + clientID)); handleStreaming(wpaicgData,wpaicg_messages_box,wpaicg_box_typing,wpaicg_ai_thinking,class_ai_item,chat, chatbot_identity, clientID, wpaicg_use_avatar, wpaicg_ai_avatar,wpaicg_nonce); } else { updateChatHistory(wpaicg_question, 'user'); // append chat history to wpaicgData wpaicgData.append('wpaicg_chat_history', localStorage.getItem('wpaicg_chat_history_' + chatbot_identity + '_' + clientID)); var wpaicg_randomnum = Math.floor((Math.random() * 100000) + 1); const chatId = `wpaicg-chat-message-${wpaicg_randomnum}`; // append wpaicg_randomnum to wpaicgData wpaicgData.append('chat_id', wpaicg_randomnum); // Extract copy and feedback settings from the chat element const copyEnabled = chat.getAttribute('data-copy_btn') === "1"; const feedbackEnabled = chat.getAttribute('data-feedback_btn') === "1"; const fontColor = chat.getAttribute('data-color'); const usrBg = chat.getAttribute('data-user-bg-color'); const emptyClipboardSVG = ``; const checkedClipboardSVG = ``; const thumbsUpSVG = ``; const thumbsDownSVG = ``; const xhttp = new XMLHttpRequest(); wpaicg_box_typing.value = ''; xhttp.open('POST', wpaicgParams.ajax_url, true); xhttp.send(wpaicgData); xhttp.onreadystatechange = function (oEvent) { if (xhttp.readyState === 4) { var wpaicg_message = ''; var wpaicg_response_text = ''; if (xhttp.status === 200) { var wpaicg_response = this.responseText; if (wpaicg_response !== '') { wpaicg_response = JSON.parse(wpaicg_response); wpaicg_ai_thinking.style.display = 'none' if (wpaicg_response.status === 'success') { wpaicg_response_text = wpaicg_response.data; wpaicg_message = `

${wpaicg_ai_name} ${wpaicg_response_text} ${copyEnabled ? `` : ''} ${feedbackEnabled ? ` ` : ''}

`; } else { wpaicg_response_text = wpaicg_response.msg; wpaicg_message = '

' + wpaicg_ai_name + ''; } } } else { wpaicg_message = '

' + wpaicg_ai_name + ''; wpaicg_response_text = 'Something went wrong. Please clear your cache and try again.'; wpaicg_ai_thinking.style.display = 'none'; } if (wpaicg_response_text === 'null' || wpaicg_response_text === null) { wpaicg_response_text = 'Empty response from api. Check your server logs for more details.'; } setupButtonListeners(copyEnabled, feedbackEnabled, class_ai_item, emptyClipboardSVG, checkedClipboardSVG, thumbsUpSVG, thumbsDownSVG, showFeedbackModal, wpaicg_ai_bg, wpaicg_font_color, usrBg, chat, wpaicg_nonce, chatbot_identity); updateChatHistory(wpaicg_response_text, 'ai',wpaicg_randomnum); if (wpaicg_response_text !== '' && wpaicg_message !== '') { if(parseInt(wpaicg_speech) == 1){ if(voice_service === 'google'){ wpaicg_ai_thinking.style.display = 'block'; let speechData = new FormData(); speechData.append('nonce', wpaicg_nonce); speechData.append('action', 'wpaicg_google_speech'); speechData.append('language', voice_language); speechData.append('name', voice_name); speechData.append('device', voice_device); speechData.append('speed', voice_speed); speechData.append('pitch', voice_pitch); speechData.append('text', wpaicg_response_text); var speechRequest = new XMLHttpRequest(); speechRequest.open("POST", wpaicgParams.ajax_url); speechRequest.onload = function () { var result = speechRequest.responseText; try { result = JSON.parse(result); if(result.status === 'success'){ var byteCharacters = atob(result.audio); const byteNumbers = new Array(byteCharacters.length); for (let i = 0; i < byteCharacters.length; i++) { byteNumbers[i] = byteCharacters.charCodeAt(i); } const byteArray = new Uint8Array(byteNumbers); const blob = new Blob([byteArray], {type: 'audio/mp3'}); const blobUrl = URL.createObjectURL(blob); wpaicg_message += ''; wpaicg_message += '

'; wpaicg_ai_thinking.style.display = 'none'; wpaicgWriteMessage(wpaicg_messages_box, wpaicg_message, wpaicg_randomnum, wpaicg_response_text, wpaicg_typewriter_effect, wpaicg_typewriter_speed); } else{ var errorMessageDetail = 'Google: ' + result.msg; wpaicg_ai_thinking.style.display = 'none'; if (parseInt(wpaicg_voice_error) !== 1) { wpaicg_message += '' + errorMessageDetail + ''; } else if (typeof wpaicg_response !== 'undefined' && typeof wpaicg_response.log !== 'undefined' && wpaicg_response.log !== '') { var speechLogMessage = new FormData(); speechLogMessage.append('nonce', wpaicg_nonce); speechLogMessage.append('log_id', wpaicg_response.log); speechLogMessage.append('message', errorMessageDetail); speechLogMessage.append('action', 'wpaicg_speech_error_log'); var speechErrorRequest = new XMLHttpRequest(); speechErrorRequest.open("POST", wpaicgParams.ajax_url); speechErrorRequest.send(speechLogMessage); } wpaicg_message += '

'; wpaicgWriteMessage(wpaicg_messages_box, wpaicg_message, wpaicg_randomnum, wpaicg_response_text, wpaicg_typewriter_effect, wpaicg_typewriter_speed); } } catch (errorSpeech){ } } speechRequest.send(speechData); } else if (voice_service === 'openai') { // OpenAI TTS code let speechData = new FormData(); speechData.append('action', 'wpaicg_openai_speech'); speechData.append('nonce', wpaicg_nonce); speechData.append('text', wpaicg_response_text); speechData.append('model', openai_model); speechData.append('voice', openai_voice); speechData.append('output_format', openai_output_format); speechData.append('speed', openai_voice_speed); // Display some sort of loading indicator wpaicg_ai_thinking.style.display = 'block'; var speechRequest = new XMLHttpRequest(); speechRequest.open("POST", wpaicgParams.ajax_url); speechRequest.responseType = "arraybuffer"; // Expecting raw audio data speechRequest.onload = function () { if (speechRequest.status === 200) { wpaicg_ai_thinking.style.display = 'none'; const audioData = speechRequest.response; const blobMimeType = getBlobMimeType(openai_output_format); // Get the MIME type based on the format const blob = new Blob([audioData], { type: blobMimeType }); const blobUrl = URL.createObjectURL(blob); // Update your message UI here wpaicg_message += '

'; wpaicgWriteMessage(wpaicg_messages_box, wpaicg_message, wpaicg_randomnum, wpaicg_response_text, wpaicg_typewriter_effect, wpaicg_typewriter_speed); } else { // Handle HTTP errors wpaicg_ai_thinking.style.display = 'none'; console.error('Error generating speech with OpenAI:', speechRequest.statusText); // Update your message UI to show the error wpaicg_message += 'Error generating speech with OpenAI'; wpaicgWriteMessage(wpaicg_messages_box, wpaicg_message, wpaicg_randomnum, wpaicg_response_text, wpaicg_typewriter_effect, wpaicg_typewriter_speed); } }; speechRequest.onerror = function () { // Handle network errors wpaicg_ai_thinking.style.display = 'none'; console.error('Network error during speech generation with OpenAI'); // Update your message UI to show the network error wpaicg_message += 'Network error during speech generation'; wpaicgWriteMessage(wpaicg_messages_box, wpaicg_message, wpaicg_randomnum, wpaicg_response_text, wpaicg_typewriter_effect, wpaicg_typewriter_speed); }; speechRequest.send(speechData); // Utility function to get the correct MIME type function getBlobMimeType(format) { switch (format) { case 'opus': return 'audio/opus'; case 'aac': return 'audio/aac'; case 'flac': return 'audio/flac'; default: return 'audio/mpeg'; // Default to MP3 } } } else { let speechData = new FormData(); speechData.append('nonce', wpaicg_nonce); speechData.append('message', wpaicg_response_text); speechData.append('voice', wpaicg_voice); speechData.append('elevenlabs_model', elevenlabs_model); speechData.append('action', 'wpaicg_text_to_speech'); wpaicg_ai_thinking.style.display = 'block'; var speechRequest = new XMLHttpRequest(); speechRequest.open("POST", wpaicgParams.ajax_url); speechRequest.responseType = "arraybuffer"; speechRequest.onload = function () { wpaicg_ai_thinking.style.display = 'none'; var blob = new Blob([speechRequest.response], {type: "audio/mpeg"}); var fr = new FileReader(); fr.onload = function () { var fileText = this.result; try { var errorMessage = JSON.parse(fileText); var errorMessageDetail = 'ElevenLabs: ' + errorMessage.detail.message; if (parseInt(wpaicg_voice_error) !== 1) { wpaicg_message += '' + errorMessageDetail + ''; } else if (typeof wpaicg_response !== 'undefined' && typeof wpaicg_response.log !== 'undefined' && wpaicg_response.log !== '') { var speechLogMessage = new FormData(); speechLogMessage.append('nonce', wpaicg_nonce); speechLogMessage.append('log_id', wpaicg_response.log); speechLogMessage.append('message', errorMessageDetail); speechLogMessage.append('action', 'wpaicg_speech_error_log'); var speechErrorRequest = new XMLHttpRequest(); speechErrorRequest.open("POST", wpaicgParams.ajax_url); speechErrorRequest.send(speechLogMessage); } wpaicg_message += '

'; wpaicgWriteMessage(wpaicg_messages_box, wpaicg_message, wpaicg_randomnum, wpaicg_response_text, wpaicg_typewriter_effect, wpaicg_typewriter_speed); } catch (errorBlob) { var blobUrl = URL.createObjectURL(blob); wpaicg_message += '

'; wpaicg_message += '

'; wpaicgWriteMessage(wpaicg_messages_box, wpaicg_message, wpaicg_randomnum, wpaicg_response_text, wpaicg_typewriter_effect, wpaicg_typewriter_speed); } } fr.readAsText(blob); } speechRequest.send(speechData); } } else{ wpaicg_message += '

'; wpaicgWriteMessage(wpaicg_messages_box,wpaicg_message,wpaicg_randomnum,wpaicg_response_text, wpaicg_typewriter_effect, wpaicg_typewriter_speed); } } } } } } // Function to hide all conversation starters function hideConversationStarters() { const starters = document.querySelectorAll('.wpaicg-conversation-starters'); starters.forEach(starter => { starter.style.display = 'none'; }); } function handleStreaming(wpaicgData, wpaicg_messages_box, wpaicg_box_typing, wpaicg_ai_thinking, class_ai_item, chat, chatbot_identity, clientID, wpaicg_use_avatar, wpaicg_ai_avatar,wpaicg_nonce) { const aiName = wpaicg_use_avatar ? `

` : `${chat.getAttribute('data-ai-name')}:`; const fontSize = chat.getAttribute('data-fontsize'); const aiBg = chat.getAttribute('data-ai-bg-color'); const fontColor = chat.getAttribute('data-color'); const usrBg = chat.getAttribute('data-user-bg-color'); const copyEnabled = chat.getAttribute('data-copy_btn') === "1"; const feedbackEnabled = chat.getAttribute('data-feedback_btn') === "1"; wpaicg_box_typing.value = ''; // add chatID to the query string const chatId = `wpaicg-chat-message-${Math.floor(Math.random() * 100000) + 1}`; const cleanedChatId = chatId.replace('wpaicg-chat-message-', ''); // Clean the chatId by removing the prefix wpaicgData.append('chat_id', cleanedChatId); const queryString = new URLSearchParams(wpaicgData).toString(); const eventSource = new EventSource(`${wpaicgParams.ajax_url}?${queryString}`); const emptyClipboardSVG = ``; const checkedClipboardSVG = ``; const thumbsUpSVG = ``; const thumbsDownSVG = ``; const messageHtml = `

${aiName} ${copyEnabled ? `` : ''} ${feedbackEnabled ? ` ` : ''}

`; // Buffer to accumulate chunks let buffer = ''; function processBuffer() { // Call the unified processMarkdown function for stream mode processMarkdown(buffer, true, chatId); } function updateChatHistory(message, sender, chatId) { const key = `wpaicg_chat_history_${chatbot_identity}_${clientID}`; const history = JSON.parse(localStorage.getItem(key) || '[]'); // Remove the 'wpaicg-chat-message-' prefix from the chatId const simpleChatId = chatId.replace('wpaicg-chat-message-', ''); history.push({ id: simpleChatId, // Store the simplified chat ID as a separate key text: `${sender === 'user' ? "Human: " : "AI: "} ${message.trim()}` }); localStorage.setItem(key, JSON.stringify(history)); } let dataQueue = []; let isProcessing = false; let completeAIResponse = ''; function typeWriter(text, i, elementId, callback) { toggleBlinkingCursor(false); if (i < text.length) { const charToAdd = text.charAt(i); if (charToAdd === '<') { const tag = text.slice(i, i + 4); if (tag === '
') { jQuery(`#${elementId}`).append(tag); i += 4; } else { jQuery(`#${elementId}`).append(charToAdd); i++; } } else { jQuery(`#${elementId}`).append(charToAdd); i++; } setTimeout(() => typeWriter(text, i, elementId, callback), 1); } else if (callback) { callback(); scrollToBottom(); } } function scrollToBottom() { wpaicg_messages_box.scrollTop = wpaicg_messages_box.scrollHeight; } function processQueue() { if (dataQueue.length && !isProcessing) { isProcessing = true; const nextChunk = dataQueue.shift(); typeWriter(nextChunk, 0, chatId, () => { isProcessing = false; processQueue(); }); } else { toggleBlinkingCursor(false); } } function toggleBlinkingCursor(isVisible) { const cursorElement = jQuery(`#${chatId} .blinking-cursor`); if (isVisible) { if (!cursorElement.length) { jQuery(`#${chatId}`).append('|'); } } else { cursorElement.remove(); } } eventSource.onopen = () => { toggleBlinkingCursor(true); wpaicg_messages_box.innerHTML += messageHtml; }; eventSource.onmessage = e => { wpaicg_ai_thinking.style.display = 'none'; const resultData = JSON.parse(e.data); if (e.data === "[DONE]" || resultData.choices?.[0]?.finish_reason === "stop" || resultData.choices?.[0]?.finish_reason === "length" || resultData.choices?.[0]?.finish_details?.type === "stop") { eventSource.close(); toggleBlinkingCursor(false); updateChatHistory(completeAIResponse, 'ai', chatId); return; } if (resultData.tokenLimitReached || resultData.messageFlagged || resultData.pineconeError || resultData.ipBanned || resultData.modflag) { document.getElementById(chatId).innerHTML = `${resultData.msg}`; wpaicg_ai_thinking.style.display = 'none'; eventSource.close(); toggleBlinkingCursor(false); scrollToBottom(); return; } if (resultData.error) { dataQueue.push(resultData.error.message); } else { const content = resultData.choices?.[0]?.delta?.content || resultData.choices?.[0]?.text || ''; buffer += content; processBuffer(); completeAIResponse += content; } processQueue(); scrollToBottom(); }; // Setup button listeners for the copy and feedback buttons setupButtonListeners(copyEnabled, feedbackEnabled, class_ai_item, emptyClipboardSVG, checkedClipboardSVG, thumbsUpSVG, thumbsDownSVG, showFeedbackModal, aiBg, fontColor, usrBg, chat, wpaicg_nonce, chatbot_identity); eventSource.onerror = error => { console.log("EventSource failed:", error); toggleBlinkingCursor(false); wpaicg_ai_thinking.style.display = 'none'; eventSource.close(); }; } function processMarkdown(inputText, isStream = false, chatId = null) { inputText = inputText !== '' ? inputText.trim() : ''; // Replace new lines let formattedText = inputText.replace(/(?:\r\n|\r|\n)/g, '
'); // Replace blockquotes formattedText = formattedText.replace(/^>\s*(.*)$/gm, '

$1

'); // Replace unordered lists formattedText = formattedText.replace(/^\s*-\s+(.*)$/gm, '

'); // Replace ordered lists formattedText = formattedText.replace(/^\s*\d+\.\s+(.*)$/gm, '

'); // Replace horizontal rules formattedText = formattedText.replace(/^\s*---\s*$/gm, '

'); // Replace bold text formattedText = formattedText.replace(/\*\*(.*?)\*\*/g, '$1'); // Replace italic text formattedText = formattedText.replace(/\*(.*?)\*/g, '$1'); // Replace underline text formattedText = formattedText.replace(/__(.*?)__/g, '$1'); // Replace strikethrough text formattedText = formattedText.replace(/~~(.*?)~~/g, '$1'); // Replace markdown links (first) formattedText = formattedText.replace(/\[(.*?)\]$(https?:\/\/.*?)$/g, '$1'); // Replace plain URLs (after handling markdown links) formattedText = formattedText.replace(/(^|[^"])(https?:\/\/[^\s<]+)/g, '$1$2'); // Replace code blocks formattedText = formattedText.replace(/```([\s\S]*?)```/g, '

$1

'); // Replace inline code formattedText = formattedText.replace(/`([\s\S]*?)`/g, '$1'); // If stream mode, update the element with the chatId if (isStream && chatId) { document.getElementById(chatId).innerHTML = formattedText; } return formattedText; } // Scroll function to adjust. function scrollToAdjust(wpaicg_messages_box) { requestAnimationFrame(() => { wpaicg_messages_box.scrollTop = wpaicg_messages_box.scrollHeight; }); } function wpaicgWriteMessage(wpaicg_messages_box,wpaicg_message,wpaicg_randomnum,wpaicg_response_text, wpaicg_typewriter_effect, wpaicg_typewriter_speed){ wpaicg_messages_box.innerHTML += wpaicg_message; var wpaicg_current_message = document.getElementById('wpaicg-chat-message-' + wpaicg_randomnum); var parentMessage = wpaicg_current_message.parentElement; var audio = parentMessage.getElementsByTagName('audio'); if(audio && audio.length){ audio[0].play(); } // Apply formatting to the entire response text first var formattedText = processMarkdown(wpaicg_response_text); if (wpaicg_typewriter_effect) { let index = 0; // Starting index of the substring function typeWriter() { if (index < formattedText.length) { wpaicg_current_message.innerHTML = formattedText.slice(0, index+1); index++; setTimeout(typeWriter, wpaicg_typewriter_speed); //scroll to the latest message if needed scrollToAdjust(wpaicg_messages_box); } else { // Once complete, ensure scrolling if needed scrollToAdjust(wpaicg_messages_box); } } typeWriter(); // Start the typewriter effect } else { wpaicg_current_message.innerHTML = formattedText; // Scroll to the latest message if needed scrollToAdjust(wpaicg_messages_box); } } function wpaicgMicEvent(mic) { if (mic.classList.contains('wpaicg-recording')) { mic.innerHTML = ''; mic.innerHTML = wpaicgMicIcon; mic.classList.remove('wpaicg-recording'); wpaicgstopChatRecording(mic) } else { let checkRecording = document.querySelectorAll('.wpaicg-recording'); if (checkRecording && checkRecording.length) { alert('Please finish previous recording'); } else { mic.innerHTML = ''; mic.innerHTML = wpaicgStopIcon; mic.classList.add('wpaicg-recording'); wpaicgstartChatRecording(); } } } if (wpaicgChatTyping && wpaicgChatTyping.length) { for (let i = 0; i < wpaicgChatTyping.length; i++) { wpaicgChatTyping[i].addEventListener('keyup', function (event) { if ((event.which === 13 || event.keyCode === 13) && !event.shiftKey) { let parentChat = wpaicgChatTyping[i].closest('.wpaicg-chatbox'); let chatTyping = parentChat.querySelectorAll('.wpaicg-chatbox-typing')[0]; wpaicgSendChatMessage(parentChat, chatTyping, 'widget'); } }) } } if (wpaicgShortcodeTyping && wpaicgShortcodeTyping.length) { for (let i = 0; i < wpaicgShortcodeTyping.length; i++) { wpaicgShortcodeTyping[i].addEventListener('keyup', function (event) { if ((event.which === 13 || event.keyCode === 13) && !event.shiftKey) { let parentChat = wpaicgShortcodeTyping[i].closest('.wpaicg-chat-shortcode'); let chatTyping = parentChat.querySelectorAll('.wpaicg-chat-shortcode-typing')[0]; wpaicgSendChatMessage(parentChat, chatTyping, 'shortcode'); } }) } } if (wpaicgChatSend && wpaicgChatSend.length) { for (let i = 0; i < wpaicgChatSend.length; i++) { wpaicgChatSend[i].addEventListener('click', function (event) { let parentChat = wpaicgChatSend[i].closest('.wpaicg-chatbox'); let chatTyping = parentChat.querySelectorAll('.wpaicg-chatbox-typing')[0]; wpaicgSendChatMessage(parentChat, chatTyping, 'widget'); }) } } if (wpaicgShortcodeSend && wpaicgShortcodeSend.length) { for (let i = 0; i < wpaicgShortcodeSend.length; i++) { wpaicgShortcodeSend[i].addEventListener('click', function (event) { let parentChat = wpaicgShortcodeSend[i].closest('.wpaicg-chat-shortcode'); let chatTyping = parentChat.querySelectorAll('.wpaicg-chat-shortcode-typing')[0]; wpaicgSendChatMessage(parentChat, chatTyping, 'shortcode'); }) } } if (wpaicgMicBtns && wpaicgMicBtns.length) { for (let i = 0; i < wpaicgMicBtns.length; i++) { wpaicgMicBtns[i].addEventListener('click', function () { wpaicgMicEvent(wpaicgMicBtns[i]); }); } } } wpaicgChatInit(); // Call the init function when the document is ready document.addEventListener('DOMContentLoaded', loadConversations); (function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.Recorder = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o0))return r=s.getHost(e),!0;for(var t=0;t0)for(var i=0;i0)for(var s=0;se.split(".").reduce((t,e)=>t&&t[e],t)),i=()=>null,s=t=>null===t||t===undefined?"":t,o="wc/store/checkout";function a(t){window.wp&&window.wp.data&&window.wp.data.dispatch&&window.wc&&window.wc.wcBlocksData&&window.wp.data.dispatch(window.wc.wcBlocksData.CHECKOUT_STORE_KEY).__internalSetExtensionData("woocommerce/order-attribution",t,!0)}function r(){return"undefined"!=typeof sbjs}function c(){if(window.wp&&window.wp.data&&"function"==typeof window.wp.data.subscribe){const e=window.wp.data.subscribe(function(){e(),a(t.getAttributionData())},o)}}t.getAttributionData=function(){const s=e.allowTracking&&r()?n:i,o=r()?sbjs.get:{},a=Object.entries(t.fields).map(([t,e])=>[t,s(o,e)]);return Object.fromEntries(a)},t.setOrderTracking=function(n){if(e.allowTracking=n,n){if(!r())return;sbjs.init({lifetime:Number(e.lifetime),session_length:Number(e.session),base64:Boolean(e.base64),timezone_offset:"0"})}else!function(){const t=window.location.hostname;["sbjs_current","sbjs_current_add","sbjs_first","sbjs_first_add","sbjs_session","sbjs_udata","sbjs_migrations","sbjs_promo"].forEach(e=>{document.cookie=`${e}=; path=/; max-age=-999; domain=.${t};`})}();const i=t.getAttributionData();!function(t){for(const e of document.querySelectorAll("wc-order-attribution-inputs"))e.values=t}(i),a(i)},t.setOrderTracking(e.allowTracking),"loading"===document.readyState?document.addEventListener("DOMContentLoaded",c):c(),window.customElements.define("wc-order-attribution-inputs",class extends HTMLElement{constructor(){if(super(),this._fieldNames=Object.keys(t.fields),this.hasOwnProperty("_values")){let t=this.values;delete this.values,this.values=t||{}}}connectedCallback(){this.innerHTML="";const t=new DocumentFragment;for(const n of this._fieldNames){const i=document.createElement("input");i.type="hidden",i.name=`${e.prefix}${n}`,i.value=s(this.values&&this.values[n]||""),t.appendChild(i)}this.appendChild(t)}set values(t){if(this._values=t,this.isConnected)for(const t of this._fieldNames){const n=this.querySelector(`input[name="${e.prefix}${t}"]`);n?n.value=s(this.values[t]):console.warn(`Field "${t}" not found. `+"Most likely, the '' element was manipulated.")}}get values(){return this._values}})}(window.wc_order_attribution);;

${feedbackTitle}