<h1>Chat-box (With HTML and JAVASCRIPT)</h1>
<title>User chat</title>
<div><input id=input placeholder="Press Enter to Send" /></div><br><br>
Chat Output
<div id=box></div>
<script src=https://cdn.pubnub.com/sdk/javascript/pubnub.4.28.2.min.js></script>
<script> (function() {
var pubnub = new PubNub({
publishKey: 'demo',
subscribeKey: 'demo'
});
function $(id) {
return document.getElementById(id);
}
var box = $('box'),
input = $('input'),
channel = '10chat-demo';
pubnub.addListener({
message: function(obj) {
box.innerHTML = ('' + obj.message).replace(/[<>]/g, '') + '<br>' + box.innerHTML
}
});
pubnub.subscribe({
channels: [channel]
});
input.addEventListener('keyup', function(e) {
if ((e.keyCode || e.charCode) === 13) {
pubnub.publish({
channel: channel,
message: input.value,
x: (input.value = '')
});
}
});
})();
</script>