Radial countdown timer for Angular
npm install angular-countdownRadial countdown component for Angular built with SVG.
!angular-countdown example with terrible frame rate
``sh`npm
npm install angular-countdownbower
bower install angular-countdown
angular-countdown provides two interfaces designed to be used together:
1. A CountdownTimer service which you'll typically inject into your controllers to create new timers
2. A directive which consumes the CountdownTimer instances you'll create
##### new CountdownTimer(length [, options])
Creates a new countdown timer with the given length (milliseconds). options may include:
tickInterval: a Number that specifies how often to update the radial countdown in milliseconds. Defaults to 15.
A CountdownTimer is an EventEmitter.
##### timer.start() -> timer
Starts the timer. At each interval (as defined by options.tickInterval), the timer will emit a 'tick' event with one argument: the proportion of the tick to the length. So if you start a timer for 1.5 seconds, ticking every 15ms, each tick is 15/1500 or 1/100.
When the length has passed, the timer will emit a 'done' event.
##### timer.cancel() -> timer
Cancels the timer and cleans up the $interval backing it. Emits a 'done' event.
`html`
The directive accepts three parameters: the timer to bind to, the radius of the timer circle, and the width of the stroke. It builds the SVG needed to create the radial timer effect.
For an example, run npm run example`.
Inspired by svgPieTimer.js