AngularJS wrapper for SimpleWebRTC client from https://simplewebrtc.com/
AngularJS client for starting video / broadcasting to multiple peers via WebRTC, built on top of the SimpleWebRTC code.
This example wraps the calls to the WebRTC library into 2 simple Angular directives: a broadcaster and a room watcher. A single broadcasted stream can be viewed by multiple watchers in a single room.
To run the demo locally, clone the repo or install from NPM, then
Open the broadcast page
localhost:3400/broadcast.html and create a room. Open
in a separate browser tab and enter the same room name. You should see the broadcasted picture.
npm install ng-simple-webrtc --save
Include the script tags, at least Angular and SimpleWebRTC before this module
SimpleWebRTC to the list of your application's module dependencies
angular// adds custom directive <watch-room>
broadcaster to connect to the local camera and broadcast the picture.
Communicate the room name, and see the status properties (
isolate scope's properties.
You can control camera mirror display by setting "true" or "false" value of the
To connect to the camera and start a room, broadcast events
Prepare to broadcastStart room
See file broadcast.html for the full demo
When local video starts, the directive broadcasts 'video-resolution' event with width and height of the captured video stream.
To join and watch a room (without broadcasting anything yourself) use
You can pass the room name and see the status via isolate scope attributes
maxAllowedWatchers property controls how many people can be in the room when joining,
default 10. If more than that, the watcher will leave the room, emitting a message
nick is an optional property sent to the remote group on disconnect.
You can start watching (join a room) and stop watching (leave a room) by broadcasting an event
Join roomLeave room
See the included file watch.html as an example
You can supply an array to hold all videos and handle the layout by your self instead of appended by the library.
You must provide an empty array to initialize it and pass it to the
video-list attribute to
watch-room directives (or both).
webrtc object created by the
SimpleWebRTC library is attached to the
To broadcast a message to all peers in the room via RTC data channel, use
Each peer will receive the message via 'channelMessage' event. The event will have 2 arguments:
message is automatically JSON stringified and parsed when sent.
If the page has global variable
ngSimpleWebRTC, certain options will be added to the simple webrtc options during creation. ngSimpleWebRTC.peerConnectionConfig is Useful for paid ICE/STUN/TURN services,
see for example xirsys.com documentation. You may also set
socketio configuration this way.
Author: Gleb Bahmutov © 2015
License: MIT - do anything with the code, but don't blame me if it does not work.
Spread the word: tweet, star on github, etc.
Support: if you find any problems with this module, email / tweet / open issue on Github
Copyright (c) 2015 Gleb Bahmutov
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.