From ef53f19617f4c06a40716d288d35b769d787c754 Mon Sep 17 00:00:00 2001
From: Ethan Fraenkel <ethan.fraenkel@hotmail.com>
Date: Thu, 6 Sep 2018 16:13:49 +0100
Subject: [PATCH] done with scroll to bottom

---
 app/javascript/packs/chatrooms.js  | 6 ++++++
 app/views/chat_rooms/show.html.erb | 5 +++++
 2 files changed, 11 insertions(+)

diff --git a/app/javascript/packs/chatrooms.js b/app/javascript/packs/chatrooms.js
index a377d25..ab94e1b 100644
--- a/app/javascript/packs/chatrooms.js
+++ b/app/javascript/packs/chatrooms.js
@@ -49,6 +49,7 @@ App['chatroom' + chatroomId] = App.cable.subscriptions.create({
 
         // Add message to container
         messagesContainer.appendChild(messageDiv)
+        messagesContainer.scrollTop = div.scrollHeight
 
       } else if (data["chat_message"] && data["chat_message"]["userId"] != userId) {
         // const callerName = document.getElementById('caller-name')
@@ -75,6 +76,8 @@ App['chatroom' + chatroomId] = App.cable.subscriptions.create({
           }),
           headers: { "content-type": "application/json", "X-CSRF-Token": document.querySelector('meta[name=csrf-token]').content }
         })
+        const messagesContainer = document.getElementById('messages-container')
+        messagesContainer.scrollTop = div.scrollHeight
       } else if (data["translated_message"] && data["userId"] == userId) {
           const messagesContainer = document.getElementById('messages-container')
 
@@ -105,8 +108,11 @@ App['chatroom' + chatroomId] = App.cable.subscriptions.create({
           })
 
           messagesContainer.appendChild(messageDiv)
+          messagesContainer.scrollTop = div.scrollHeight
       } else {
         // console.log(data)
+        const messagesContainer = document.getElementById('messages-container')
+        messagesContainer.scrollTop = div.scrollHeight
       }
       if (data.hangUp) {
         document.location.pathname = '/contacts'
diff --git a/app/views/chat_rooms/show.html.erb b/app/views/chat_rooms/show.html.erb
index a9cb03f..f5d8f86 100644
--- a/app/views/chat_rooms/show.html.erb
+++ b/app/views/chat_rooms/show.html.erb
@@ -60,6 +60,11 @@
 
 <div><span id="current-user" class="text-color" style="display:none"><%= current_user.id %></span></div>
 
+<script>
+  const div = document.getElementById('messages-container')
+  div.scrollTop = div.scrollHeight
+</script>
+
 <%= javascript_pack_tag 'chatrooms' %>
 <%= javascript_pack_tag 'webrtc' %>
 <%= javascript_pack_tag 'translate' %>