From 0ea9f2c90495ae204fccfb6a0285ed14d8319611 Mon Sep 17 00:00:00 2001
From: Evan Czaplicki <evancz@users.noreply.github.com>
Date: Wed, 20 Jul 2016 16:33:06 -0700
Subject: [PATCH] Make presidents searchable by name

---
 examples/{Presidents.elm => 1-presidents.elm} | 49 ++++++++++++++-----
 1 file changed, 38 insertions(+), 11 deletions(-)
 rename examples/{Presidents.elm => 1-presidents.elm} (78%)

diff --git a/examples/Presidents.elm b/examples/1-presidents.elm
similarity index 78%
rename from examples/Presidents.elm
rename to examples/1-presidents.elm
index 45e8218..5f36979 100644
--- a/examples/Presidents.elm
+++ b/examples/1-presidents.elm
@@ -1,5 +1,8 @@
-import Html exposing (Html, div, h1, text)
+import Html exposing (Html, div, h1, input, text)
 import Html.App as App
+import Html.Attributes exposing (placeholder, value)
+import Html.Events exposing (onInput)
+import String
 import Table
 
 
@@ -20,14 +23,20 @@ main =
 type alias Model =
   { people : List Person
   , tableState : Table.State
+  , query : String
   }
 
 
 init : List Person -> ( Model, Cmd Msg )
 init people =
-  ( Model people (Table.initialSort "Year")
-  , Cmd.none
-  )
+  let
+    model =
+      { people = people
+      , tableState = Table.initialSort "Year"
+      , query = ""
+      }
+  in
+    ( model, Cmd.none )
 
 
 
@@ -35,14 +44,22 @@ init people =
 
 
 type Msg
-  = UpdateTableState Table.State
+  = UpdateQuery String
+  | UpdateTableState Table.State
 
 
 update : Msg -> Model -> ( Model, Cmd Msg )
 update msg model =
   case msg of
+    UpdateQuery newQuery ->
+      ( { model | query = String.toLower newQuery }
+      , Cmd.none
+      )
+
     UpdateTableState newState ->
-      ( Model model.people newState, Cmd.none )
+      ( { model | tableState = newState }
+      , Cmd.none
+      )
 
 
 
@@ -50,11 +67,21 @@ update msg model =
 
 
 view : Model -> Html Msg
-view {people, tableState} =
-  div []
-    [ h1 [] [ text "Birthplaces of U.S. Presidents" ]
-    , Table.view config tableState people
-    ]
+view { people, tableState, query } =
+  let
+    acceptablePeople =
+      List.filter (String.contains query << String.toLower << .name) people
+  in
+    div []
+      [ h1 [] [ text "Birthplaces of U.S. Presidents" ]
+      , input
+          [ value query
+          , placeholder "Search by Name"
+          , onInput UpdateQuery
+          ]
+          []
+      , Table.view config tableState acceptablePeople
+      ]
 
 
 config : Table.Config Person Msg