function auth(token, protocol, host) {
const XML = new XMLHttpRequest()
XML.open('POST', `${protocol}//${host}/api/application/authentication`, false)
XML.setRequestHeader('Content-Type', 'application/json')
res = XML.send(JSON.stringify({ access_token: token }))
return XML.status == 200
}
function embedChatbot() {
const t = window.maxkbChatConfig
check = auth(t.token, t.protocol, t.host)
if (t && t.token && t.protocol && t.host && check) {
icon = ``
chat_button = document.createElement('div')
chat_button.style = 'position: fixed;bottom: 30px;right: 0;cursor: pointer;'
chat_button.innerHTML = icon
style=document.createElement('style')
style.type='text/css'
style.innerText= `#chat_container {
width: 420px;
height: 600px;
}
@media only screen and (max-width: 768px) {
#chat_container {
width: 100%;
height: 70%;
right: 0 !important;
}
}`
document.head.appendChild(style)
chat_container = document.createElement('div')
chat_container.id = 'chat_container'
chat_container.style.cssText = `z-index:10000;position: relative;
border-radius: 8px;
border: 1px solid var(--N300, #DEE0E3);
background: linear-gradient(188deg, rgba(235, 241, 255, 0.20) 39.6%, rgba(231, 249, 255, 0.20) 94.3%), #EFF0F1;
box-shadow: 0px 4px 8px 0px rgba(31, 35, 41, 0.10);
position: fixed;bottom: 20px;right: 45px;overflow: hidden;`
chat_container.style['display'] = 'none'
chat = document.createElement('iframe')
chat.src = `${window.maxkbChatConfig.protocol}//${window.maxkbChatConfig.host}/ui/chat/${window.maxkbChatConfig.token}`
chat.id = 'chat'
chat_container.append(chat)
chat.style.cssText = `border: none;height:100%;width:100%`
close_button = document.createElement('div')
close_button.innerHTML = ``
close_button.style.cssText = `position: absolute;
top: 15px;
right: 10px;
cursor: pointer;
`
close_button.onclick = () => {
chat_container.style['display']='none'
}
chat_container.append(close_button)
document.body.append(chat_container)
chat_button.onclick = ($event) => {
chat_container.style['display']=chat_container.style['display']=='block'?'none':'block'
}
sty = document.createElement('style')
sty.innerText = ` #chat_container {
animation: appear .4s ease-in-out;
}
@keyframes appear {
from {
height: 0;;
}
to {
height: 600px;
}
}
`
document.head.append(sty)
document.body.append(chat_button)
} else console.error('invalid parameter')
}
window.onload = embedChatbot