Auto first message send but incoming message and e...
# 🤝help
j
As commonly used, I use the below code for my chatbot to send the first message, giving a notification affect. However as my client has the widget on every page the message resends every time a user clicks on a new page on their website. THIS IS DRIVING UP MY USAGE ALOT. I have my bot set up to time out after 5 minutes. Is there any other solutions to reduce usage? [CODE IN COMMENTS]
// Variable to keep track of whether or not the chat window is open. The chat bubble is only shown when the chat window is closed let isChatOpen = false window.botpressWebChat.onEvent( function (event) { if (event.type === 'LIFECYCLE.LOADED') { window.botpressWebChat.sendEvent({ type: 'hide' }) } else if (event.type === 'LIFECYCLE.READY') { // Send a custom trigger to the chatbot after a 3 sec timer setTimeout(() => { window.botpressWebChat.sendPayload({ type: 'trigger', payload: {}, }) console.log('Payload triggered 3 seconds after page fully loaded') }, 3000); } else if (event.type === 'TRIGGER') { // This section is to catch events sent from the chatbot if (!isChatOpen && event.value && event.value.msg) { // Display the chat bubble if the chat window is closed and a valid message is received from the chatbot document.getElementById('msgDiv').style = "display: block"; document.getElementById('msgDiv').innerText = event.value.msg; } } else if (event.type === 'UI.OPENED') { // Hides the chat bubble if the chat window has been opened and updates the boolean variable isChatOpen = true document.getElementById('msgDiv').style = "display: none"; } else if (event.type === 'UI.CLOSED') { // Updates the chat bubble if the chat window is closed. This allows the chat bubble to be displayed again // if the chatbot sends a new event isChatOpen = false } }, // The list of events that we want to handle ['LIFECYCLE.LOADED', 'LIFECYCLE.READY', 'TRIGGER', 'UI.OPENED', 'UI.CLOSED'] )

https://www.youtube.com/watch?v=CLw2Mwd3euQ&t=58s

f
Then, what are you using the code for?
j
To create message notifications like this. It encourasges the web user to click and engage with the chatbot. When I use just the trigger on botpress it only sends the message once the user clicks on the chatbot, is this correct ? https://cdn.discordapp.com/attachments/1222646866420830412/1222652826719883335/Screenshot_2024-03-27_at_21.04.08.png?ex=6616ff2d&is=66048a2d&hm=9adb31f0e5739ae3cfa866e2577023ec71afbced2ab4bd542b36460391ea7fc0&
f
Alrighty. Since the amount of messages being sent is a problem, we could just create a fake little icon for that
It would show a red dot like that after 5 seconds of being on the page. Then it would go away once the chatbot has been opened
I would encourage you to try doing this yourself first, and then you can come here if you get stuck
j
okay sounds good, how do I do it?
f
You would create a new div in your HTML file
And then style it with some CSS
8 Views