From 3df83cd5dd50c351416d3125bc2b2cf33069bf52 Mon Sep 17 00:00:00 2001 From: Richard Feldman Date: Sun, 27 Mar 2016 07:18:43 -0700 Subject: [PATCH] Make 11 tail-recursive, update README, wipe out style.css --- stages/11/Component/ElmHub.elm | 28 ++++++++++- stages/11/README.md | 2 +- stages/11/style.css | 91 ---------------------------------- 3 files changed, 28 insertions(+), 93 deletions(-) diff --git a/stages/11/Component/ElmHub.elm b/stages/11/Component/ElmHub.elm index edc0207..fb9237f 100644 --- a/stages/11/Component/ElmHub.elm +++ b/stages/11/Component/ElmHub.elm @@ -3,6 +3,7 @@ module Component.ElmHub (..) where import Html exposing (..) import Html.Attributes exposing (..) import Html.Events exposing (..) +import Html.Lazy exposing (..) import Http import Task exposing (Task) import Effects exposing (Effects) @@ -69,10 +70,35 @@ view address model = , button [ class "search-button", onClick address Search ] [ text "Search" ] , ul [ class "results" ] - (List.map (viewSearchResult address) model.results) + (viewSearchResults address model.results) ] +viewSearchResults : Address Action -> List Component.SearchResult.Model -> List Html +viewSearchResults address results = + results + |> filterResults + |> List.map (lazy2 viewSearchResult address) + + +filterResults : List Component.SearchResult.Model -> List Component.SearchResult.Model +filterResults = + filterResultsHelp [] + + +filterResultsHelp : List Component.SearchResult.Model -> List Component.SearchResult.Model -> List Component.SearchResult.Model +filterResultsHelp output results = + case results of + [] -> + output + + first :: rest -> + if first.stars > 0 then + filterResultsHelp (first :: output) rest + else + filterResultsHelp output rest + + onInput address wrap = on "input" targetValue (\val -> Signal.message address (wrap val)) diff --git a/stages/11/README.md b/stages/11/README.md index b46a7a8..60754c3 100644 --- a/stages/11/README.md +++ b/stages/11/README.md @@ -19,5 +19,5 @@ elm live Main.elm --open -- --output=elm.js ## Compiling CSS ```bash -elm test css/Stylesheets.elm +elm css css/Stylesheets.elm ``` diff --git a/stages/11/style.css b/stages/11/style.css index 64c74d7..8b13789 100644 --- a/stages/11/style.css +++ b/stages/11/style.css @@ -1,92 +1 @@ -.content { - width: 960px; - margin: 0 auto; - padding: 30px; - font-family: Helvetica, Arial, serif; -} - -header { - position: relative; - padding: 6px 12px; - height: 36px; - background-color: rgb(96, 181, 204); -} - -h1 { - color: white; - font-weight: normal; - margin: 0; -} - -.tagline { - color: #eee; - position: absolute; - right: 16px; - top: 12px; - font-size: 24px; - font-style: italic; -} - -.results { - list-style-image: url('http://img-cache.cdn.gaiaonline.com/76bd5c99d8f2236e9d3672510e933fdf/http://i278.photobucket.com/albums/kk81/d3m3nt3dpr3p/Tiny-Star-Icon.png'); - list-style-position: inside; - padding: 0; -} - -.results li { - font-size: 18px; - margin-bottom: 16px; -} - -.star-count { - font-weight: bold; - margin-right: 16px; -} - -a { - color: rgb(96, 181, 204); - text-decoration: none; -} - -a:hover { - text-decoration: underline; -} - -.search-query { - padding: 8px; - font-size: 24px; - margin-bottom: 18px; - margin-top: 36px; -} - -.search-button { - padding: 8px 16px; - font-size: 24px; - color: white; - border: 1px solid #ccc; - background-color: rgb(96, 181, 204); - margin-left: 12px -} - -.search-button:hover { - color: rgb(96, 181, 204); - background-color: white; -} - -.hide-result { - background-color: transparent; - border: 0; - font-weight: bold; - font-size: 18px; - margin-left: 18px; - cursor: pointer; -} - -.hide-result:hover { - color: rgb(96, 181, 204); -} - -button:focus, input:focus { - outline: none; -}