Chat with ourFluke assistant
Clear Chat
'; // Append the new message element at the end of the container const botCon = document.querySelector('.bot-message-container'); botCon.appendChild(messageElement); scrollToBottom();}/* Create a helper function to monitor when the bot-content container height is increased. As it is increasing, the winder should scroll with it. */function scrollToBottom() { const botContent = document.querySelector('.bot-content'); botContent.scrollTop = botContent.scrollHeight;}/* Create a helper function for the intro text. This is the first messages found in the bot bot-intro. It is also re-added when we use the clear button */function addInitialBuzz(path) { const botContainer = document.querySelector('.bot-container'); // If the locale storage item buzzLastState is set, we want to set the bot container to that state const lastState = localStorage.getItem('buzzLastState'); if (lastState) { botContainer.className = lastState; } // Path customization getPathCustomization(path); // If the localStorage has chatMessages, replace the bot-message-container with the saved messages instead of any intro text const chatMessages = localStorage.getItem('chatMessages'); if (chatMessages) { const botCon = document.querySelector('.bot-message-container'); botCon.innerHTML = chatMessages; return; } else { // The intro text is added to the bot-intro element const introText = document.querySelector('.bot-intro'); introText.innerHTML = `
Hi, I’m your virtual assistant, I will do my very best to help you navigate all things Fluke related. You can ask me anything!
I’m new and might make a few mistakes. For safe use of Fluke tools, refer to the product manuals, safety sheets, and your company’s safety requirements. To speak with a person, visit our Contact Us page or Talk to Sales page. For information on how we handle personal data, see our Privacy Policy
Please note that the use of Fluke’s products requires professional knowledge, skills and training and should only be purchased for use by appropriately qualified professionals.
`; // Promps are and additional message that can be added to the chat window. They are added after the intro text, and addPrompts(path); }}/* Create a helper function to add prompts to the chat window * Prompts are bot messages appended after the into text for specific paths.*/function addPrompts(path) { const validLocales = ['en', 'en-us', 'en-ie', 'en-gb', 'en-ca']; // Example usage if (!isValidHostAndLocale(validLocales)) { // Return the unmodified message if the host or locale is invalid. return; } const botCon = document.querySelector('.bot-message-container'); // Check if a bot-prompts already exists const existingPrompt = botCon.querySelector('.bot.bot-prompts'); if (existingPrompt) { return; } // If path is 6 characters or less, it is assumed to be the homepage if (path.length <= 6) { path = 'home'; } let message; switch (path) { case 'home': message = "
How can I help you today?
" + "
I want to learn more about a product
" + "
I want to purchase a product
" + "
I am looking for product support
" + "
What's new?
"; break; case '/en-us/products/electrical-testing/best-solar-energy-industry-tools': message = "
Thanks for checking out Fluke's solar solutions! How can I help you today?
" + "
I want to learn more about a Fluke solar product(s)
" + "
I want to purchase a product for my solar application
" + "
"; break; case '/en-us/products/calibration-tools/temperature-calibrators': message = "
Thanks for checking out Fluke's Temperature Calibration solutions! How can I help you today?
" + "
I want to learn more about a Fluke Temperature Calibration product(s)
" + "
I want to learn more about Temperature Calibration
"; break; default: return; } const messageElement = document.createElement('div'); messageElement.classList.add('bot', 'bot-prompts'); messageElement.innerHTML = message; botCon.appendChild(messageElement);}function getPathCustomization(path) { const validLocales = ['en', 'en-us', 'en-ie', 'en-gb', 'en-ca']; // Example usage if (!isValidHostAndLocale(validLocales)) { // Dont attempt to fire any path customization if the host or locale is invalid. return; } if (path.length <= 6) { const lastState = localStorage.getItem('buzzLastState'); if (lastState) { return; } botTransitionMid(); scrollToBottom(); // Handle the case when the path is less than 6 characters } else if (path.includes('search/fluke')) { const lastState = localStorage.getItem('buzzLastState'); if (!lastState) { botTransitionMid(); } // Get the content of input.alg-search-input. We'll use this instead of query params because they are more accurate. let searchInput = document.querySelector('input.alg-search-input'); let botInput = document.getElementById('user-input'); // Function to build and insert CTA function buildAndInsertCta(searchValue) { let algoliaContainer = document.querySelector('.alg-full-results'); let builtCta = "
Try the Fluke assistant to learn more about \"" + searchValue + "\"
"; algoliaContainer.insertAdjacentHTML('afterbegin', builtCta); botInput.value = "Please tell me more about " + searchValue; } // If the search input has a value, we want to update the CTA and the bot input field if (searchInput) { // Now find the algolia container we will be adding the CTA to let algoliaContainer = document.querySelector('.alg-full-results'); // If the container exists, we place the CTA and update the value if (algoliaContainer) { // Check to see if .buzz-algolia exists. If it does, we want to update the CTA and the bot input field let existingCta = document.querySelector('.buzz-algolia'); if (!existingCta) { buildAndInsertCta(searchInput.value); } } // Additionally, when the input changes we change the CTA and the bot input field to keep them in sync searchInput.addEventListener('input', function () { let currentCta = document.getElementsByClassName('toc-cta')[0]; if (currentCta) { currentCta.innerHTML = "Try the Fluke assistant to learn more about \"" + searchInput.value + "\""; botInput.value = "Please tell me more about " + searchInput.value; } else { buildAndInsertCta(searchInput.value); } }); // If .buzz-algolia exists, we are gonna add a click event listener to the button let algoliaCta = document.querySelector('.toc-cta'); if (algoliaCta) { algoliaCta.addEventListener('click', function () { // If the bot-container isnt bot-mid or bot-full, we want to transition to bot-mid if (!document.querySelector('.bot-container').classList.contains('bot-mid')) { botTransitionMid(); } sendMessage(botInput.value); // Clear the input field botInput.value = ''; }); } } // Handle the case when the path contains 'search/fluke' } else if ( path.includes('products/electrical-testing/digital-multimeters') || path.includes('en-us/products/calibration-tools/temperature-calibrators') || path.includes('en-us/products/electrical-testing/best-solar-energy-industry-tools') ) { const lastState = localStorage.getItem('buzzLastState'); if (lastState) { return; } botTransitionMid(); scrollToBottom(); // Handle the cases when the path contains specific products }}function getOrGenerateChatId() { let chatId; chatId = localStorage.getItem('chatId'); // If chatId does not exist in localStorage, generate a new one if (!chatId || chatId === '') { chatId = 'chat-' + Date.now() + '-' + Math.floor(Math.random() * 1000); localStorage.setItem('chatId', chatId); } return chatId;}// Clear chat functionfunction clearMessages(path) { localStorage.removeItem('chatMessages'); localStorage.removeItem('chatId'); localStorage.setItem('chatQuestion', 0); // Reset to 0 localStorage.removeItem('buzzLastState'); chatId = getOrGenerateChatId(); sendDataLayer({ 'event': 'chat_bot_event', 'chatId': localStorage.getItem('chatId'), 'reponseCount': localStorage.getItem('chatQuestion'), 'requestType': 'clear_chat' }); const botCon = document.querySelector('.bot-message-container'); // After clearing the chat we want to remove the innerHTML of the bot-message-container, and add the intro text again botCon.innerHTML = "
"; addInitialBuzz(path);}function appendSentiment(thumbs, chatId, chatDialogId) { const botCon = document.querySelector('.bot-message-container'); const lastBotMessage = botCon.querySelector('.bot:last-of-type'); if (thumbs) { const botRatingDiv = document.createElement('div'); botRatingDiv.classList.add('bot-rating'); // Insert bot rating div after lastBotMessage lastBotMessage.parentNode.insertBefore(botRatingDiv, lastBotMessage.nextSibling); // Insert buttons inside bot rating div botRatingDiv.innerHTML = ` `; const thumbupElements = botRatingDiv.querySelectorAll('.thumbup'); const thumbdownElements = botRatingDiv.querySelectorAll('.thumbdown'); thumbupElements.forEach((thumbup) => { thumbup.addEventListener('click', function () { chatRating = 1; this.classList.add('responded'); thumbdownElements.forEach((thumbdown) => thumbdown.classList.add('responded-alt')); thumbupElements.forEach((thumbup) => thumbup.style.pointerEvents = 'none'); thumbdownElements.forEach((thumbdown) => thumbdown.style.pointerEvents = 'none'); // Call your sendRating function with appropriate parameters sendRating(chatRating, chatId, chatDialogId) }); }); thumbdownElements.forEach((thumbdown) => { thumbdown.addEventListener('click', function () { chatRating = -1; this.classList.add('responded'); thumbupElements.forEach((thumbup) => thumbup.classList.add('responded-alt')); thumbupElements.forEach((thumbup) => thumbup.style.pointerEvents = 'none'); thumbdownElements.forEach((thumbdown) => thumbdown.style.pointerEvents = 'none'); // Call your sendRating function with appropriate parameters sendRating(chatRating, chatId, chatDialogId) }); }); }}// Function to send user message to Azure Chatbotfunction sendRating(chatRating, chatId, chatDialogId) { const endpoint = 'https://flk-delphiapi-sitegpt-prd-001.azurewebsites.net/v1/chat/ratings'; const payload = { chatId: chatId, dialogId: chatDialogId, chatRating: chatRating, }; const headers = { 'Content-Type': 'application/json', 'Ocp-Apim-Subscription-Key': '078db2f23dcb4b23a5cb1b6255fc08c8', }; // Add this line at the beginning of your function to record the start time const startTime = new Date(); fetch(endpoint, { method: 'POST', headers: headers, body: JSON.stringify(payload), }) .then(response => { if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`); } return response.json(); }) .then(data => { if (data) { console.log('sent rating ' + chatRating + ' for question ' + chatDialogId); } }) .catch(error => console.error('Error:', error));}function cloudflareTestingPortal(botResponse, timeTakenInSeconds, payload, dataLayerObject) { //Get the hostname const hostname = window.location.hostname; // If the hostname is uat-gpt.fluke.com, add a console message if (hostname === 'uat-gpt.fluke.com') { // Add the botResponse, timeTakenInSeconds, payload, and gtm the respective containers // last-message-right, last-response-right, data-layer-right, payload-right const lastMessageRight = document.querySelector('#last-message-right'); const lastResponseRight = document.querySelector('#last-response-right'); const dataLayerRight = document.querySelector('#data-layer-right'); const payloadRight = document.querySelector('#payload-right'); lastMessageRight.innerHTML = botResponse; lastResponseRight.innerHTML = timeTakenInSeconds; dataLayerRight.innerHTML = JSON.stringify(dataLayerObject); payloadRight.innerHTML = JSON.stringify(payload); }}// We need to pass datalayer stuffies.function sendDataLayer(data) { // Function for event tracking window.dataLayer = window.dataLayer || []; window.dataLayer.push(data);}// For global launch, we are only supporting en-us for many of the Kaizen specific features. function isValidHostAndLocale(validLocales) { // Get the hostname - currently only supported on *.fluke.com. The first path segment is the lang-locale, and we are only supporting en-us at launch const hostname = window.location.hostname; const path = window.location.pathname; const langLocale = path.split('/')[1]; // If the hostname is not 'www.fluke.com' or 'regression.fluke.com', or the langLocale is not in the validLocales array, return false if ((hostname !== 'www.fluke.com' && hostname !== 'regression.fluke.com') || !validLocales.includes(langLocale)) { return false; } // If the hostname and langLocale pass the conditions, return true return true;}
