# ticker-js

> Event-emitting time keeper for browser friendly render cycles

Latest version **1.0.3** (published 2018-03-27) · MIT license · 0 weekly downloads

## Install

```sh
npm install ticker-js
pnpm add ticker-js
yarn add ticker-js
bun add ticker-js
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.3 |
| Published | 2018-03-27 |
| First published | 2017-12-06 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >=0.10.3 |
| Dependencies | 2 |
| Unpacked size | 16.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Tyler Peterson |
| Maintainers | tylerjpeterson |

## Links

- npm: https://www.npmjs.com/package/ticker-js
- Repository: https://github.com/tylerjpeterson/ticker-js
- Issues: https://github.com/tylerjpeterson/ticker-js/issues
- npm.io page: https://npm.io/package/ticker-js

## Dependencies (2)

- [events](https://npm.io/package/events.md) ^1.1.0
- [inherits](https://npm.io/package/inherits.md) ^2.0.1

## Recent versions

- 1.0.3 (latest) — 2018-03-27
- 1.0.2 — 2018-01-04
- 1.0.1 — 2017-12-06
- 1.0.0 — 2017-12-06

## README

![100% test coverage](https://img.shields.io/badge/coverage-100%25-brightgreen.svg)

# ticker-js
> Event-emitting time keeper for browser friendly render cycles

Browser-based module that fires events at a given interval to facilitate interactions on a timeline.
Tries to help facilitate measure/render grouping by firing two separate events at different moments in the process tick.

- The `update` event is when any measurement or calculations should occur.
- The `render` event is when the results of any measurements are applied to the DOM.


## Installation
Install via npm:

```sh
$ npm i ticker-js --save
```


## API
All properties should be accessed via the getter and setter methods.

| method      | params         | description                                           |
|-------------|----------------|-------------------------------------------------------|
| `start`     |                | Starts the instance, firing its events                |
| `stop`      |                | Stops the instance, stopping events from firing       |
| `setFps`    | `number: fps`  | Throttles the ticker to the passed value              |
| `getFps`    |                | Returns the current fps setting as a number or null   |
| `isTicking` |                | Returns boolean indicating if the instance is running |
| `destroy`   |                | Destroys the instance, removing all listeners         |


## Events
All events pass the same event object defined below.

| event    | description                                                |
|----------|------------------------------------------------------------|
| `update` | DOM measurements and calculations should occur when fired. |
| `render` | DOM modification should occur when fired.                  |


## Event object
The two events pass listeners an event object as defined below.

| type               | name           | description                                    |
|--------------------|----------------|------------------------------------------------|
| @property {object} | `data`         | event data object                              |
| @property {number} | `data.fps`     | frames per second                              |
| @property {number} | `data.trueFps` | un-throttled frames per second                 |
| @property {number} | `data.runtime` | the total duration of the ticker while ticking |
| @property {number} | `data.delta`   | time since last render                         |
| @property {number} | `data.time`    | current lifespan of render cycle               |
| @property {number} | `data.now`     | current time                                   |


## Usage
Instantiate and attach any listeners.

```js
var Ticker = require('ticker-js');
var ticker = new Ticker(30);

ticker.on('update', function (evt) {
  // measure
});

ticker.on('render', function (evt) {
  // render
});
```

Instances do not auto-run.
You must call the `start` method for the events to begin firing.

```js
ticker.start();
```

Once running, the update and render events will begin firing at the ticker's `fps` interval.
If `fps` is unset, the ticker is not throttled, and will `tick` as close to 60 fps as possible.

---
_Source: https://npm.io/package/ticker-js · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._