Adding webrtc-sample demos under trunk/samples.

Review URL: https://webrtc-codereview.appspot.com/1126005 git-svn-id: http://webrtc.googlecode.com/svn/trunk@3578 4adac7df-926f-26a2-2b94-8c16560cd09d
2013-02-27 23:22:10 +00:00
parent 132c15de30
commit 98fce15c6f
30 changed files with 3409 additions and 0 deletions
--- a/samples/js/demos/html/local-audio-rendering.html
+++ b/samples/js/demos/html/local-audio-rendering.html
@@ -0,0 +1,91 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>Local Audio Rendering Demo</title>
+<script type="text/javascript" src="../../base/adapter.js"></script>
+<script>
+  var audioElement;
+  var buttonStart;
+  var buttonStop;
+  var localStream;
+  
+  $ = function(id) {
+    return document.getElementById(id);
+  };
+
+  function start() {
+    var constraints = {audio:true, video:false};
+    getUserMedia(constraints, gotStream, gotStreamFailed);
+    buttonStart.disabled = true;
+    buttonStop.disabled = false;
+  }
+  
+  function stop() {
+    buttonStart.enabled = true;
+    buttonStop.enabled = false;
+    localStream.stop();
+  }
+  
+  function gotStream(stream) {
+    videoTracks = stream.getVideoTracks();
+    audioTracks = stream.getAudioTracks();
+    if (audioTracks.length == 1 && videoTracks.length == 0) {
+      console.log('gotStream({audio:true, video:false})');
+      console.log('Using audio device: ' + audioTracks[0].label);
+      attachMediaStream(audioElement, stream);
+      
+      // The audio will be muted by default from start.
+      // Unmute and set volume to max level so we can listen to audio in
+      // loopback. We restore the volume in a 'play' event to ensure that
+      // loading has been done (auto-mute is performed during load).
+      audioElement.addEventListener('play', function() {
+        audioElement.muted = false;
+        audioElement.volume = 1;
+        console.log('Unmuting and setting volume to max level');
+      }, false);
+      
+      stream.onended = function() {
+        console.log('stream.onended');
+        buttonStart.disabled = false;
+        buttonStop.disabled = true;
+      };
+      
+      localStream = stream;
+    } else {
+      alert('The media stream contains an invalid amount of audio tracks.');
+      stream.stop();
+    }
+  }
+  
+  function gotStreamFailed(error) {
+    buttonStart.disabled = false;
+    buttonStop.disabled = true;
+    alert('Failed to get access to local media. Error code: ' + error.code);
+  }
+  
+  function onload() {
+    audioElement = $('audio');
+    buttonStart = $('start');
+    buttonStop = $('stop');
+    buttonStart.enabled = true;
+    buttonStop.disabled = true;
+  } 
+</script>
+</head>
+
+<body onload="onload()">
+  <h2>Rendering of a local media stream using &lt;audio&gt;</h2>
+  <p>Demonstrates usage of a local media stream connected to an HTML5 audio tag.<br>
+     Press Start, select a microphone and listen to your own voice in loopback.</p>
+  <style>
+    button {
+      font: 14px sans-serif;
+      padding: 8px;
+    }
+  </style>
+  <audio id="audio" autoplay="autoplay" controls="controls"></audio><br><br>
+  <button id="start" onclick="start()">Start</button>
+  <button id="stop" onclick="stop()">Stop</button>
+</body>
+</html>