Skip to content

Instantly share code, notes, and snippets.

@tshm
Created May 14, 2016 22:08
Show Gist options
  • Save tshm/c0bc0e9c2e3653e4f1b72bc8b26933be to your computer and use it in GitHub Desktop.
Save tshm/c0bc0e9c2e3653e4f1b72bc8b26933be to your computer and use it in GitHub Desktop.
elm app template
port module Main exposing (..)
import Html.App as Html
import Html exposing (..)
import Html.Events exposing (..)
import Html.Attributes exposing (..)
import Json.Decode as Json
import Debug exposing (..)
main : Program Never
main =
Html.program
{ init = { value = 0 } ! []
, view = view
, update = update
, subscriptions = subscriptions
}
-- MODEL
type alias Model = { value : Int }
-- VIEW
view : Model -> Html Msg
view model =
let
onNumInput : Json.Decoder Msg
onNumInput =
Json.map UpdateNum <|
Json.at ["target", "valueAsNumber"] Json.int
in input
[ type' "number"
, on "change" onNumInput
, value (toString model.value)
]
[]
-- UPDATE
type Msg = UpdateNum Int
update : Msg -> Model -> (Model, Cmd Msg)
update msg model =
case msg of
UpdateNum newval ->
(log "model" { model | value = newval }) ! []
-- SUBSCRIPTIONS
subscriptions : Model -> Sub Msg
subscriptions model =
externalfeed UpdateNum
port externalfeed : (Int -> msg) -> Sub msg
module Main exposing (..)
import Html.App as Html
import Html exposing (..)
import Html.Events exposing (..)
import Html.Attributes exposing (..)
import Json.Decode as Json
import Debug exposing (..)
main : Program Never
main =
Html.beginnerProgram
{ model = { value = 0 }
, view = view
, update = update
}
-- MODEL
type alias Model = { value : Int }
-- VIEW
view : Model -> Html Msg
view model =
let
onNumInput : Json.Decoder Msg
onNumInput =
Json.map UpdateNum <|
Json.at ["target", "valueAsNumber"] Json.int
in input
[ type' "number"
, on "change" onNumInput
, value (toString model.value)
]
[]
-- UPDATE
type Msg = UpdateNum Int
update : Msg -> Model -> Model
update msg model =
case msg of
UpdateNum newval ->
log "model" { model | value = newval }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment