Coder Social home page Coder Social logo

andrewmacmurray / elm-delay Goto Github PK

View Code? Open in Web Editor NEW
28.0 2.0 4.0 1.36 MB

Utilities to delay updates after a set period of time

Home Page: http://package.elm-lang.org/packages/andrewMacmurray/elm-delay/latest

License: BSD 3-Clause "New" or "Revised" License

Elm 69.29% JavaScript 30.71%
elm sequence delay settimeout

elm-delay's Introduction

Elm Delay

Elm utilities to trigger updates after a delay

example: https://elm-delay-examples.surge.sh/

Why?

Sometimes you need to trigger updates after a period of time (i.e. to wait for a css transition or animation to complete) or maybe you need to chain a sequence of these updates (for more complex states).

This library provides utilities to express this more tidily.

How?

Send a single delayed Msg

To trigger a single update after a period of time pass Delay.after as a command to the elm runtime:

FirstMessage ->
    ( model
    , Delay.after 500 SecondMessage
    )

After triggering FirstMessage, 500ms later update will be called with SecondMessage

Send a sequence of delayed Msgs

Trigger ->
    ( model
    , Delay.sequence
        [ ( 1000, FirstMessage )
        , ( 2000, SecondMessage )
        , ( 1000, ThirdMessage )
        ]
    )

by sending a Trigger Msg:

  • after 1000ms update will be called with FirstMessage
  • then after 2000ms update will be called with SecondMessage
  • then after 1000ms update will be called with ThirdMessage

As a convenience if you'd only like to start a sequence if the model is in a particular shape you can use Delay.sequenceIf

Trigger ->
    ( model
    , Delay.sequenceIf (not model.updating)
        [ ( 1000, FirstMessage )
        , ( 2000, SecondMessage )
        , ( 1000, ThirdMessage )
        ]
    )

If you'd like all the steps to have the same unit of time, use the Delay.withUnit helper

Trigger ->
    ( model
    , Delay.sequence 
        Delay.withUnit Delay.seconds
            [ ( 1, FirstMessage )
            , ( 2, SecondMessage )
            , ( 1, ThirdMessage )
            ]
    )

elm-delay's People

Contributors

andrewmacmurray avatar lenards avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

elm-delay's Issues

Different tool for integration tests

Currently using QUnit to do integration tests, could be nice to use cypress instead so failures could be tracked more easily in PRs / prevent merges if tests fail

Default unit

Curious if anyone is using a mixture of TimeUnits? Was thinking about changing the api to have a default unit of milliseconds so it's a little cleaner:

Delay.after 500 SomethingTriggered
Delay.sequence
    [ ( 100, MsgOne )
    , ( 200, MsgTwo )
    , ( 100, MsgThree )
    ]

And maybe add some helpers to convert millis to other time units:

Delay.after (Delay.seconds 5) SomethingTriggered
seconds : Millis -> Millis
seconds millis =
    1000 * millis

@lenards given you've been using this recently do you have any thoughts?

Use elm-units for durations

Hi, one suggestion I have is to use elm-units instead or having your own API for dealing with durations. Then you can just have after : Duration -> msg -> Cmd msg, sequence : List ( Duration, msg ) -> Cmd msg, and sequenceIf : Bool -> List ( Duration, msg ) -> Cmd msg and anyone familiar with elm-units won't need to relearn how to specify what time units they want or do extra conversions if they are already using elm-units for other stuff.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.