Redirect webrtc-demos.appspot.com to svn site and added dtmf & pc1-audio demos. Also updated index page to include information about new demos.
Review URL: https://webrtc-codereview.appspot.com/1148004 git-svn-id: http://webrtc.googlecode.com/svn/trunk@3602 4adac7df-926f-26a2-2b94-8c16560cd09d
This commit is contained in:
@@ -1,30 +0,0 @@
|
|||||||
application: webrtc-demos
|
|
||||||
version: 1
|
|
||||||
runtime: python27
|
|
||||||
api_version: 1
|
|
||||||
threadsafe: yes
|
|
||||||
|
|
||||||
handlers:
|
|
||||||
- url: /favicon\.ico
|
|
||||||
static_files: favicon.ico
|
|
||||||
upload: favicon\.ico
|
|
||||||
|
|
||||||
- url: /html
|
|
||||||
static_dir: html
|
|
||||||
secure: always
|
|
||||||
|
|
||||||
- url: /images
|
|
||||||
static_dir: images
|
|
||||||
secure: always
|
|
||||||
|
|
||||||
- url: /js
|
|
||||||
static_dir: js
|
|
||||||
secure: always
|
|
||||||
|
|
||||||
- url: .*
|
|
||||||
script: main.app
|
|
||||||
secure: always
|
|
||||||
|
|
||||||
libraries:
|
|
||||||
- name: webapp2
|
|
||||||
version: "2.5.1"
|
|
187
samples/js/demos/html/dtmf1.html
Normal file
187
samples/js/demos/html/dtmf1.html
Normal file
@@ -0,0 +1,187 @@
|
|||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>PeerConnection DTMF Demo 1</title>
|
||||||
|
<!-- Load the polyfill to switch-hit between Chrome and Firefox -->
|
||||||
|
<script src="/js/adapter.js"></script>
|
||||||
|
<style>
|
||||||
|
button {
|
||||||
|
font: 18px sans-serif;
|
||||||
|
padding: 8px;
|
||||||
|
}
|
||||||
|
#left { position: absolute; left: 20; top: 0; width: 50%; }
|
||||||
|
#right { position: absolute; right: 0; top: 0; width: 50%; }
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body onload="onload()">
|
||||||
|
<div id="left">
|
||||||
|
<audio id="audio1" autoplay="autoplay" muted="true"></audio>
|
||||||
|
<h3>Send Dtmf Tones</h3>
|
||||||
|
<div id="dialingPad"></div>
|
||||||
|
<br><br>
|
||||||
|
duration:
|
||||||
|
<input type="text" id="dtmf-tones-duration" size="10" value="100"/>
|
||||||
|
<br><br>
|
||||||
|
tone-gap:
|
||||||
|
<input type="text" id="dtmf-tones-gap" size="10" value="50"/>
|
||||||
|
<br><br>
|
||||||
|
tones:
|
||||||
|
<input type="text" id="dtmf-tones" size="10" value="123,abc"/>
|
||||||
|
<button id="sendTones"
|
||||||
|
onclick="sendTone(document.getElementById('dtmf-tones').value)">Send tones
|
||||||
|
</button>
|
||||||
|
<br><br>
|
||||||
|
<button id="callBtn" onclick="call()">Call</button>
|
||||||
|
<button id="hangBtn" onclick="hangup()">Hang Up</button>
|
||||||
|
<br><br>
|
||||||
|
</div>
|
||||||
|
<div id="right">
|
||||||
|
<audio id="audio2" autoplay="autoplay"></audio>
|
||||||
|
<h3>Sent Tones</h3>
|
||||||
|
<textarea id="dtmfTonesSent" rows="12" cols="40" disabled="true">
|
||||||
|
</textarea><br>
|
||||||
|
</div>
|
||||||
|
<script>
|
||||||
|
callBtn.disabled = false;
|
||||||
|
hangBtn.disabled = true;
|
||||||
|
sendTones.disabled = true;
|
||||||
|
var pc1 = null,pc2 = null;
|
||||||
|
var localstream = null;
|
||||||
|
var dtmfSender = null;
|
||||||
|
var sdpConstraints = {'mandatory': {
|
||||||
|
'OfferToReceiveAudio':true,
|
||||||
|
'OfferToReceiveVideo':false }};
|
||||||
|
|
||||||
|
function gotStream(stream){
|
||||||
|
trace("Received local stream");
|
||||||
|
// Call the polyfill wrapper to attach the media stream to this element.
|
||||||
|
localstream = stream;
|
||||||
|
audioTracks = localstream.getAudioTracks();
|
||||||
|
if (audioTracks.length > 0)
|
||||||
|
trace('Using Audio device: ' + audioTracks[0].label);
|
||||||
|
pc1.addStream(localstream);
|
||||||
|
trace("Adding Local Stream to peer connection");
|
||||||
|
|
||||||
|
pc1.createOffer(gotDescription1);
|
||||||
|
}
|
||||||
|
|
||||||
|
function call() {
|
||||||
|
trace("Starting call");
|
||||||
|
var servers = null;
|
||||||
|
var pc_constraints = {"optional": []};
|
||||||
|
pc1 = new RTCPeerConnection(servers,pc_constraints);
|
||||||
|
trace("Created local peer connection object pc1");
|
||||||
|
pc1.onicecandidate = iceCallback1;
|
||||||
|
pc2 = new RTCPeerConnection(servers,pc_constraints);
|
||||||
|
trace("Created remote peer connection object pc2");
|
||||||
|
pc2.onicecandidate = iceCallback2;
|
||||||
|
pc2.onaddstream = gotRemoteStream;
|
||||||
|
|
||||||
|
trace("Requesting local stream");
|
||||||
|
// Call into getUserMedia via the polyfill (adapter.js).
|
||||||
|
getUserMedia({audio:true, video:false},
|
||||||
|
gotStream, function() {});
|
||||||
|
|
||||||
|
callBtn.disabled = true;
|
||||||
|
hangBtn.disabled = false;
|
||||||
|
sendTones.disabled = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
function gotDescription1(desc){
|
||||||
|
pc1.setLocalDescription(desc);
|
||||||
|
trace("Offer from pc1 \n" + desc.sdp);
|
||||||
|
pc2.setRemoteDescription(desc);
|
||||||
|
// Since the "remote" side has no media stream we need
|
||||||
|
// to pass in the right constraints in order for it to
|
||||||
|
// accept the incoming offer of audio.
|
||||||
|
pc2.createAnswer(gotDescription2, null, sdpConstraints);
|
||||||
|
}
|
||||||
|
|
||||||
|
function gotDescription2(desc){
|
||||||
|
pc2.setLocalDescription(desc);
|
||||||
|
trace("Answer from pc2 \n" + desc.sdp);
|
||||||
|
pc1.setRemoteDescription(desc);
|
||||||
|
}
|
||||||
|
|
||||||
|
function hangup() {
|
||||||
|
trace("Ending call");
|
||||||
|
pc1.close();
|
||||||
|
pc2.close();
|
||||||
|
pc1 = null;
|
||||||
|
pc2 = null;
|
||||||
|
localstream = null;
|
||||||
|
dtmfSender = null;
|
||||||
|
callBtn.disabled = false;
|
||||||
|
hangBtn.disabled = true;
|
||||||
|
sendTones.disabled = true;
|
||||||
|
document.getElementById("dtmfTonesSent").value = "Dtmf de-activated\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
function gotRemoteStream(e){
|
||||||
|
audio2.src = webkitURL.createObjectURL(e.stream);
|
||||||
|
trace("Received remote stream");
|
||||||
|
enableDtmfSender();
|
||||||
|
}
|
||||||
|
|
||||||
|
function iceCallback1(event){
|
||||||
|
if (event.candidate) {
|
||||||
|
pc2.addIceCandidate(new RTCIceCandidate(event.candidate));
|
||||||
|
trace("Local ICE candidate: \n" + event.candidate.candidate);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function iceCallback2(event){
|
||||||
|
if (event.candidate) {
|
||||||
|
pc1.addIceCandidate(new RTCIceCandidate(event.candidate));
|
||||||
|
trace("Remote ICE candidate: \n " + event.candidate.candidate);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function enableDtmfSender(){
|
||||||
|
document.getElementById("dtmfTonesSent").value = "Dtmf activated\n";
|
||||||
|
if (localstream != null) {
|
||||||
|
var local_audio_track = localstream.getAudioTracks()[0];
|
||||||
|
dtmfSender = pc1.createDTMFSender(local_audio_track);
|
||||||
|
trace("Created DTMF Sender\n");
|
||||||
|
dtmfSender.ontonechange = dtmfOnToneChange;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
trace("No Local Stream to create DTMF Sender\n");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function dtmfOnToneChange(tone){
|
||||||
|
if (tone) {
|
||||||
|
trace("Sent Dtmf tone: \t" + tone.tone);
|
||||||
|
document.getElementById("dtmfTonesSent").value += tone.tone + '\t';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function sendTone(tones){
|
||||||
|
if (dtmfSender) {
|
||||||
|
duration = document.getElementById("dtmf-tones-duration").value;
|
||||||
|
gap = document.getElementById("dtmf-tones-gap").value;
|
||||||
|
dtmfSender.insertDTMF(tones, duration, gap);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function createDialingPad() {
|
||||||
|
var tones = '1234567890*#ABCD';
|
||||||
|
var dialingPad = document.getElementById('dialingPad');
|
||||||
|
for (var i = 0; i < tones.length; ++i) {
|
||||||
|
var tone = tones.charAt(i);
|
||||||
|
dialingPad.innerHTML += '<button id="' +
|
||||||
|
tone + '" onclick="sendTone(\'' + tone +
|
||||||
|
'\')" style="height:40px; width: 30px">' + tone + '</button>';
|
||||||
|
if ((i + 1) % 4 == 0) {
|
||||||
|
dialingPad.innerHTML += '<br>';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function onload() {
|
||||||
|
createDialingPad();
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
110
samples/js/demos/html/pc1-audio.html
Normal file
110
samples/js/demos/html/pc1-audio.html
Normal file
@@ -0,0 +1,110 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>PeerConnection Audio Only Demo 1</title>
|
||||||
|
<!-- Load the polyfill to switch-hit between Chrome and Firefox -->
|
||||||
|
<script src="/js/adapter.js"></script>
|
||||||
|
<style>
|
||||||
|
button {
|
||||||
|
font: 18px sans-serif;
|
||||||
|
padding: 8px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h2>Local-Audio</h2>
|
||||||
|
<audio id="audio1" autoplay="autoplay" controls="controls" muted="true"></audio>
|
||||||
|
<h2>Remote-Audio</h2>
|
||||||
|
<audio id="audio2" autoplay="autoplay" controls="controls"></audio>
|
||||||
|
<br><br>
|
||||||
|
<button id="btn1" onclick="call()">Call</button>
|
||||||
|
<button id="btn2" onclick="hangup()">Hang Up</button>
|
||||||
|
<br><br>
|
||||||
|
<script>
|
||||||
|
btn1.disabled = false;
|
||||||
|
btn2.disabled = true;
|
||||||
|
var pc1,pc2;
|
||||||
|
var localstream;
|
||||||
|
var sdpConstraints = {'mandatory': {
|
||||||
|
'OfferToReceiveAudio':true,
|
||||||
|
'OfferToReceiveVideo':false }};
|
||||||
|
|
||||||
|
function gotStream(stream){
|
||||||
|
trace("Received local stream");
|
||||||
|
// Call the polyfill wrapper to attach the media stream to this element.
|
||||||
|
localstream = stream;
|
||||||
|
audioTracks = localstream.getAudioTracks();
|
||||||
|
if (audioTracks.length > 0)
|
||||||
|
trace('Using Audio device: ' + audioTracks[0].label);
|
||||||
|
pc1.addStream(localstream);
|
||||||
|
trace("Adding Local Stream to peer connection");
|
||||||
|
|
||||||
|
pc1.createOffer(gotDescription1);
|
||||||
|
}
|
||||||
|
|
||||||
|
function call() {
|
||||||
|
btn1.disabled = true;
|
||||||
|
btn2.disabled = false;
|
||||||
|
trace("Starting call");
|
||||||
|
var servers = null;
|
||||||
|
var pc_constraints = {"optional": []};
|
||||||
|
pc1 = new RTCPeerConnection(servers,pc_constraints);
|
||||||
|
trace("Created local peer connection object pc1");
|
||||||
|
pc1.onicecandidate = iceCallback1;
|
||||||
|
pc2 = new RTCPeerConnection(servers,pc_constraints);
|
||||||
|
trace("Created remote peer connection object pc2");
|
||||||
|
pc2.onicecandidate = iceCallback2;
|
||||||
|
pc2.onaddstream = gotRemoteStream;
|
||||||
|
trace("Requesting local stream");
|
||||||
|
// Call into getUserMedia via the polyfill (adapter.js).
|
||||||
|
getUserMedia({audio:true, video:false},
|
||||||
|
gotStream, function() {});
|
||||||
|
}
|
||||||
|
|
||||||
|
function gotDescription1(desc){
|
||||||
|
pc1.setLocalDescription(desc);
|
||||||
|
trace("Offer from pc1 \n" + desc.sdp);
|
||||||
|
pc2.setRemoteDescription(desc);
|
||||||
|
// Since the "remote" side has no media stream we need
|
||||||
|
// to pass in the right constraints in order for it to
|
||||||
|
// accept the incoming offer of audio.
|
||||||
|
pc2.createAnswer(gotDescription2, null, sdpConstraints);
|
||||||
|
}
|
||||||
|
|
||||||
|
function gotDescription2(desc){
|
||||||
|
pc2.setLocalDescription(desc);
|
||||||
|
trace("Answer from pc2 \n" + desc.sdp);
|
||||||
|
pc1.setRemoteDescription(desc);
|
||||||
|
}
|
||||||
|
|
||||||
|
function hangup() {
|
||||||
|
trace("Ending call");
|
||||||
|
pc1.close();
|
||||||
|
pc2.close();
|
||||||
|
pc1 = null;
|
||||||
|
pc2 = null;
|
||||||
|
btn2.disabled = true;
|
||||||
|
btn1.disabled = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
function gotRemoteStream(e){
|
||||||
|
audio2.src = webkitURL.createObjectURL(e.stream);
|
||||||
|
trace("Received remote stream");
|
||||||
|
}
|
||||||
|
|
||||||
|
function iceCallback1(event){
|
||||||
|
if (event.candidate) {
|
||||||
|
pc2.addIceCandidate(new RTCIceCandidate(event.candidate));
|
||||||
|
trace("Local ICE candidate: \n" + event.candidate.candidate);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function iceCallback2(event){
|
||||||
|
if (event.candidate) {
|
||||||
|
pc1.addIceCandidate(new RTCIceCandidate(event.candidate));
|
||||||
|
trace("Remote ICE candidate: \n " + event.candidate.candidate);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
@@ -50,6 +50,12 @@
|
|||||||
<td>
|
<td>
|
||||||
Shows how to set up a simple 1:1 audio/video call.</td>
|
Shows how to set up a simple 1:1 audio/video call.</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>
|
||||||
|
<a href="html/pc1-audio.html">pc1.html</a></td>
|
||||||
|
<td>
|
||||||
|
Shows how to set up a simple 1:1 audio only call.</td>
|
||||||
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
<a href="html/pc1-deprecated.html">pc1-deprecated.html</a></td>
|
<a href="html/pc1-deprecated.html">pc1-deprecated.html</a></td>
|
||||||
@@ -68,6 +74,24 @@
|
|||||||
<td>
|
<td>
|
||||||
Shows how to pass constraints into the PeerConnection API, and query it for statistics.</td>
|
Shows how to pass constraints into the PeerConnection API, and query it for statistics.</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>
|
||||||
|
<a href="html/dtmf1.html">dtmf1.html</a></td>
|
||||||
|
<td>
|
||||||
|
Shows how to send DTMF tones using PeerConnection API.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>
|
||||||
|
<a href="html/dc1.html">dc1.html</a></td>
|
||||||
|
<td>
|
||||||
|
Shows how to send Data using PeerConnection API.</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>
|
||||||
|
<a href="html/local-audio-rendering.html">local-audio-rendering.html</a></td>
|
||||||
|
<td>
|
||||||
|
Shows usage of a local media stream connected to an HTML5 audio tag.</td>
|
||||||
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
<p>
|
<p>
|
||||||
|
14
samples/js/demos/js/demosite/app.yaml
Normal file
14
samples/js/demos/js/demosite/app.yaml
Normal file
@@ -0,0 +1,14 @@
|
|||||||
|
application: webrtc-demos
|
||||||
|
version: 1
|
||||||
|
runtime: python27
|
||||||
|
api_version: 1
|
||||||
|
threadsafe: yes
|
||||||
|
|
||||||
|
handlers:
|
||||||
|
- url: .*
|
||||||
|
script: main.app
|
||||||
|
secure: always
|
||||||
|
|
||||||
|
libraries:
|
||||||
|
- name: webapp2
|
||||||
|
version: "2.5.1"
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
@@ -18,10 +18,20 @@ import webapp2
|
|||||||
import os
|
import os
|
||||||
from google.appengine.ext.webapp import template
|
from google.appengine.ext.webapp import template
|
||||||
|
|
||||||
class MainHandler(webapp2.RequestHandler):
|
class PageHandler(webapp2.RequestHandler):
|
||||||
def get(self):
|
def get(self):
|
||||||
path = os.path.join(os.path.dirname(__file__), 'index.html')
|
base_url = self.request.path
|
||||||
self.response.out.write(template.render(path, {}))
|
if self.request.path == '/':
|
||||||
|
self.redirect("http://webrtc.googlecode.com/svn/trunk/"
|
||||||
|
+ "samples/js/demos/index.html"
|
||||||
|
, permanent=True)
|
||||||
|
else:
|
||||||
|
self.redirect("http://webrtc.googlecode.com/svn/trunk/"
|
||||||
|
+ "samples/js/demos"
|
||||||
|
+ base_url,
|
||||||
|
permanent=True)
|
||||||
|
|
||||||
|
app = webapp2.WSGIApplication([
|
||||||
|
(r'/*.*', PageHandler),
|
||||||
|
], debug=True)
|
||||||
|
|
||||||
app = webapp2.WSGIApplication([('/', MainHandler)],
|
|
||||||
debug=True)
|
|
Reference in New Issue
Block a user