Gitiles
Code Review Sign In
gerrit.openfyde.cn / webrtc.googlesource.com / src / 98fce15c6f961b0e139a0a9527d591e542ce33ed / . / samples / js / demos / html / multiple.html
blob: 81d768e7d0f4781a2e88d7717a900b71c73b48dd [file] [log] [blame]
vikasmarwaha@webrtc.org98fce152013-02-27 23:22:10 +0000[diff] [blame^]1<!DOCTYPE html>
2<html>
3<head>
4<title>PeerConnection Demo 1</title>
5<!-- Load the polyfill to switch-hit between Chrome and Firefox -->
6<script src="../../base/adapter.js"></script>
7<style>
8video {
9 border:5px solid black;
10 width:480px;
11 height:360px;
12}
13button {
14 font: 18px sans-serif;
15 padding: 8px;
16}
17textarea {
18 font-family: monospace;
19 margin: 2px;
20 width:480px;
21 height:640px;
22}
23</style>
24</head>
25<body>
26<video id="vid1" autoplay></video>
27<video id="vid2" autoplay></video>
28<video id="vid3" autoplay></video>
29<br>
30<button id="btn1" onclick="start()">Start</button>
31<button id="btn2" onclick="call()">Call</button>
32<button id="btn3" onclick="hangup()">Hang Up</button>
33<br>
34<script>
35//var vid1 = document.getElementById("vid1");
36//var vid2 = document.getElementById("vid2");
37btn1.disabled = false;
38btn2.disabled = true;
39btn3.disabled = true;
40var pc1_local, pc1_remote;
41var pc2_local, pc2_remote;
42var localstream;
43var sdpConstraints = {'mandatory': {
44 'OfferToReceiveAudio':true,
45 'OfferToReceiveVideo':true }};
46
47function trace(text) {
48 // This function is used for logging.
49 if (text[text.length - 1] == '\n') {
50 text = text.substring(0, text.length - 1);
51 }
52 console.log((performance.now() / 1000).toFixed(3) + ": " + text);
53}
54
55function gotStream(stream){
56 trace("Received local stream");
57 // Call the polyfill wrapper to attach the media stream to this element.
58 attachMediaStream(vid1, stream);
59 localstream = stream;
60 btn2.disabled = false;
61}
62
63function start() {
64 trace("Requesting local stream");
65 btn1.disabled = true;
66 // Call into getUserMedia via the polyfill (adapter.js).
67 getUserMedia({audio:true, video:true},
68 gotStream, function() {});
69}
70
71function call() {
72 btn2.disabled = true;
73 btn3.disabled = false;
74 trace("Starting calls");
75 videoTracks = localstream.getVideoTracks();
76 audioTracks = localstream.getAudioTracks();
77 if (videoTracks.length > 0)
78 trace("Using Video device: " + videoTracks[0].label);
79 if (audioTracks.length > 0)
80 trace("Using Audio device: " + audioTracks[0].label);
81
82 // Create an RTCPeerConnection via the polyfill (adapter.js).
83 var servers = null;
84 pc1_local = new RTCPeerConnection(servers);
85 pc1_remote = new RTCPeerConnection(servers);
86 pc1_remote.onaddstream = gotRemoteStream1;
87 pc1_local.onicecandidate = iceCallback1Local;
88 pc1_remote.onicecandidate = iceCallback1Remote;
89 trace("PC1: created local and remote peer connection objects");
90
91 pc2_local = new RTCPeerConnection(servers);
92 pc2_remote = new RTCPeerConnection(servers);
93 pc2_remote.onaddstream = gotRemoteStream2;
94 pc2_local.onicecandidate = iceCallback2Local;
95 pc2_remote.onicecandidate = iceCallback2Remote;
96 trace("PC2: created local and remote peer connection objects");
97
98 pc1_local.addStream(localstream);
99 trace("Adding local stream to pc1_local");
100 pc1_local.createOffer(gotDescription1Local);
101
102 pc2_local.addStream(localstream);
103 trace("Adding local stream to pc2_local");
104 pc2_local.createOffer(gotDescription2Local);
105}
106
107function gotDescription1Local(desc) {
108 pc1_local.setLocalDescription(desc);
109 trace("Offer from pc1_local \n" + desc.sdp);
110 pc1_remote.setRemoteDescription(desc);
111 // Since the "remote" side has no media stream we need
112 // to pass in the right constraints in order for it to
113 // accept the incoming offer of audio and video.
114 pc1_remote.createAnswer(gotDescription1Remote, null, sdpConstraints);
115}
116
117function gotDescription1Remote(desc) {
118 pc1_remote.setLocalDescription(desc);
119 trace("Answer from pc1_remote \n" + desc.sdp);
120 pc1_local.setRemoteDescription(desc);
121}
122
123function gotDescription2Local(desc) {
124 pc2_local.setLocalDescription(desc);
125 trace("Offer from pc2_local \n" + desc.sdp);
126 pc2_remote.setRemoteDescription(desc);
127 // Since the "remote" side has no media stream we need
128 // to pass in the right constraints in order for it to
129 // accept the incoming offer of audio and video.
130 pc2_remote.createAnswer(gotDescription2Remote, null, sdpConstraints);
131}
132
133function gotDescription2Remote(desc) {
134 pc2_remote.setLocalDescription(desc);
135 trace("Answer from pc2_remote \n" + desc.sdp);
136 pc2_local.setRemoteDescription(desc);
137}
138
139function hangup() {
140 trace("Ending calls");
141 pc1_local.close();
142 pc1_remote.close();
143 pc2_local.close();
144 pc2_remote.close();
145 pc1_local = pc1_remote = null;
146 pc2_local = pc2_remote = null;
147 btn3.disabled = true;
148 btn2.disabled = false;
149}
150
151function gotRemoteStream1(e) {
152 vid2.src = webkitURL.createObjectURL(e.stream);
153 trace("PC1: Received remote stream");
154}
155
156function gotRemoteStream2(e) {
157 vid3.src = webkitURL.createObjectURL(e.stream);
158 trace("PC2: Received remote stream");
159}
160
161function iceCallback1Local(event) {
162 handleCandidate(event.candidate, pc1_remote, "PC1: ", "local");
163}
164
165function iceCallback1Remote(event) {
166 handleCandidate(event.candidate, pc1_local, "PC1: ", "remote");
167}
168
169function iceCallback2Local(event) {
170 handleCandidate(event.candidate, pc2_remote, "PC2: ", "local");
171}
172
173function iceCallback2Remote(event) {
174 handleCandidate(event.candidate, pc2_local, "PC2: ", "remote");
175}
176
177function handleCandidate(candidate, dest, prefix, type) {
178 if (candidate) {
179 dest.addIceCandidate(new RTCIceCandidate(candidate));
180 trace(prefix + "New " + type + " ICE candidate: " + candidate.candidate);
181 }
182}
183</script>
184</body>
185</html>
186
187