This is an alternative site for discovering Elm packages. You may be looking for the official Elm package site instead.
A clock/timer/countdown
version 1.0.0
license BSD3
native-modules False
elm-version 0.16.0 <= v < 0.17.0
Tag 1.0.0
Committed At 2016-04-22 18:40:22 UTC
elm-lang/core 3.0.0 <= v < 4.0.0 3.0.0



Elm Timer

A simple digital clock that can either count to a future date or go backwards (countdown).

Getting started

No dependencies are required. Just grab the package and you're good to go.

elm package install simonewebdesign/elm-timer

A couple examples are provided: simple and startapp. The former doesn't use StartApp; the latter does.

You can either have a look at the examples or read below to get started.

Wire it up with StartApp

First of all, import the module:

import Timer

Then add it to your model:

type alias Model =
  { timer : Timer.Model }

Provide an initial value for it:

initialModel =
  { timer = Timer.init }

Define an action:

type Action
  = NoOp
  | TimerAction Timer.Action

Update your update:

update action model =
  case action of
    NoOp ->
      ( model, Effects.none )

    TimerAction subAction ->
      ( { model | timer = Timer.update subAction model.timer }
      , Effects.none


Add it to your view:

view address model =
  text (Timer.view model.timer)

And feed it to StartApp:

app =
    { init = ( initialModel, Effects.none )
    , update = update
    , view = view
    , inputs = [ TimerAction Timer.tick ]

If everything's wired up correctly, you should be able to see a timer in your app.

A backwards clock (aka countdown)

If you want to reverse the clock, just use Timer.countdown instead of Timer.tick. For example if you're using StartApp your configuration will look like:

app =
    { inputs = [ TimerAction Timer.countdown ]
    , ...


There are a couple of things that are being used internally, but I figured they might be useful.


The clock function is a Signal Int that receives a new value every second.


Another function that just adds a leading zero to a number only if it's just a single digit. The signature is addLeadingZero : number -> String.