6 months with webrtc

27
6 Months with WebRTC

Upload: arin-sime

Post on 13-Jan-2015

3.026 views

Category:

Internet


4 download

DESCRIPTION

Presentation by Arin Sime, David Alfaro, and Mariana Lopez at the HTML5DevConf May 2014 in San Francisco. Overview of WebRTC and then what we learned in our first 6 months of using it to build a webinar tool.

TRANSCRIPT

Page 1: 6 Months with WebRTC

6 Months with WebRTC

Page 2: 6 Months with WebRTC
Page 3: 6 Months with WebRTC
Page 4: 6 Months with WebRTC
Page 5: 6 Months with WebRTC
Page 6: 6 Months with WebRTC
Page 7: 6 Months with WebRTC
Page 8: 6 Months with WebRTC
Page 9: 6 Months with WebRTC
Page 10: 6 Months with WebRTC
Page 11: 6 Months with WebRTC
Page 12: 6 Months with WebRTC
Page 13: 6 Months with WebRTC
Page 14: 6 Months with WebRTC
Page 15: 6 Months with WebRTC
Page 16: 6 Months with WebRTC
Page 17: 6 Months with WebRTC
Page 18: 6 Months with WebRTC
Page 19: 6 Months with WebRTC

Learnings: Browsers are a PITA navigator.getUserMedia = (navigator.getUserMedia ||

navigator.webkitGetUserMedia ||navigator.mozGetUserMedia || navigator.msGetUserMedia);

if(navigator.getUserMedia != null){ navigator.getUserMedia(options, function(stream) { if(typeof callback === 'function'){ callback(stream); } }, function(e) { console.log('No access to getUserMedia!', e); if(e.name === "PermissionDeniedError" && window.location.protocol !== "https:"){ alert("Must be behind a SSL..."); } if(typeof errorCallback === 'function'){ errorCallback(e); } });

}

Page 20: 6 Months with WebRTC

Learnings: API’s are a big help function publishStream(uuid) {

pubnub.publish({ user: uuid, stream: myStream

});

pubnub.subscribe({ user: uuid, stream: function (data, event) { document.querySelector(‘#call-video’).src = URL.createObjectUrl(event.stream); }, disconnect: function (uuid, pc) { document.querySelector(“#call-video”).src = “”; $(document).trigger(“call:end”);

} }); };

From: http://www.pubnub.com/developers/webrtc/

Page 21: 6 Months with WebRTC

Learnings: Echoes not so helpful

agility_webrtc.showStream({ who : "presenter" , container : '#video'});

//If I'm the presenter, mute the video to prevent echos $(”#video").prop('muted', true);

Page 22: 6 Months with WebRTC

Learnings: UX considerations

Code sample to go here

Page 23: 6 Months with WebRTC

Learnings: Dropped connections

Page 24: 6 Months with WebRTC

Learnings: Manual Handshaking

Code sample to go here

Page 25: 6 Months with WebRTC

Learnings: Corporate Firewalls

Code sample to go here

Image from http://www.html5rocks.com/en/tutorials/webrtc/basics/

Page 26: 6 Months with WebRTC
Page 27: 6 Months with WebRTC