@agilegravity/chat-sdk
v1.2.2
Published
Downloads
47
Readme
Chat SDK
example
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>chat SDK example</title>
<style media="screen">
</style>
</head>
<body>
<ul id="chat" class="chat">
</ul>
<input id="msg" type="text" name="msg" >
<button type="button" name="button" onClick="send()">send</button>
<script src="/dist/chatSDK.js"></script>
<script type="text/javascript">
const chd = new chatSDK({ // eslint-disable-line
clientkey: 'bandel',
apiURL: 'https://bandel-bot-backend.agilegravity.com',
})
chd.on('brickUpdate', (data) => {
addMessage(data.data)
})
chd.on('connected', () => {
(chd.getBricks() || [])
.sort((a, b) => (a.createdAt < b.createdAt ? -1 : 1))
.forEach(brick => addMessage(brick))
})
const addMessage = (brick) => {
console.log(brick);
document.getElementById("chat").insertAdjacentHTML('beforeend', '<li>'+brick.msg+'</li>')
for (var i = 0; i < brick.suggestedOptions.length; i++) {
document.getElementById("chat").insertAdjacentHTML('beforeend', '<li><button>'+suggestedOptions.headline+'<button></li>')
}
}
const send = () => {
const msg = document.getElementById("msg").value;
console.log(msg);
chd.sendMessage({msg: msg});
document.getElementById("msg").value = "";
}
</script>
</body>
</html>Brick Flags
"flags": {
"userinput": {
"text": "placeholder text", //paceholder text for frontend rendering
"name": "user input", //internal name used in the backend
"enabled": true //false - wether userinput should be enabled or not
}