vikasmarwaha@webrtc.org | 98fce15 | 2013-02-27 23:22:10 +0000 | [diff] [blame] | 1 | <!DOCTYPE html> |
| 2 | <html> |
| 3 | <head> |
| 4 | <meta charset="utf-8"> |
| 5 | <title>Local Audio Rendering Demo</title> |
| 6 | <script type="text/javascript" src="../../base/adapter.js"></script> |
| 7 | <script> |
| 8 | var audioElement; |
| 9 | var buttonStart; |
| 10 | var buttonStop; |
| 11 | var localStream; |
| 12 | |
| 13 | $ = function(id) { |
| 14 | return document.getElementById(id); |
| 15 | }; |
| 16 | |
| 17 | function start() { |
| 18 | var constraints = {audio:true, video:false}; |
| 19 | getUserMedia(constraints, gotStream, gotStreamFailed); |
| 20 | buttonStart.disabled = true; |
| 21 | buttonStop.disabled = false; |
| 22 | } |
| 23 | |
| 24 | function stop() { |
| 25 | buttonStart.enabled = true; |
| 26 | buttonStop.enabled = false; |
| 27 | localStream.stop(); |
| 28 | } |
| 29 | |
| 30 | function gotStream(stream) { |
| 31 | videoTracks = stream.getVideoTracks(); |
| 32 | audioTracks = stream.getAudioTracks(); |
| 33 | if (audioTracks.length == 1 && videoTracks.length == 0) { |
| 34 | console.log('gotStream({audio:true, video:false})'); |
| 35 | console.log('Using audio device: ' + audioTracks[0].label); |
| 36 | attachMediaStream(audioElement, stream); |
vikasmarwaha@webrtc.org | 98fce15 | 2013-02-27 23:22:10 +0000 | [diff] [blame] | 37 | stream.onended = function() { |
| 38 | console.log('stream.onended'); |
| 39 | buttonStart.disabled = false; |
| 40 | buttonStop.disabled = true; |
| 41 | }; |
| 42 | |
| 43 | localStream = stream; |
| 44 | } else { |
| 45 | alert('The media stream contains an invalid amount of audio tracks.'); |
| 46 | stream.stop(); |
| 47 | } |
| 48 | } |
| 49 | |
| 50 | function gotStreamFailed(error) { |
| 51 | buttonStart.disabled = false; |
| 52 | buttonStop.disabled = true; |
| 53 | alert('Failed to get access to local media. Error code: ' + error.code); |
| 54 | } |
| 55 | |
| 56 | function onload() { |
| 57 | audioElement = $('audio'); |
| 58 | buttonStart = $('start'); |
| 59 | buttonStop = $('stop'); |
| 60 | buttonStart.enabled = true; |
| 61 | buttonStop.disabled = true; |
| 62 | } |
| 63 | </script> |
| 64 | </head> |
| 65 | |
| 66 | <body onload="onload()"> |
| 67 | <h2>Rendering of a local media stream using <audio></h2> |
| 68 | <p>Demonstrates usage of a local media stream connected to an HTML5 audio tag.<br> |
| 69 | Press Start, select a microphone and listen to your own voice in loopback.</p> |
| 70 | <style> |
| 71 | button { |
| 72 | font: 14px sans-serif; |
| 73 | padding: 8px; |
| 74 | } |
| 75 | </style> |
| 76 | <audio id="audio" autoplay="autoplay" controls="controls"></audio><br><br> |
| 77 | <button id="start" onclick="start()">Start</button> |
| 78 | <button id="stop" onclick="stop()">Stop</button> |
| 79 | </body> |
| 80 | </html> |