# jumpstreamer

> A live video editor for the web!

Latest version **1.0.5** (published 2017-04-08) · MIT license · 0 weekly downloads

## Install

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

## 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.5 |
| Published | 2017-04-08 |
| First published | 2017-04-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 7 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 142 |
| Author | Thomas Mullen |
| Maintainers | rationalcoding |

## Links

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

## Dependencies (7)

- [vex-js](https://npm.io/package/vex-js.md) ^3.1.1
- [debounce](https://npm.io/package/debounce.md) ^1.0.0
- [inherits](https://npm.io/package/inherits.md) ^2.0.3
- [interactjs](https://npm.io/package/interactjs.md) ^1.2.8
- [hyperscript](https://npm.io/package/hyperscript.md) ^2.0.2
- [getusermedia](https://npm.io/package/getusermedia.md) ^2.0.1
- [video-stream-merger](https://npm.io/package/video-stream-merger.md) ^2.0.5

## Recent versions

- 1.0.5 (latest) — 2017-04-08
- 1.0.4 — 2017-04-08
- 1.0.3 — 2017-04-08
- 1.0.2 — 2017-04-08

## README

# jumpstreamer

![Standard - JavaScript Style Guide](https://img.shields.io/badge/code%20style-standard-brightgreen.svg)

Live broadcasting and recording software for the web, inspired by [OBS](https://obsproject.com/).  

[Demo](https://rationalcoding.github.io/jumpstreamer/)

## install

```html
<script src="jumpstreamer.js"></script>
```

## usage

```html
<div></div>
<script>
  var jump = new JumpStreamer('div') // Element or selector to place the UI
  
  jump.on('stream', function (stream) {
    // stream is the MediaStream output
  })
  jump.on('stopstream', function () {
    // called when the stream stops
  })
</script>
```

## api

### `var jump = new JumpStreamer(element, [opts])`

`element` is a HTMLElement or CSS selector string. The display will attempt to fit inside this element.

Optional `opts` is a configuration object that will override the following defaults:

```
{
  output: {
    width: 1200,  // resolution of the output stream
    height: 900,
    fps: 40       // frames per second of the output stream
  },
  injectStyles: true, // whether to inject the JumpStreamer css
  inputs: [array of input devices - see below]
}
```

### adding input devices

There are several ways to get MediaStreams to use as input sources. To add your own, put an object inside the `opts.inputs` array that has the following format:

```
{
  name: 'Display Name of Device', // Can be anything, but it should be descriptive
  getStream: function (callback) {
    // This function should call "callback" with the following arguments
    callback(err, name, stream)  
      - "err" is any error thrown, null otherwise
      - "name" is the name of the source (usually the same as the device name)
      - "stream" is the input MediaStream
  }
}
```

For example, here is one of the default devices:

```
{
  name: 'Video Camera',
  getStream: function (callback) {
    getusermedia({audio:true, video:true}, function (err, stream) {
      callback(err, 'Video Camera', stream)
    })
  }
}
```

## notes
`jumpstreamer` does not **broadcast** your video, it simply gives you an output MediaStream to do with as you wish.

You could send it over a WebRTC connection, record it as a file, send to to a proxy RTMP server, pipe it through FFMPEG... whatever!

## todo
- [ ] Audio mixer
- [ ] Scene transitions
- [ ] More output options

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