Created
August 10, 2017 16:24
-
-
Save anonymous/b3b3961cbd9c8cfdc87592adb5bc08a8 to your computer and use it in GitHub Desktop.
Untitled
This file contains 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
| { | |
| "version": "1.0.0", | |
| "summary": "Tell the world about your project!", | |
| "repository": "https://github.com/user/project.git", | |
| "license": "BSD3", | |
| "source-directories": [ | |
| "." | |
| ], | |
| "exposed-modules": [], | |
| "dependencies": { | |
| "elm-lang/core": "5.1.1 <= v < 5.1.1", | |
| "elm-lang/html": "2.0.0 <= v < 2.0.0" | |
| }, | |
| "elm-version": "0.18.0 <= v < 0.19.0" | |
| } |
This file contains 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
| <html> | |
| <head> | |
| <style> | |
| html { | |
| background: #F7F7F7; | |
| color: red; | |
| } | |
| .active { | |
| color: green; | |
| } | |
| .wrapper .default { | |
| display: block; | |
| } | |
| .wrapper-active .active { | |
| display: block; | |
| } | |
| .wrapper .active { | |
| display: none; | |
| } | |
| .wrapper-active .default { | |
| display: none; | |
| } | |
| .wrapper-active .active { | |
| display: block; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <script> | |
| var app = Elm.Main.fullscreen() | |
| </script> | |
| </body> | |
| </html> |
This file contains 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
| module Main exposing (..) | |
| import Html.Attributes exposing (..) | |
| import Html.Events exposing (..) | |
| import Html exposing (..) | |
| import Json.Decode as Decode | |
| import Time exposing (Time) | |
| -- CONFIG | |
| activeTime : Time | |
| activeTime = | |
| 1 * Time.second | |
| -- MODEL | |
| type alias Model = | |
| { active : Maybe Time | |
| } | |
| init : ( Model, Cmd Msg ) | |
| init = | |
| ( { active = Nothing }, Cmd.none ) | |
| -- VIEW | |
| view : Model -> Html Msg | |
| view model = | |
| div | |
| [ on "mousemove" (Decode.succeed ResetCounter) | |
| , class "wrapper" | |
| , classList [ ( "wrapper-active", model.active /= Nothing ) ] | |
| ] | |
| [ div [ class "default" ] [ text "Default" ] | |
| , div [ class "active" ] [ text "Active" ] | |
| ] | |
| -- UPDATE | |
| type Msg | |
| = UpdateCounter Time | |
| | ResetCounter | |
| update : Msg -> Model -> Model | |
| update action model = | |
| case action of | |
| UpdateCounter time -> | |
| case model.active of | |
| Nothing -> | |
| { model | active = Just time } | |
| Just 0 -> | |
| { model | active = Just time } | |
| Just lastMove -> | |
| if time - lastMove > activeTime then | |
| { model | active = Nothing } | |
| else | |
| model | |
| ResetCounter -> | |
| { model | active = Just 0 } | |
| -- SUBSCRIPTION | |
| subscriptions : Model -> Sub Msg | |
| subscriptions model = | |
| case model.active of | |
| Nothing -> | |
| Sub.none | |
| Just _ -> | |
| (Time.every (50 * Time.millisecond) UpdateCounter) | |
| -- WIRING | |
| main = | |
| program | |
| { init = init | |
| , subscriptions = subscriptions | |
| , update = | |
| -- the update doesn't need Cmds and we can use the simple update form | |
| \msg model -> ( update msg model, Cmd.none ) | |
| , view = view | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment