Simple Elm FRP square demo

Main.elm

import Html exposing (div, text)
import Html.Attributes exposing (style)
import Html.Events exposing (onClick)
import StartApp as StartApp
import Signal as Signal
import Mouse as Mouse
import Effects as Effects

app = StartApp.start 
    { init = (init, Effects.none)
    , view = view
    , update = update 
    , inputs = [ (Signal.map MouseMove Mouse.position), (Signal.map MouseClick Mouse.isDown) ] 
    }

main = app.html


type SquareColor = White | Red | Blue | Green | Cyan
type alias SquareState = 
    { x: Int
    , y: Int
    , color: SquareColor
    }

init : SquareState
init = { x = 0, y = 0, color = White }

type Action = MouseMove (Int, Int) | MouseClick Bool

update action model = 
    case action of
        MouseClick isClicked -> 
            if isClicked then 
                let nextColor (currentColor) =
                    case currentColor of
                        White -> Red
                        Red   -> Blue
                        Blue  -> Green
                        Green -> Cyan
                        Cyan  -> White
                in
                    ({ model | color = (nextColor model.color) }, Effects.none)
            else (model, Effects.none)

        MouseMove (mx, my) -> 
            ({ model | x = mx, y = my }, Effects.none)


renderColor : SquareColor -> String
renderColor c =
    case c of
        White -> "white"
        Red   -> "red"
        Blue  -> "blue"
        Green -> "green"
        Cyan  -> "cyan"

view address model =
    let squareStyle = style [ ("background", (renderColor model.color))
                            , ("height", "50px")
                            , ("width", "50px")
                            , ("position", "absolute")
                            , ("top", (toString (model.y - 25) ++ "px") )
                            , ("left", (toString (model.x - 25) ++ "px"))
                            ]
    in
        div [ (style [ ("min-height", "1024px"), ("width", "100%"), ("background", "#000") ]) ] [
            div [ squareStyle ] [ (text " ") ]
        ]