Scroll when new messages arrive and user is close to the bottom.

src/Scylla/Model.elm

@@ -3,8 +3,9 @@ import Scylla.Api exposing (..)
 import Scylla.Sync exposing (SyncResponse, JoinedRoom, senderName)
 import Scylla.Login exposing (LoginResponse, Username, Password)
 import Scylla.UserData exposing (UserData)
-import Scylla.Route exposing (Route)
+import Scylla.Route exposing (Route(..), RoomId)
 import Browser.Navigation as Nav
+import Browser.Dom exposing (Viewport)
 import Url.Builder
 import Dict exposing (Dict)
 import Browser
@@ -36,6 +37,8 @@ type Msg =
     | ChangeRoomText String String -- Change to a room's input text
     | SendRoomText String -- Sends a message typed into a given room's input
     | SendRoomTextResponse (Result Http.Error ()) -- A send message response finished
+    | ViewportAfterMessage (Result Browser.Dom.Error Viewport) -- A message has been received, try scroll (maybe)
+    | ViewportChangeComplete (Result Browser.Dom.Error ()) -- We're done changing the viewport.
     | ReceiveFirstSyncResponse (Result Http.Error SyncResponse) -- HTTP, Sync has finished
     | ReceiveSyncResponse (Result Http.Error SyncResponse) -- HTTP, Sync has finished
     | ReceiveLoginResponse (Result Http.Error LoginResponse) -- HTTP, Login has finished
@@ -49,3 +52,15 @@ roomUrl s = Url.Builder.absolute [ "room", s ] []
 
 loginUrl : String
 loginUrl = Url.Builder.absolute [ "login" ] []
+
+currentRoom : Model -> Maybe JoinedRoom
+currentRoom m =
+    let
+        roomDict = Maybe.withDefault Dict.empty <| Maybe.andThen .join <| m.sync.rooms
+    in
+        Maybe.andThen (\s -> Dict.get s roomDict) <| currentRoomId m
+
+currentRoomId : Model -> Maybe RoomId
+currentRoomId m = case m.route of
+    Room r -> Just r
+    _ -> Nothing

src/Scylla/Views.elm

@@ -11,7 +11,7 @@ import Svg.Attributes
 import Url.Builder
 import Json.Decode as Decode
 import Html exposing (Html, Attribute, div, input, text, button, div, span, a, h2, table, td, tr, img)
-import Html.Attributes exposing (type_, value, href, class, style, src)
+import Html.Attributes exposing (type_, value, href, class, style, src, id)
 import Html.Events exposing (onInput, onClick, on)
 import Dict
 
@@ -156,7 +156,7 @@ iconView name =
             ] [ Svg.use [ Svg.Attributes.xlinkHref (url ++ "#" ++ name) ] [] ]
 
 eventWrapperView : Model -> List (Html Msg) -> Html Msg
-eventWrapperView m es = div [ class "events-wrapper" ] [ table [ class "events-table" ] es ]
+eventWrapperView m es = div [ class "events-wrapper", id "events-wrapper" ] [ table [ class "events-table" ] es ]
 
 eventView : Model -> RoomEvent -> Maybe (Html Msg)
 eventView m re =