Skip to content

Instantly share code, notes, and snippets.

@farao

farao/palava-example.html

Forked from payload/palava-example.html
Last active January 3, 2016 01:59
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save farao/8392186 to your computer and use it in GitHub Desktop.
Save farao/8392186 to your computer and use it in GitHub Desktop.
Download ZIP
Simple web conference using the palava client library. For trying out on localhost use e.g.: "python -m SimpleHTTPServer" in the directory with the html file since just opening it in the browser prevents the browser from asking for the camera.
Raw
palava-example.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>My first video application</title>
<script src="https://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="https://rawgithub.com/Wolfy87/EventEmitter/master/EventEmitter.min.js"></script>
<script src="https://rawgithub.com/palavatv/palava-client/master/palava.min.js"></script>
<script type="text/coffeescript">
$('#page_two').hide()
window.join_room = (room) ->
$('#page_one').hide()
url = 'https://palava.tv/' + room
$('#link').html("<a href='#{url}'>#{url}</a>")
$('#page_two').show()
session = new palava.Session
roomId: room
channel: new palava.WebSocketChannel('wss://machine.palava.tv')
session.on 'local_stream_ready', (stream) ->
palava.browser.attachMediaStream($('#myvideo'), stream)
session.room.join()
session.on 'peer_stream_ready', (peer) ->
if peer.isLocal()
return
if $('#' + peer.id).length > 0
element = $('#' + peer.id)
else
element = $("<li id='#{peer.id}'><video width='200px' style='float: left' autoplay></video></li>")
$('#others').append(element)
palava.browser.attachMediaStream(element.children('video')[0], peer.getStream())
session.on 'peer_left', (peer) ->
$('#' + peer.id).remove()
session.init
identity: new palava.Identity
userMediaConfig:
audio: true
video: true
options:
stun: 'stun:stun.palava.tv'
joinTimeout: 500
</script>
<script type="text/javascript" src="https://rawgithub.com/jashkenas/coffee-script/master/extras/coffee-script.js"></script>
</head>
<body>
<h1>Simple web conference with the palava client library</h1>
<div id="page_one">
Enter room name: <input id="room" type="text"> <input type="button" value="Join" onclick="join_room($('#room').val())">
</div>
<div id="page_two">
Interact with this conference on: <span id="link"></span>
<h2>My video</h2>
<video id="myvideo" autoplay></video>
<h2>Other videos:</h2>
<ul id="others" style="list-style: none"></ul>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment