src/tools/perf/page_sets/third_party/webrtc/samples/js/demos/html/pc1.html

   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>
   8 video {
   9   border:5px solid black;
  10   width:480px;
  11   height:360px;
  12 }
  13 button {
  14   font: 18px sans-serif;
  15   padding: 8px;
  16 }
  17 textarea {
  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="true" muted="true"></video>
  27 <video id="vid2" autoplay></video>
  28 <br>
  29 <button id="btn1" onclick="start()">Start</button>
  30 <button id="btn2" onclick="call()">Call</button>
  31 <button id="btn3" onclick="hangup()">Hang Up</button>
  32 <br>
  33 <xtextarea id="ta1"></textarea>
  34 <xtextarea id="ta2"></textarea>
  35 <script>
  36 //var vid1 = document.getElementById("vid1");
  37 //var vid2 = document.getElementById("vid2");
  38 btn1.disabled = false;
  39 btn2.disabled = true;
  40 btn3.disabled = true;
  41 var pc1,pc2;
  42 var localstream;
  43 var sdpConstraints = {'mandatory': {
  44                         'OfferToReceiveAudio':true,
  45                         'OfferToReceiveVideo':true }};
  46
  47 function gotStream(stream){
  48   trace("Received local stream");
  49   // Call the polyfill wrapper to attach the media stream to this element.
  50   attachMediaStream(vid1, stream);
  51   localstream = stream;
  52   btn2.disabled = false;
  53 }
  54
  55 function start() {
  56   trace("Requesting local stream");
  57   btn1.disabled = true;
  58   // Call into getUserMedia via the polyfill (adapter.js).
  59   getUserMedia({audio:true, video:true},
  60                 gotStream, function() {});
  61 }
  62
  63 function call() {
  64   btn2.disabled = true;
  65   btn3.disabled = false;
  66   trace("Starting call");
  67   videoTracks = localstream.getVideoTracks();
  68   audioTracks = localstream.getAudioTracks();
  69   if (videoTracks.length > 0)
  70     trace('Using Video device: ' + videoTracks[0].label);
  71   if (audioTracks.length > 0)
  72     trace('Using Audio device: ' + audioTracks[0].label);
  73   var servers = null;
  74   pc1 = new RTCPeerConnection(servers);
  75   trace("Created local peer connection object pc1");
  76   pc1.onicecandidate = iceCallback1;
  77   pc2 = new RTCPeerConnection(servers);
  78   trace("Created remote peer connection object pc2");
  79   pc2.onicecandidate = iceCallback2;
  80   pc2.onaddstream = gotRemoteStream;
  81
  82   pc1.addStream(localstream);
  83   trace("Adding Local Stream to peer connection");
  84
  85   pc1.createOffer(gotDescription1, onCreateSessionDescriptionError);
  86 }
  87
  88 function onCreateSessionDescriptionError(error) {
  89   trace('Failed to create session description: ' + error.toString());
  90 }
  91
  92 function gotDescription1(desc){
  93   pc1.setLocalDescription(desc);
  94   trace("Offer from pc1 \n" + desc.sdp);
  95   pc2.setRemoteDescription(desc);
  96   // Since the "remote" side has no media stream we need
  97   // to pass in the right constraints in order for it to
  98   // accept the incoming offer of audio and video.
  99   pc2.createAnswer(gotDescription2, onCreateSessionDescriptionError,
 100                    sdpConstraints);
 101 }
 102
 103 function gotDescription2(desc){
 104   pc2.setLocalDescription(desc);
 105   trace("Answer from pc2 \n" + desc.sdp);
 106   pc1.setRemoteDescription(desc);
 107 }
 108
 109 function hangup() {
 110   trace("Ending call");
 111   pc1.close();
 112   pc2.close();
 113   pc1 = null;
 114   pc2 = null;
 115   btn3.disabled = true;
 116   btn2.disabled = false;
 117 }
 118
 119 function gotRemoteStream(e){
 120   // Call the polyfill wrapper to attach the media stream to this element.
 121   attachMediaStream(vid2, e.stream);
 122   trace("Received remote stream");
 123 }
 124
 125 function iceCallback1(event){
 126   if (event.candidate) {
 127     pc2.addIceCandidate(new RTCIceCandidate(event.candidate),
 128                         onAddIceCandidateSuccess, onAddIceCandidateError);
 129     trace("Local ICE candidate: \n" + event.candidate.candidate);
 130   }
 131 }
 132
 133 function iceCallback2(event){
 134   if (event.candidate) {
 135     pc1.addIceCandidate(new RTCIceCandidate(event.candidate),
 136                         onAddIceCandidateSuccess, onAddIceCandidateError);
 137     trace("Remote ICE candidate: \n " + event.candidate.candidate);
 138   }
 139 }
 140
 141 function onAddIceCandidateSuccess() {
 142   trace("AddIceCandidate success.");
 143 }
 144
 145 function onAddIceCandidateError(error) {
 146   trace("Failed to add Ice Candidate: " + error.toString());
 147 }
 148 </script>
 149 </body>
 150 </html>
 151
 152