https://github.com/mroberge/HydroCloud
Raw File
Tip revision: 4d2f3243b15298d0bffb66db430a02982a638ab4 authored by Martin Roberge on 09 April 2018, 02:46:03 UTC
Merge pull request #123 from mroberge/Feedback
Tip revision: 4d2f324
chat.html
<html>
<head>
  <script src='https://cdn.firebase.com/js/client/2.2.1/firebase.js'></script>
  <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
</head>
<body>
<div id='messagesDiv'></div>
<input type='text' id='nameInput' placeholder='Name'>
<input type='text' id='messageInput' placeholder='Message'>
<script>
  var myDataRef = new Firebase('https://qywxwoyinr0.firebaseio-demo.com/');
  $('#messageInput').keypress(function (e) {
    if (e.keyCode == 13) {
      var name = $('#nameInput').val();
      var text = $('#messageInput').val();
      myDataRef.push({name: name, text: text});
      text.val('');
    }
  });
  myDataRef.on('child_added', function(snapshot) {
    var message = snapshot.val();
    displayChatMessage(message.name, message.text);
  });
  function displayChatMessage(name, text) {
    $('<div/>').text(text).prepend($('<em/>').text(name+': ')).appendTo($('#messagesDiv'));
    $('#messagesDiv')[0].scrollTop = $('#messagesDiv')[0].scrollHeight;
  }
</script>
</body>
</html>
back to top