# eventbeat

> Declarative subscription layer for managing global event handlers and custom data streams.

Latest version **0.0.1** (published 2018-06-13) · MIT license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install eventbeat
pnpm add eventbeat
yarn add eventbeat
bun add eventbeat
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 0.0.1 |
| Published | 2018-06-13 |
| First published | 2018-06-11 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 14.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Jorge Bucaran |
| Maintainers | jorgebucaran |
| Keywords | eventbeat, declarative, events, subscriptions |

## Links

- npm: https://www.npmjs.com/package/eventbeat
- Repository: https://github.com/jorgebucaran/eventbeat
- Homepage: https://github.com/jorgebucaran/eventbeat#readme
- Issues: https://github.com/jorgebucaran/eventbeat/issues
- npm.io page: https://npm.io/package/eventbeat

## Alternatives

- [async-exit-hook](https://npm.io/package/async-exit-hook.md) — 3.7M weekly downloads
- [evnty](https://npm.io/package/evnty.md) — 7.2K weekly downloads
- [eleventy-plugin-asciidoc](https://npm.io/package/eleventy-plugin-asciidoc.md) — 3.5K weekly downloads
- [@jswork/next-get2get](https://npm.io/package/@jswork/next-get2get.md) — 945 weekly downloads
- [@dashersw/axon](https://npm.io/package/@dashersw/axon.md) — 934 weekly downloads

## Recent versions

- 0.0.1 (latest) — 2018-06-13
- 0.0.0 — 2018-06-11

## README

# EventBeat

[![Travis CI](https://img.shields.io/travis/jorgebucaran/eventbeat/master.svg)](https://travis-ci.org/jorgebucaran/eventbeat)
[![Codecov](https://img.shields.io/codecov/c/github/jorgebucaran/eventbeat/master.svg)](https://codecov.io/gh/jorgebucaran/eventbeat)
[![npm](https://img.shields.io/npm/v/eventbeat.svg)](https://www.npmjs.org/package/eventbeat)

EventBeat is a declarative subscription layer for managing [global event handlers](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers) such as mouse/keyboard events and custom data streams like time interval events, geolocation changes, WebSocket messages, etc.

<!-- This project contains only the runtime to process subscriptions according to the EventBeat standard. -->

## Getting Started

Here is a minimal example to get you started. Go ahead and [try it online](https://codepen.io/jorgebucaran/pen/ERmgbv?editors=1011).

```jsx
import { applyToAction } from "eventbeat"

const listen = applyToAction(console.log)

listen([
  {
    type: "mousemove",
    action: event => `${event.x} ${event.y}`
  },
  {
    type: "keydown",
    action: event => `${event.key}:${event.keyCode}`
  }
])
```

We want to be notified when something happens in the outside world, e.g., mouse movements, keyboard presses, clock ticks, browser repaints, and so on.

Subscriptions allow us to listen for such things. A subscription is a plain JavaScript object that identifies the event [type](https://developer.mozilla.org/en-US/docs/Web/Events) you want to listen to and an action to call with the [event](https://developer.mozilla.org/en-US/docs/Web/API/Event). See [Creating Custom Subscriptions](#creating-custom-subscriptions) for advanced usage.

To listen to or cancel subscriptions you need a `listen` function which you can get through `applyToAction(handler)`. EventBeat will invoke the `handler` with the result of every delivered action. Actions turn events into data and `handler` encapsulates side effects like drawing on the screen or relaying messages to a [Redux](https://redux.js.org/api-reference/store#dispatch-action) store, etc.

In the previous example we logged every message to the console. Next we'll use a custom handler function to draw some gradients. [Try it online](https://codepen.io/jorgebucaran/pen/LrLWZy?editors=0010).

```jsx
import { applyToAction } from "eventbeat"

const render = state => {
  document.body.style.background = `
    transparent
    radial-gradient(
      at calc(${state.x} * 100%) calc(${state.y} * 100%),
      cyan,
      blue
    ) no-repeat fixed center
  `
}

const listen = applyToAction(render)

listen([
  {
    type: "mousemove",
    action: event => ({
      x: event.clientX / event.view.innerWidth,
      y: event.clientY / event.view.innerHeight
    })
  }
])
```

<!-- For convenience, you can wrap subscriptions in a function that returns a plain object.

```jsx
const mousemove = action => ({ type: "mousemove", action })
const keydowns = action => ({ type: "keydown", action })
```

Every time you call `listen`, we compare each subscription with the previous one at the same position in the array and decide whether to subscribe, update or cancel the subscription. -->

## Installation

Install with npm or Yarn.

<pre>
npm i <a href=https://www.npmjs.com/package/eventbeat>eventbeat</a>
</pre>

Then with a module bundler like [Rollup](https://rollupjs.org) or [Webpack](https://webpack.js.org), use as you would anything else.

```js
import { applyToAction } from "eventbeat"
```

Don't want to set up a build environment? Download EventBeat from a CDN like [unpkg.com](https://unpkg.com/eventbeat) and it will be globally available through the `window.eventbeat` object. All ES5-compliant browsers, including IE 9 and up are supported.

```html
<script src="https://unpkg.com/eventbeat"></script>
```

## Overview

### Creating Custom Subscriptions

## Links

- [Examples](https://codepen.io/search/pens?q=eventbeat&page=1&order=popularity&depth=everything&show_forks=false)

## License

EventBeat is MIT licensed. See [LICENSE](LICENSE.md).

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