cerchez07/elm-0.19-workshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update a ton of things

Browse Source
This commit is contained in:
Richard Feldman
2016-06-24 17:40:54 -07:00
parent 908ca61c77
commit c8e9a117f5
56 changed files with 1023 additions and 1466 deletions
Download Patch File Download Diff File Expand all files Collapse all files

252
part6/ElmHub.elm
View File

@@ -1,200 +1,152 @@
module ElmHub (..) where
module ElmHub exposing (..)
import Auth
import Html exposing (..)
import Html.Attributes exposing (class, target, href, property)
import Html.Attributes exposing (class, target, href, property, defaultValue)
import Html.Events exposing (..)
import Http
import Task exposing (Task)
import Effects exposing (Effects)
import Json.Decode exposing (Decoder, (:=))
import Json.Decode exposing (Decoder)
import Json.Decode.Pipeline exposing (..)
import Json.Encode
import Signal exposing (Address)
searchFeed : String -> Effects Action
searchFeed : String -> Cmd Msg
searchFeed query =
let
url =
"https://api.github.com/search/repositories?access_token="
++ Auth.token
++ "&q="
++ query
++ "+language:elm&sort=stars&order=desc"
let
url =
"https://api.github.com/search/repositories?access_token="
++ Auth.token
++ "&q="
++ query
++ "+language:elm&sort=stars&order=desc"
-- TODO define task as:
--
-- task = performAction argument1 argument2 argument3
--
-- Use these "ingredients" to give `performAction` the arguments it needs:
--
-- Http.get
-- url
-- responseDecoder
-- HandleSearchResponse
-- HandleSearchError
--
-- Hint: http://package.elm-lang.org/packages/evancz/elm-http/3.0.0/Http#get
task =
"TODO performAction ..."
in
-- TODO replace this `Effects.none` with a call to:
--
-- Effects.task task
Effects.none
{-| Note: this will be a standard function in the next release of Elm.
Example:
type Action =
HandleResponse String | HandleError Http.Error
performAction
(\responseString -> HandleResponse responseString)
(\httpError -> HandleError httpError)
(Http.getString "https://google.com?q=something")
-}
performAction : (a -> b) -> (y -> b) -> Task y a -> Task x b
performAction successToAction errorToAction task =
let
successTask =
Task.map successToAction task
in
Task.onError successTask (\err -> Task.succeed (errorToAction err))
-- TODO use these ingredients to give Task.perform the arguments it needs:
--
-- Http.get
-- url
-- responseDecoder
-- HandleSearchResponse
-- HandleSearchError
--
-- Hint: http://package.elm-lang.org/packages/evancz/elm-http/3.0.0/Http#get
task =
"TODO call Task.perform ..."
in
-- TODO replace this Cmd.none with a call to Task.perform
Cmd.none
responseDecoder : Decoder (List SearchResult)
responseDecoder =
"items" := Json.Decode.list searchResultDecoder
Json.Decode.at [ "items" ] (Json.Decode.list searchResultDecoder)
searchResultDecoder : Decoder SearchResult
searchResultDecoder =
decode SearchResult
|> required "id" Json.Decode.int
|> required "full_name" Json.Decode.string
|> required "stargazers_count" Json.Decode.int
decode SearchResult
|> required "id" Json.Decode.int
|> required "full_name" Json.Decode.string
|> required "stargazers_count" Json.Decode.int
type alias Model =
{ query : String
, results : List SearchResult
, errorMessage : Maybe String
}
{ query : String
, results : List SearchResult
, errorMessage : Maybe String
}
type alias SearchResult =
{ id : ResultId
, name : String
, stars : Int
}
{ id : ResultId
, name : String
, stars : Int
}
type alias ResultId =
Int
Int
initialModel : Model
initialModel =
{ query = "tutorial"
, results = []
, errorMessage = Nothing
}
{ query = "tutorial"
, results = []
, errorMessage = Nothing
}
view : Address Action -> Model -> Html
view address model =
div
[ class "content" ]
[ header
[]
[ h1 [] [ text "ElmHub" ]
, span [ class "tagline" ] [ text "“Like GitHub, but for Elm things.”" ]
view : Model -> Html Msg
view model =
div [ class "content" ]
[ header []
[ h1 [] [ text "ElmHub" ]
, span [ class "tagline" ] [ text "“Like GitHub, but for Elm things.”" ]
]
, input [ class "search-query", onInput SetQuery, defaultValue model.query ] []
, button [ class "search-button", onClick Search ] [ text "Search" ]
, viewErrorMessage model.errorMessage
, ul [ class "results" ] (List.map viewSearchResult model.results)
]
, input [ class "search-query", onInput address SetQuery, defaultValue model.query ] []
, button [ class "search-button", onClick address Search ] [ text "Search" ]
, viewErrorMessage model.errorMessage
, ul
[ class "results" ]
(List.map (viewSearchResult address) model.results)
]
viewErrorMessage : Maybe String -> Html
viewErrorMessage : Maybe String -> Html a a
viewErrorMessage errorMessage =
case errorMessage of
Just message ->
div [ class "error" ] [ text message ]
case errorMessage of
Just message ->
div [ class "error" ] [ text message ]
Nothing ->
text ""
Nothing ->
text ""
onInput address wrap =
on "input" targetValue (\val -> Signal.message address (wrap val))
viewSearchResult : SearchResult -> Html Msg
viewSearchResult result =
li []
[ span [ class "star-count" ] [ text (toString result.stars) ]
, a [ href ("https://github.com/" ++ result.name), target "_blank" ]
[ text result.name ]
, button [ class "hide-result", onClick (DeleteById result.id) ]
[ text "X" ]
]
defaultValue str =
property "defaultValue" (Json.Encode.string str)
type Msg
= Search
| SetQuery String
| DeleteById ResultId
| HandleSearchResponse (List SearchResult)
| HandleSearchError Http.Error
viewSearchResult : Address Action -> SearchResult -> Html
viewSearchResult address result =
li
[]
[ span [ class "star-count" ] [ text (toString result.stars) ]
, a
[ href ("https://github.com/" ++ result.name), target "_blank" ]
[ text result.name ]
, button
[ class "hide-result", onClick address (DeleteById result.id) ]
[ text "X" ]
]
update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
case msg of
Search ->
( model, searchFeed model.query )
HandleSearchResponse results ->
( { model | results = results }, Cmd.none )
type Action
= Search
| SetQuery String
| DeleteById ResultId
| HandleSearchResponse (List SearchResult)
| HandleSearchError Http.Error
HandleSearchError error ->
-- TODO if decoding failed, store the message in model.errorMessage
--
-- Hint 1: look for "decode" in the documentation for this union type:
-- http://package.elm-lang.org/packages/evancz/elm-http/3.0.1/Http#Error
--
-- Hint 2: to check if this is working, break responseDecoder
-- by changing "stargazers_count" to "description"
( model, Cmd.none )
SetQuery query ->
( { model | query = query }, Cmd.none )
update : Action -> Model -> ( Model, Effects Action )
update action model =
case action of
Search ->
( model, searchFeed model.query )
DeleteById idToHide ->
let
newResults =
model.results
|> List.filter (\{ id } -> id /= idToHide)
HandleSearchResponse results ->
( { model | results = results }, Effects.none )
HandleSearchError error ->
-- TODO if decoding failed, store the message in model.errorMessage
--
-- Hint 1: look for "decode" in the documentation for this union type:
-- http://package.elm-lang.org/packages/evancz/elm-http/3.0.0/Http#Error
--
-- Hint 2: to check if this is working, break responseDecoder
-- by changing "stargazers_count" to "description"
( model, Effects.none )
SetQuery query ->
( { model | query = query }, Effects.none )
DeleteById idToHide ->
let
newResults =
model.results
|> List.filter (\{ id } -> id /= idToHide)
newModel =
{ model | results = newResults }
in
( newModel, Effects.none )
newModel =
{ model | results = newResults }
in
( newModel, Cmd.none )

30
part6/Main.elm
View File

@@ -1,27 +1,13 @@
module Main (..) where
module Main exposing (..)
import StartApp
import ElmHub exposing (..)
import Effects exposing (Effects)
import Task exposing (Task)
import Html exposing (Html)
main : Signal Html
main : Program Never
main =
app.html
app : StartApp.App Model
app =
StartApp.start
{ view = view
, update = update
, init = ( initialModel, searchFeed initialModel.query )
, inputs = []
}
port tasks : Signal (Task Effects.Never ())
port tasks =
app.tasks
Html.App.program
{ view = view
, update = update
, init = ( initialModel, searchFeed initialModel.query )
, inputs = []
}

6
part6/README.md
View File

@@ -4,16 +4,16 @@ Part 6
## Installation
```bash
elm package install
elm-package install
```
(Answer `y` at the prompt. In rare cases a known issue can cause the download
to fail; in that case, just run `elm package install` again.)
to fail; in that case, just run `elm-package install` again.)
## Building
```bash
elm live Main.elm --open -- --output=elm.js
elm-live Main.elm --open -- --output=elm.js
```
## References

10
part6/elm-package.json
View File

@@ -10,11 +10,9 @@
"exposed-modules": [],
"dependencies": {
"NoRedInk/elm-decode-pipeline": "1.0.0 <= v < 2.0.0",
"elm-lang/core": "3.0.0 <= v < 4.0.0",
"evancz/elm-effects": "2.0.0 <= v < 3.0.0",
"evancz/elm-html": "4.0.0 <= v < 5.0.0",
"evancz/elm-http": "3.0.0 <= v < 4.0.0",
"evancz/start-app": "2.0.0 <= v < 3.0.0"
"elm-lang/core": "4.0.1 <= v < 5.0.0",
"elm-lang/html": "1.0.0 <= v < 2.0.0",
"evancz/elm-http": "3.0.1 <= v < 4.0.0"
},
"elm-version": "0.16.0 <= v < 0.17.0"
"elm-version": "0.17.0 <= v < 0.18.0"
}