From 3a31f98f3bfc13d5a8b341b34f2202315eaaf9bb Mon Sep 17 00:00:00 2001
From: Danila Fedorin <danila.fedorin@gmail.com>
Date: Sun, 19 May 2019 13:42:22 -0700
Subject: [PATCH] Wire up the search bar.

---
 src/Main.elm           |  2 ++
 src/Scylla/Model.elm   |  2 ++
 src/Scylla/Views.elm   | 10 +++++++++-
 static/scss/style.scss |  6 +++++-
 4 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/src/Main.elm b/src/Main.elm
index b00e71c..eed1ad5 100644
--- a/src/Main.elm
+++ b/src/Main.elm
@@ -53,6 +53,7 @@ init _ url key =
             , transactionId = 0
             , userData = Dict.empty
             , connected = True
+            , searchText = ""
             }
         cmd = getStoreValuePort "scylla.loginInfo"
     in
@@ -105,6 +106,7 @@ update msg model = case msg of
     ReceiveMarkdown md -> updateMarkdown model md
     DismissError i -> updateDismissError model i
     AttemptReconnect -> ({ model | connected = True }, firstSync model.apiUrl (Maybe.withDefault "" model.token))
+    UpdateSearchText s -> ({ model | searchText = s }, Cmd.none)
 
 requestScrollCmd : Cmd Msg
 requestScrollCmd = Task.attempt ViewportAfterMessage (Browser.Dom.getViewportOf "messages-wrapper")
diff --git a/src/Scylla/Model.elm b/src/Scylla/Model.elm
index 5d612a1..385803e 100644
--- a/src/Scylla/Model.elm
+++ b/src/Scylla/Model.elm
@@ -32,6 +32,7 @@ type alias Model =
     , transactionId : Int
     , userData : Dict Username UserData
     , connected : Bool
+    , searchText : String
     }
 
 type Msg =
@@ -68,6 +69,7 @@ type Msg =
     | ReceiveMarkdown MarkdownResponse
     | DismissError Int
     | AttemptReconnect
+    | UpdateSearchText String
 
 displayName : Model -> Username -> String
 displayName m s = Maybe.withDefault (senderName s) <| Maybe.andThen .displayName <| Dict.get s m.userData
diff --git a/src/Scylla/Views.elm b/src/Scylla/Views.elm
index 2bfbb7d..9901aac 100644
--- a/src/Scylla/Views.elm
+++ b/src/Scylla/Views.elm
@@ -91,7 +91,13 @@ roomListView m =
     in
         div [ class "rooms-wrapper" ]
             [ h2 [] [ text "Rooms" ]
-            , input [ class "room-search", type_ "text", placeholder "Search chats..." ] []
+            , input
+                [ class "room-search"
+                , type_ "text"
+                , placeholder "Search chats..."
+                , onInput UpdateSearchText 
+                , value m.searchText
+                ] []
             , homeserverList
             ]
 
@@ -111,6 +117,7 @@ roomListElementView : Model -> String -> JoinedRoom -> Html Msg
 roomListElementView m s jr =
     let
         name = roomDisplayName m jr
+        isVisible = m.searchText == "" || (String.contains (String.toLower m.searchText) <| String.toLower name)
         isCurrentRoom = case currentRoomId m of
             Nothing -> False
             Just cr -> cr == s
@@ -118,6 +125,7 @@ roomListElementView m s jr =
         div [ classList
                 [ ("room-link-wrapper", True)
                 , ("active", isCurrentRoom)
+                , ("hidden", not isVisible)
                 ]
             ]
             [ a [ href <| roomUrl s ] [ text name ]
diff --git a/static/scss/style.scss b/static/scss/style.scss
index 1e904da..a4a6fdb 100644
--- a/static/scss/style.scss
+++ b/static/scss/style.scss
@@ -172,7 +172,7 @@ div.room-link-wrapper {
     padding-left: 5px;
     margin: 3px;
     align-items: center;
-
+    
     span, a {
         margin-right: 5px;
         color: lightgrey;
@@ -186,6 +186,10 @@ div.room-link-wrapper {
     &.active {
         border-left: solid 2px $primary-color;
     }
+
+    &.hidden {
+        display: none;
+    }
 }
 
 div.reconnect-wrapper {