Auto first message send but incoming message and e...
# 🤝helpj
jolly-airline-35614
03/27/2024, 8:42 PMAs 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]
jolly-airline-35614
03/27/2024, 8:42 PM
// 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']
)
f
fresh-fireman-491
03/27/2024, 8:44 PMHave you tried using the conversation started trigger?
https://cdn.discordapp.com/attachments/1222646866420830412/1222647391132586076/image.png?ex=6616fa1d&is=6604851d&hm=e57f279c7f37623b8ce4b28c98db23698da00c2a4323541a330a3d9b20f51200&
j
jolly-airline-35614
03/27/2024, 8:55 PMf
fresh-fireman-491
03/27/2024, 8:57 PMThen, what are you using the code for?
j
jolly-airline-35614
03/27/2024, 9:05 PMTo 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
fresh-fireman-491
03/27/2024, 9:10 PMAlrighty. Since the amount of messages being sent is a problem, we could just create a fake little icon for that
fresh-fireman-491
03/27/2024, 9:10 PMIt 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
fresh-fireman-491
03/27/2024, 9:12 PMI would encourage you to try doing this yourself first, and then you can come here if you get stuck
j
jolly-airline-35614
03/27/2024, 9:34 PMokay sounds good, how do I do it?
f
fresh-fireman-491
03/27/2024, 9:36 PMYou would create a new div in your HTML file
fresh-fireman-491
03/27/2024, 9:36 PMAnd then style it with some CSS
14 Views