Created
April 8, 2017 15:16
-
-
Save napcs/d884497a67ffb87e9bbb82ae681f75b1 to your computer and use it in GitHub Desktop.
Elm with Flags
This file contains hidden or 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, div, p, text) | |
| -- Data type for the flags | |
| type alias Flags = | |
| { user : String | |
| , token : String | |
| } | |
| -- Data type for the model that represents the state of the application. | |
| type alias Model = | |
| { user: String | |
| , token :String | |
| , message: String | |
| } | |
| -- Message data type - NoOp cos this app doesn't do anything. | |
| type Msg = NoOp | |
| -- Pull the flags in, create new model. | |
| init : Flags -> ( Model, Cmd Msg ) | |
| init flags = | |
| ( (Model flags.user flags.token ""), Cmd.none ) | |
| -- Handle updates. Don't really have anything to do, so just return the model and Cmd.none as tuple. | |
| update : Msg -> Model -> (Model, Cmd Msg) | |
| update msg model= | |
| ( model, Cmd.none) | |
| -- every app needs a main. Kick off the process. | |
| main = | |
| -- programWithFlags requires init, update, subscriptions, and view. | |
| -- Just do an anonymous function for subs since we don't need any. | |
| -- \_ -> means anonymous function that needs no args. | |
| Html.programWithFlags | |
| { init = init | |
| , update = update | |
| , subscriptions = \_ -> Sub.none | |
| , view=view } | |
| -- display the things in the model | |
| view: Model -> Html msg | |
| view model = | |
| div [] | |
| [ p [] [text model.user] | |
| , p [] [text model.token] | |
| ] |
This file contains hidden or 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
| <html> | |
| <head> | |
| <title>Elm app</title> | |
| </head> | |
| <body> | |
| <script> | |
| // the valueso of the object get sent to the Elm app. | |
| var app = Elm.Main.fullscreen( {user: "Brian", token: "abcd"} ); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment