Last active
August 28, 2015 02:40
-
-
Save TheSeamau5/45b07d52f2c5f0bab638 to your computer and use it in GitHub Desktop.
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
import Signal exposing (Address) | |
import Html exposing (Html, div, button, span, text) | |
import Html.Events exposing (onClick) | |
type alias Component action state effect view | |
= action | |
-> state | |
-> (state, List effect, view) | |
type alias HtmlComponent action state effect | |
= Component action state effect (Address action -> Html) | |
type alias HigherOrderComponent fromAction fromState fromEffect toAction toState toEffect | |
= HtmlComponent fromAction fromState fromEffect | |
-> HtmlComponent toAction toState toEffect | |
type alias ContainerComponent fromAction fromState fromEffect toAction toState toEffect context | |
= List (HtmlComponent fromAction fromState fromEffect) | |
-> context | |
-> HtmlComponent toAction toState toEffect | |
type alias ListComponent action state effect | |
= ContainerComponent action state effect (action, Int) (List state) (effect, Int) Int | |
pure : (state, view) -> (state, List Never, view) | |
pure (state, view) = | |
(state, [], view) | |
------------- | |
-- EXAMPLE -- | |
------------- | |
type Action | |
= Increment | |
| Decrement | |
| NoOp | |
counter : HtmlComponent Action Int Never | |
counter action oldState = | |
let | |
state = | |
case action of | |
Increment -> | |
oldState + 1 | |
Decrement -> | |
oldState - 1 | |
NoOp -> | |
oldState | |
view address = | |
div | |
[] | |
[ button | |
[ onClick address Increment ] | |
[ text "+" ] | |
, button | |
[ onClick address Decrement ] | |
[ text "-" ] | |
, span | |
[] | |
[ text (toString state) ] | |
] | |
in | |
pure | |
(state, view) | |
main = | |
run counter NoOp 0 | |
|> .views | |
------------- | |
run : HtmlComponent action state effect | |
-> action | |
-> state | |
-> Output action state effect Html | |
run component initialAction initialState = | |
let | |
{address, signal} = | |
Signal.mailbox initialAction | |
initial = | |
component initialAction initialState | |
update action (state, _, _) = | |
component action state | |
outputs = | |
Signal.foldp update initial signal | |
in | |
{ states = Signal.map (\(a,_,_) -> a) outputs | |
, effects = Signal.map (\(_,b,_) -> b) outputs | |
, views = Signal.map (\(_,_,f) -> f address) outputs | |
, actions = signal | |
} | |
type alias Output action state effect view = | |
{ states : Signal state | |
, effects : Signal (List effect) | |
, views : Signal view | |
, actions : Signal action | |
} | |
------------- | |
type Never = Never Never |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment