Last active
August 16, 2018 22:31
-
-
Save bigos/57e3a13f2a5108e83151fd9710469b69 to your computer and use it in GitHub Desktop.
Elm code for parsing json data
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
module Main exposing (..) | |
import Html exposing (Html, text, div, h1, img, p, ul, li, hr) | |
import Html.Attributes exposing (src) | |
import Json.Decode exposing (..) | |
import ISO8601 | |
---- MODEL ---- | |
type alias Flags = | |
{ population_id : Int | |
, token : String | |
} | |
type alias Model = | |
{ id : Int | |
, token : String | |
} | |
init : Flags -> ( Model, Cmd Msg ) | |
init flags = | |
( { id = flags.population_id | |
, token = flags.token | |
} | |
, Cmd.none | |
) | |
type alias Data = | |
{ id : Int, results : List JsonResult } | |
dataDecoder = | |
map2 Data (field "id" int) (field "results" (list resultDecoder)) | |
type alias JsonResult = | |
{ population_id : Int | |
, concentration : Float | |
, created_at : ISO8601.Time | |
, updated_at : ISO8601.Time | |
} | |
resultDecoder = | |
map4 JsonResult | |
(field "population_id" int) | |
(field "concentration" float) | |
(field "created_at" decodeTimeStamp) | |
(field "updated_at" decodeTimeStamp) | |
decodeTimeStamp : Decoder ISO8601.Time | |
decodeTimeStamp = | |
string | |
|> andThen | |
(\val -> | |
(case (ISO8601.fromString val) of | |
Ok ts -> | |
Json.Decode.succeed ts | |
Err errmsg -> | |
Json.Decode.fail errmsg | |
) | |
) | |
sampleData = | |
"""{"id":1,"results":[{"id":1,"population_id":1,"concentration":4.856980400767765,"created_at":"2018-08-14T12:00:00.000Z","updated_at":"2018-08-14T12:00:00.000Z"},{"id":2,"population_id":1,"concentration":5.18766176298193,"created_at":"2018-08-11T15:00:00.000Z","updated_at":"2018-08-11T15:00:00.000Z"},{"id":3,"population_id":1,"concentration":7.052054290295231,"created_at":"2018-08-10T10:00:00.000Z","updated_at":"2018-08-10T10:00:00.000Z"}]}""" | |
---- UPDATE ---- | |
type Msg | |
= NoOp | |
update : Msg -> Model -> ( Model, Cmd Msg ) | |
update msg model = | |
( model, Cmd.none ) | |
---- VIEW ---- | |
boo res = | |
case res of | |
Err msg -> | |
[] | |
Ok a -> | |
a.results | |
view : Model -> Html Msg | |
view model = | |
let | |
res = | |
(decodeString dataDecoder model.token) | |
in | |
div [] | |
[ h1 [] [ text "Your Elm App is working! almost fairly flawlessly" ] | |
, p [] [ text (toString model) ] | |
, p [] [ text (toString res) ] | |
, Html.hr [] [] | |
, toHtmlList (boo res) | |
] | |
toHtmlList : List JsonResult -> Html msg | |
toHtmlList strings = | |
ul [] (List.map toLi strings) | |
toLi : JsonResult -> Html msg | |
toLi s = | |
li [] | |
[ text | |
("concentration " | |
++ (toString s.concentration) | |
++ " date converted back to string " | |
++ (ISO8601.toString s.created_at) | |
) | |
] | |
---- PROGRAM ---- | |
main = | |
Html.programWithFlags | |
{ view = view | |
, init = init | |
, update = update | |
, subscriptions = always Sub.none | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div id="elmdiv"></div> | |
<script> | |
var node = document.getElementById('elmdiv'); | |
var app = Elm.Main.embed(node, { | |
population_id: <%= @population.id %>, | |
token: '<%= raw @population.samples.to_json %>' | |
}); | |
// Note: if your Elm module is named "MyThing.Root" you | |
// would call "Elm.MyThing.Root.embed(node)" instead. | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment