Think of Streamwall as a specialized web browser for mosaicing video streams. It uses Electron to create a grid of web browser views, loading the specified webpages into them. Once the page loads, Streamwall finds the <video> tag and reformats the page so that the video fills the space. This works for a wide variety of web pages without specialized scrapers.

Installation

Download and install the latest release for your system from the Releases page.

Running Streamwall

Tip

Default username: admin

Default password: password

Start the app by running the installed executable. When your browser opens, log into the control panel.
Use the browser window to load or control streams.
If you enter the same stream code in multiple cells, it will merge them together for a larger stream.

Configuration

Streamwall has a number of configuration options. See example.config.toml for an example.

Option	Description	Default	Example	Accepted Values
`cert.dir`	The directory to store SSL certificates for HTTPS	Not set	`"./certs"`	Any valid directory path
`cert.email`	The email address for the SSL certificate owner	Not set	`"admin@example.com"`	Any valid email address
`cert.production`	Whether to obtain a real SSL certificate (true) or use a test one (false)	`false`	`true`	`true` or `false`
`control.address`	The full URL where the control panel will be accessible	`"http://localhost:80"`	`"https://myapp.com"`	Any valid URL
`control.hostname`	Override the hostname for the control panel (use with `control.port`)	Not set	`"localhost"`	Any valid hostname
`control.open`	Automatically open the control website in a browser after launching	`true`	`false`	`true` or `false`
`control.password`	The password required to access the control panel	Not set	`"securepass123"`	Any string
`control.port`	Override the port for the control panel (use with `control.hostname`)	Not set	`8080`	Any valid port number
`control.username`	The username required to access the control panel	Not set	`"admin"`	Any string
`data.interval`	The interval in seconds to refresh polled data sources	`30`	`60`	Any positive integer
`data.json-url`	A list of JSON API URLs to load stream sources from	`[]`	`["https://api.example.com/streams"]`	Any list of valid URLs
`data.toml-file`	A list of local TOML files to load stream sources from	`[]`	`["./streams.toml"]`	Any list of valid file paths
`grid.count`	The number of grid cells to display in the window	`3`	`4`	Any positive integer
`streamdelay.endpoint`	The URL of the Streamdelay service endpoint	`"http://localhost:8404"`	`"https://delay.myapp.com"`	Any valid URL
`streamdelay.key`	The API key for authenticating with the Streamdelay service	Not set	`"abc123xyz789"`	Any string
`telemetry.sentry`	Enable or disable error reporting to Sentry	`true`	`false`	`true` or `false`
`twitch.announce.delay`	Time to wait (in seconds) before announcing stream details	`30`	`15`	Any positive integer
`twitch.announce.interval`	Minimum time (in seconds) between re-announcing the same stream	`60`	`120`	Any positive integer
`twitch.announce.template`	The message template for stream announcements in chat	See code	`"Now streaming: <%- stream.title %>"`	Any valid template string
`twitch.channel`	The Twitch channel to connect to for chat interactions	Not set	`"mychannel"`	Any valid Twitch channel name
`twitch.color`	The color of the Twitch bot's username in chat	`"#ff0000"`	`"#00ff00"`	Any valid CSS color value
`twitch.password`	The OAuth token for the Twitch bot account	Not set	`"oauth:abc123..."`	Valid Twitch OAuth token
`twitch.username`	The Twitch username for the bot account	Not set	`"mybot"`	Any valid Twitch username
`twitch.vote.interval`	Time interval (in seconds) between votes (0 to disable voting)	`0`	`300`	Any non-negative integer
`twitch.vote.template`	The message template for vote result announcements	See code	`"Stream <%- selectedIdx %> won with <%- voteCount %> votes!"`	Any valid template string
`window.active-color`	The highlight color for active elements in the window	`"#fff"`	`"#ff0000"`	Any valid CSS color value
`window.background-color`	The background color of the window, useful for chroma-keying	`"#000"`	`"#00ff00"`	Any valid CSS color value
`window.frameless`	Creates a window without borders or title bar if set to true	`false`	`true`	`true` or `false`
`window.height`	The height of the application window in pixels	`1080`	`720`	Any positive integer
`window.width`	The width of the application window in pixels	`1920`	`1280`	Any positive integer
`window.x`	The x-coordinate of the window position on the screen	Not set	`100`	Any integer
`window.y`	The y-coordinate of the window position on the screen	Not set	`50`	Any integer

Data sources

Streamwall can load stream data from both JSON APIs and TOML files. Data sources can be specified in a config file (see example.config.toml for an example) or the command line:

TODO: Document how to use the command line to specify data sources. TODO: Document how to use the config file to specify data sources.

Twitch bot

Streamwall can announce the name and URL of streams to your Twitch channel as you focus their audio. Use twitchtokengenerator.com to generate an OAuth token. See example.config.toml for all available options.

Hotkeys

The following hotkeys are available with the "control" webpage focused:

alt+[1...9]: Listen to the numbered stream
alt+shift+[1...9]: Toggle blur on the numbered stream
alt+s: Select the currently focused stream box to be swapped
alt+c: Activate Streamdelay censor mode
alt+shift+c: Deactivate Streamdelay censor mode

Troubleshooting

The Streamwall window only fits 2.5 tiles wide

Streamwall in its default settings needs enough screen space to display a 1920x1080 (1080p) window, with room for the titlebar. You can configure Streamwall to open a smaller window:

TODO: Document how to configure the window size.

Development

Getting started

Clone the repository
Install dependencies with npm install
Run the app with npm start

Building

Run npm run build to build the app for your current platform
The built app will be in the dist directory

Testing

Run npm test to run the test suite
Please also manually test the app after making changes

Contributing

Fork the repository
Create a new branch
Make your changes
Run the test suite
Create a pull request

Versioning

Streamwall uses Semantic Versioning.

To release a new version:

Update the version number in package.json
Run npm run publish to create new distributables
Create a new release on GitHub with the new version number

Credits

Contributors

@chromakode - Original author & primary maintainer
@sayhiben - Current maintainer

Libraries & Resources

SVG Icons are from Font Awesome by Dave Gandy - http://fontawesome.io