GoZXxQ

GoZXxQ.markdown

GoZXxQ

Forked from Captain Anonymous's Pen WrwyJQ.

A Pen by Stephen Blum on CodePen.

License.

index.html

<!-- Enter Chat and press enter -->
<div>
  <input id=input placeholder=chat-here />
  <button id=send>send</button>
</div>

<!-- Chat Output -->
<div id=box></div>

script.js

(function() {

  var box = PUBNUB.$('box'),
    send = PUBNUB.$('send'),
    input = PUBNUB.$('input'),
    channel = 'chat';
  PUBNUB = PUBNUB({
    publish_key: 'demo',
    subscribe_key: 'demo'
  })
  PUBNUB.subscribe({
    channel: channel,
    callback: function(text) {
      box.innerHTML = ('' + text).replace(/[<>]/g, '') + '<br>' + box.innerHTML
    }
  });

  function deliver() {
    PUBNUB.publish({
      channel: channel,
      message: input.value,
      x: (input.value = '')
    })
  }

  PUBNUB.bind('keyup', input, function(e) {
    if ((e.keyCode || e.charCode) === 13) deliver();
  });
  PUBNUB.bind('mousedown,touchstart', send, deliver);

})();

scripts

<script src="https://cdn.pubnub.com/pubnub-dev.js"></script>

style.css

input,
button,
div {
  padding: 10px;
  margin: 10px;
  font-size: 30px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}