├── .gitignore ├── README.md ├── elm-package.json ├── Clicks.elm ├── SampleMousePositionClick.elm ├── MousePosition.elm ├── KeyboardPresses.elm ├── KeyboardPressesFilterDigit.elm ├── WindowResize.elm └── KeyboardArrows.elm /.gitignore: -------------------------------------------------------------------------------- 1 | elm-stuff 2 | elm.js 3 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Elm Subscriptions 2 | 3 | A playground of basic examples of the migration of `Signals` to `subscriptions` in Elm 0.17. 4 | 5 | > [chrisbuttery.com](http://chrisbuttery.com)  ·  6 | > GitHub [@chrisbuttery](https://github.com/chrisbuttery)  ·  7 | > Twitter [@buttahz](https://twitter.com/buttahz)  ·  8 | > elm-lang slack [@butters](http://elmlang.herokuapp.com/) 9 | -------------------------------------------------------------------------------- /elm-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "version": "1.0.0", 3 | "summary": "Basic examples of the migration of `Signals` to `subscriptions` in Elm 0.17.", 4 | "repository": "https://github.com/chrisbuttery/elm-subscriptions.git", 5 | "license": "BSD3", 6 | "source-directories": [ 7 | "." 8 | ], 9 | "exposed-modules": [], 10 | "dependencies": { 11 | "elm-lang/core": "4.0.0 <= v < 5.0.0", 12 | "elm-lang/html": "1.0.0 <= v < 2.0.0", 13 | "elm-lang/keyboard": "1.0.0 <= v < 2.0.0", 14 | "elm-lang/mouse": "1.0.0 <= v < 2.0.0", 15 | "elm-lang/window": "1.0.0 <= v < 2.0.0" 16 | }, 17 | "elm-version": "0.17.0 <= v < 0.18.0" 18 | } 19 | -------------------------------------------------------------------------------- /Clicks.elm: -------------------------------------------------------------------------------- 1 | import Html exposing (Html, text, div) 2 | import Html.App as Html 3 | import Mouse exposing (..) 4 | 5 | main = 6 | Html.program 7 | { init = init 8 | , view = view 9 | , update = update 10 | , subscriptions = subscriptions 11 | } 12 | 13 | -- MODEL 14 | 15 | type alias Model = Float 16 | 17 | init : (Model, Cmd Msg) 18 | init = 19 | (0, Cmd.none) 20 | 21 | -- UPDATE 22 | 23 | type Msg 24 | = Click 25 | 26 | update msg model = 27 | case msg of 28 | Click -> 29 | (model + 1 , Cmd.none) 30 | 31 | -- SUBSCRIPTIONS 32 | 33 | subscriptions model = 34 | Mouse.clicks (\_ -> Click) 35 | 36 | -- VIEW 37 | 38 | view model = 39 | Html.text (toString model) 40 | -------------------------------------------------------------------------------- /SampleMousePositionClick.elm: -------------------------------------------------------------------------------- 1 | import Html exposing (Html, text, div) 2 | import Html.App as Html 3 | import Mouse exposing (..) 4 | 5 | main = 6 | Html.program 7 | { init = init 8 | , view = view 9 | , update = update 10 | , subscriptions = subscriptions 11 | } 12 | 13 | -- MODEL 14 | 15 | type alias Model = Mouse.Position 16 | 17 | init = 18 | ((Mouse.Position 0 0) , Cmd.none ) 19 | 20 | -- UPDATE 21 | 22 | type Msg 23 | = Click Mouse.Position 24 | 25 | update msg model = 26 | case msg of 27 | Click xy -> 28 | (xy, Cmd.none ) 29 | 30 | 31 | -- SUBSCRIPTIONS 32 | 33 | subscriptions model = 34 | Mouse.clicks Click 35 | 36 | -- VIEW 37 | 38 | view model = 39 | Html.text (toString model) 40 | -------------------------------------------------------------------------------- /MousePosition.elm: -------------------------------------------------------------------------------- 1 | import Html exposing (Html, text, div) 2 | import Html.App as Html 3 | import Mouse exposing (..) 4 | 5 | main = 6 | Html.program 7 | { init = init 8 | , view = view 9 | , update = update 10 | , subscriptions = subscriptions 11 | } 12 | 13 | -- MODEL 14 | 15 | type alias Model = { 16 | x: Int 17 | , y : Int 18 | } 19 | 20 | initialModel: Model 21 | initialModel = 22 | { x = 0 23 | , y = 0 24 | } 25 | 26 | init : (Model, Cmd Msg) 27 | init = 28 | (initialModel, Cmd.none) 29 | 30 | -- UPDATE 31 | 32 | type Msg 33 | = Position Int Int 34 | 35 | update: Msg -> Model -> (Model, Cmd a) 36 | update msg model = 37 | case msg of 38 | Position x y -> 39 | ({model | x = x, y = y} , Cmd.none) 40 | 41 | -- SUBSCRIPTIONS 42 | 43 | subscriptions: Model -> Sub Msg 44 | subscriptions model = 45 | Mouse.moves (\{x, y} -> Position x y) 46 | 47 | -- VIEW 48 | 49 | view: Model -> Html a 50 | view model = 51 | Html.text (toString model) 52 | -------------------------------------------------------------------------------- /KeyboardPresses.elm: -------------------------------------------------------------------------------- 1 | import Html exposing (Html, text, div) 2 | import Html.App as Html 3 | import Keyboard exposing (..) 4 | import Char exposing (..) 5 | 6 | main = 7 | Html.program 8 | { init = init 9 | , view = view 10 | , update = update 11 | , subscriptions = subscriptions 12 | } 13 | 14 | -- MODEL 15 | 16 | type alias Model = Char 17 | 18 | init : (Model, Cmd Msg) 19 | init = 20 | (' ', Cmd.none) 21 | 22 | -- UPDATE 23 | 24 | type Msg 25 | = Presses Int 26 | 27 | update: Msg -> Model -> (Model, Cmd Msg) 28 | update msg model = 29 | case msg of 30 | Presses code -> 31 | (fromCode code, Cmd.none) 32 | 33 | -- SUBSCRIPTIONS 34 | 35 | subscriptions: Model -> Sub Msg 36 | subscriptions model = 37 | Keyboard.presses (\code -> Presses code) 38 | 39 | -- VIEW 40 | 41 | view: Model -> Html Msg 42 | view model = 43 | let 44 | str = 45 | if model == ' ' 46 | then "Press a key" 47 | else "You pressed: " ++ (toString model) 48 | in 49 | Html.text str 50 | -------------------------------------------------------------------------------- /KeyboardPressesFilterDigit.elm: -------------------------------------------------------------------------------- 1 | import Html exposing (Html, text, div) 2 | import Html.App as Html 3 | import Keyboard exposing (..) 4 | import Char exposing (..) 5 | 6 | main = 7 | Html.program 8 | { init = init 9 | , view = view 10 | , update = update 11 | , subscriptions = subscriptions 12 | } 13 | 14 | -- MODEL 15 | 16 | type alias Model = Char 17 | 18 | init : (Model, Cmd Msg) 19 | init = 20 | (' ', Cmd.none) 21 | 22 | -- UPDATE 23 | 24 | type Msg 25 | = Presses Char 26 | 27 | update: Msg -> Model -> (Model, Cmd Msg) 28 | update msg model = 29 | case msg of 30 | Presses code -> 31 | if Char.isDigit code == True 32 | then 33 | (code, Cmd.none) 34 | else 35 | (model, Cmd.none) 36 | 37 | -- SUBSCRIPTIONS 38 | 39 | subscriptions: Model -> Sub Msg 40 | subscriptions model = 41 | Keyboard.presses (\code -> Presses (fromCode code)) 42 | 43 | -- VIEW 44 | 45 | view: Model -> Html Msg 46 | view model = 47 | let 48 | str = 49 | if model == ' ' 50 | then "Press a key" 51 | else "You pressed: " ++ (toString model) 52 | in 53 | Html.text str 54 | -------------------------------------------------------------------------------- /WindowResize.elm: -------------------------------------------------------------------------------- 1 | import Html exposing (Html, text, div) 2 | import Html.App as Html 3 | import Window exposing (..) 4 | 5 | main = 6 | Html.program 7 | { init = init 8 | , view = view 9 | , update = update 10 | , subscriptions = subscriptions 11 | } 12 | 13 | -- MODEL 14 | 15 | type alias Model = { 16 | height: Int 17 | , width : Int 18 | } 19 | 20 | initialModel: Model 21 | initialModel = 22 | { height = 0 23 | , width = 0 24 | } 25 | 26 | init : (Model, Cmd Msg) 27 | init = 28 | (initialModel, Cmd.none) 29 | 30 | -- UPDATE 31 | 32 | type Msg 33 | = Resize Int Int 34 | 35 | update: Msg -> Model -> (Model, Cmd Msg) 36 | update msg model = 37 | case msg of 38 | Resize h w -> 39 | ({model | height = h, width = w} , Cmd.none) 40 | 41 | -- SUBSCRIPTIONS 42 | 43 | subscriptions: Model -> Sub Msg 44 | subscriptions model = 45 | Window.resizes (\{height, width} -> Resize height width) 46 | 47 | -- VIEW 48 | 49 | view: Model -> Html Msg 50 | view model = 51 | let 52 | str = 53 | if model.height == 0 && model.width == 0 then 54 | "Resize the window" 55 | else 56 | toString model 57 | in 58 | Html.text str 59 | -------------------------------------------------------------------------------- /KeyboardArrows.elm: -------------------------------------------------------------------------------- 1 | import Html exposing (Html, text, div) 2 | import Html.App as Html 3 | import Keyboard exposing (KeyCode) 4 | import Char exposing (..) 5 | 6 | main = 7 | Html.program 8 | { init = init 9 | , view = view 10 | , update = update 11 | , subscriptions = subscriptions 12 | } 13 | 14 | -- MODEL 15 | 16 | type alias Model = 17 | { x: Int 18 | , y: Int 19 | , start: Bool 20 | } 21 | 22 | model = 23 | { x = 0 24 | , y = 0 25 | , start = False 26 | } 27 | 28 | init : (Model, Cmd Msg) 29 | init = 30 | (model, Cmd.none) 31 | 32 | -- UPDATE 33 | 34 | type Msg 35 | = KeyDown Keyboard.KeyCode 36 | 37 | update: Msg -> Model -> (Model, Cmd Msg) 38 | update msg model = 39 | case msg of 40 | KeyDown keyCode -> 41 | if model.start == False then 42 | ({model | start = True }, Cmd.none) 43 | else if keyCode == 37 then 44 | ({model | x = model.x - 1 }, Cmd.none) 45 | else if keyCode == 39 then 46 | ({model | x = model.x + 1 }, Cmd.none) 47 | else if keyCode == 38 then 48 | ({model | y = model.y + 1 }, Cmd.none) 49 | else if keyCode == 40 then 50 | ({model | y = model.y - 1 }, Cmd.none) 51 | else 52 | (model, Cmd.none) 53 | 54 | type Key 55 | = Space 56 | | ArrowUp 57 | | ArrowDown 58 | | ArrowLeft 59 | | ArrowRight 60 | | Unknown 61 | 62 | 63 | fromCode : Int -> Key 64 | fromCode keyCode = 65 | case keyCode of 66 | 32 -> 67 | Space 68 | 69 | 38 -> 70 | ArrowUp 71 | 72 | 40 -> 73 | ArrowDown 74 | 75 | 37 -> 76 | ArrowLeft 77 | 78 | 39 -> 79 | ArrowRight 80 | 81 | _ -> 82 | Unknown 83 | 84 | -- SUBSCRIPTIONS 85 | 86 | subscriptions: Model -> Sub Msg 87 | subscriptions model = 88 | Keyboard.downs KeyDown 89 | 90 | -- VIEW 91 | 92 | view: Model -> Html Msg 93 | view model = 94 | let 95 | str = 96 | if model.start == False 97 | then "Press arrow buttons" 98 | else "{x: " ++ toString (model.x) ++ ", y: " ++ toString (model.y) ++ "}" 99 | in 100 | Html.text str 101 | --------------------------------------------------------------------------------