Skip to content

Instantly share code, notes, and snippets.

@pdamoc pdamoc/Child.elm
Created Jun 3, 2016

Embed
What would you like to do?
Child 2 Child Communication.
module Child exposing (..)
import Html exposing (..)
import Html.Attributes exposing (value)
import Html.Events exposing (on, onClick, targetValue)
import Json.Decode as Json
-- MODEL
type alias Model =
String
init txt =
txt
-- UPDATE
type Msg
= ChangeText String
| SendUpstream
type UpstreamMsg
= UpdateOthers String
| NoEffect
update msg model =
case msg of
ChangeText txt ->
( txt, NoEffect )
SendUpstream ->
( model, UpdateOthers model )
-- VIEW
view model =
div []
[ text model
, input [ value model, on "input" (Json.map ChangeText targetValue) ] []
, button [ onClick SendUpstream ] [ text "SendUpstream" ]
]
-- SUBSCRIPTIONS
subscriptions model =
Sub.none
{
"version": "1.0.0",
"summary": "helpful summary of your project, less than 80 characters",
"repository": "https://github.com/user/project.git",
"license": "BSD3",
"source-directories": [
"."
],
"exposed-modules": [],
"dependencies": {
"elm-lang/core": "4.0.1 <= v < 5.0.0",
"elm-lang/html": "1.0.0 <= v < 2.0.0"
},
"elm-version": "0.17.0 <= v < 0.18.0"
}
module Main exposing (..)
import Html exposing (..)
import Html.App as App
import Task
import Child
main =
App.program
{ init = init
, update = update
, view = view
, subscriptions = subscriptions
}
-- MODEL
type alias Model =
{ top : Child.Model
, bottom : Child.Model
}
init =
( { top = Child.init "Top"
, bottom = Child.init "Bottom"
}
, Cmd.none
)
-- UPDATE
type Msg
= Top Child.Msg
| Bottom Child.Msg
| Update String
update msg model =
case msg of
Top cMsg ->
let
( newTop, upstream ) =
Child.update cMsg model.top
newModel =
{ model | top = newTop }
in
case upstream of
Child.NoEffect ->
( newModel, Cmd.none )
Child.UpdateOthers txt ->
( newModel, updateCmd txt )
Bottom cMsg ->
let
( newBottom, upstream ) =
Child.update cMsg model.bottom
newModel =
{ model | bottom = newBottom }
in
case upstream of
Child.NoEffect ->
( newModel, Cmd.none )
Child.UpdateOthers txt ->
( newModel, updateCmd txt )
Update txt ->
let
newModel =
Model txt txt
in
( newModel, Cmd.none )
updateCmd txt =
-- Imagine that this is a HTTP request or something more complex
Task.perform Update Update (Task.succeed txt)
-- VIEW
view model =
div []
[ App.map Top <| Child.view model.top
, App.map Bottom <| Child.view model.bottom
]
-- SUBSCRIPTIONS
subscriptions model =
Sub.none
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.