Make your own video room to watch videos remotely with all your friends
Here's is a demo : https://groupwat.ch/examples/advanced.html
- Play videos in sync with people from anywhere on the globe
- Video call, voice call, chat room
- Support .srt and .vtt subtitles, can be added from your local disk
- Play your local video files [No downloding or streaming]
- Video.js video player, highly customizable and open-source
- Uses WebSocket server not WebRTC, hence easy to deploy without HTTPS
- Handy to use as a standalone in your web-browser
Note : current version on Groupwat.ch supports two peers (people) only, we are adding multiple peer support very soon
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/simple-line-icons/2.4.1/css/simple-line-icons.css">
<link href="https://unpkg.com/[email protected]/dist/video-js.css" rel="stylesheet">
<link rel="stylesheet" href="https://unpkg.com/groupwat.ch/dist/css/styles.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/video.js"></script>
<script src="https://unpkg.com/groupwat.ch"></script>
Replace YOUR_CHANNEL_ID and YOUR_ROOM_ID with your own unique identifiers.
Read WebSocket.in docs to get help with choosing YOUR_CHANNEL_ID and YOUR_ROOM_id.
<div id="video_container"></div>
<script type="text/javascript">
var config = {
socket_server:'wss://connect.websocket.in/YOUR_CHANNEL_ID?room_id=YOUR_ROOM_ID',
container : 'video_container',
src : 'https://vjs.zencdn.net/v/oceans.mp4',
socket_server : "wss://YOUR_SOCKET_SERVER",
videoCall:true
}
var mGWatch = new GWatch(config);
</script>
This example code usage free WebSocket server from WebSocket.in for WebRTC signaling, you may use your own WebSocket server if you wish to.
Codepen : https://codepen.io/hack4mer/full/dgVJpN
Following are configuration options available for the GWatch API
Note: This doc table might be outdated, see GWatch.js source for updated configurations and Event.js for all supported events.
| Option | Description | Value |
|---|---|---|
| container | ID of the div in which the GWatch UI should load | required |
| socket_server | Complete URL of the socket server | required |
| src | URL of the video file to play | required, if localSource != true |
| localSource | Show a local-disk video file selector | Default: false |
| videoCall | Enable video, voice & chat features | Default: false |
| disableVideo | When true: Disables video & voice features, allows chat only | Default: false |
| disableChat | When true: Disables the chat feature, allows video & voice only | Default: false |
| devmode | Devevelopment mode, informative console logs are disabled is set to false | Default: false |
| onSocketConnected | Function to be fired when socket connection is succesful | function(){ console.log("socket connected"); |
| onSocketError | Function to be fired when socket connection fails | function(){ console.error("socket connection failed");} |
MIT