| Index: content/test/data/media/peerconnection-call.html
|
| diff --git a/content/test/data/media/peerconnection-call.html b/content/test/data/media/peerconnection-call.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..5c32804c57c6097aad9cbf5e27127138dbe9fc11
|
| --- /dev/null
|
| +++ b/content/test/data/media/peerconnection-call.html
|
| @@ -0,0 +1,136 @@
|
| +<html>
|
| +<head>
|
| + <script type="text/javascript">
|
| + $ = function(id) {
|
| + return document.getElementById(id);
|
| + };
|
| +
|
| + var gFirstConnection = null;
|
| + var gSecondConnection = null;
|
| +
|
| + function getUserMedia(constraints) {
|
| + navigator.webkitGetUserMedia(constraints, okCallback, failedCallback);
|
| + }
|
| +
|
| + function failedCallback(error) {
|
| + document.title = 'getUserMedia request failed with code ' + error.code;
|
| + }
|
| +
|
| + function okCallback(localStream) {
|
| + var localStreamUrl = webkitURL.createObjectURL(localStream);
|
| + $('local-view').src = localStreamUrl;
|
| +
|
| + callUsingStream(localStream);
|
| + }
|
| +
|
| + function callUsingStream(localStream) {
|
| + gFirstConnection = new webkitRTCPeerConnection(null, null);
|
| + gFirstConnection.onicecandidate = onIceCandidateToFirst;
|
| + gFirstConnection.addStream(localStream);
|
| + gFirstConnection.createOffer(onOfferCreated);
|
| + }
|
| +
|
| + function onOfferCreated(offer) {
|
| + gFirstConnection.setLocalDescription(offer);
|
| +
|
| + receiveCall(offer.sdp);
|
| + }
|
| +
|
| + function receiveCall(offerSdp) {
|
| + gSecondConnection = new webkitRTCPeerConnection(null, null);
|
| + gSecondConnection.onicecandidate = onIceCandidateToSecond;
|
| + gSecondConnection.onaddstream = onRemoteStream;
|
| +
|
| + var parsedOffer = new RTCSessionDescription({ type: 'offer',
|
| + sdp: offerSdp });
|
| + gSecondConnection.setRemoteDescription(parsedOffer);
|
| +
|
| + gSecondConnection.createAnswer(onAnswerCreated);
|
| + }
|
| +
|
| + function onAnswerCreated(answer) {
|
| + gSecondConnection.setLocalDescription(answer);
|
| + handleAnswer(answer.sdp);
|
| + }
|
| +
|
| + function handleAnswer(answerSdp) {
|
| + var parsedAnswer = new RTCSessionDescription({ type: 'answer',
|
| + sdp: answerSdp });
|
| + gFirstConnection.setRemoteDescription(parsedAnswer);
|
| + }
|
| +
|
| + function onIceCandidateToFirst(event) {
|
| + if (event.candidate) {
|
| + var candidate = new RTCIceCandidate(event.candidate);
|
| + gSecondConnection.addIceCandidate(candidate);
|
| + }
|
| + }
|
| +
|
| + function onIceCandidateToSecond(event) {
|
| + if (event.candidate) {
|
| + var candidate = new RTCIceCandidate(event.candidate);
|
| + gFirstConnection.addIceCandidate(candidate);
|
| + }
|
| + }
|
| +
|
| + function onRemoteStream(e) {
|
| + var remoteStreamUrl = webkitURL.createObjectURL(e.stream);
|
| + var remoteVideo = $('remote-view');
|
| + remoteVideo.src = remoteStreamUrl;
|
| +
|
| + waitForVideo(remoteVideo, 320, 240);
|
| + }
|
| +
|
| + function waitForVideo(videoElement, width, height) {
|
| + document.title = 'Waiting for video...';
|
| + var canvas = $('canvas');
|
| + setInterval(function() {
|
| + var context = canvas.getContext('2d');
|
| + context.drawImage(videoElement, 0, 0, 320, 240);
|
| + var pixels = context.getImageData(0, 0, 320, 240).data;
|
| +
|
| + if (isVideoPlaying(pixels, width, height))
|
| + testSuccessful();
|
| + }, 100);
|
| + }
|
| +
|
| + // This very basic video verification algorithm will be satisfied if any
|
| + // pixels are nonzero in a small sample area in the middle. It relies on the
|
| + // assumption that a video element with null source just presents zeroes.
|
| + function isVideoPlaying(pixels, width, height) {
|
| + // Sample somewhere near the middle of the image.
|
| + var middle = width * height / 2;
|
| + for (var i = 0; i < 20; i++) {
|
| + if (pixels[middle + i] > 0) {
|
| + return true;
|
| + }
|
| + }
|
| + return false;
|
| + }
|
| +
|
| + function testSuccessful() {
|
| + document.title = 'OK';
|
| + }
|
| + </script>
|
| +</head>
|
| +<body>
|
| + <table border="0">
|
| + <tr>
|
| + <td>Local Preview</td>
|
| + <td>Remote Stream</td>
|
| + <td>Capturing Canvas</td>
|
| + </tr>
|
| + <tr>
|
| + <td><video width="320" height="240" id="local-view"
|
| + autoplay="autoplay"></video></td>
|
| + <td><video width="320" height="240" id="remote-view"
|
| + autoplay="autoplay"></video></td>
|
| + <td><canvas width="320" height="240" id="canvas"></canvas></td>
|
| + </tr>
|
| + <tr>
|
| + <td colspan="3">You should see the same animated feed in all three
|
| + displays (the canvas will lag a bit).
|
| + </td>
|
| + </table>
|
| +</body>
|
| +</html>
|
|
|