javascript - What is causing my visualizer to not move at all even the microphone is captured? -
i have code green visualizer should moving moment microphone captured. causing not move @ all?
<!doctype html> <html> <head> <style> body { background-color: white; } img { width: 12px; height: 12px; } </style> </head> <body > <div id="select_media" style="padding:2px;background-color: black;color:white; width: 250px;"> <table> <tr> <td valign="top"> <div class='select'> <table> <tr> <td> <img src="/images/camera.png" /> </td> <td> <video muted autoplay style="width: 208px;height: 200px;"></video> <select id='videosource' style="width: 208px;"></select> </td> </tr> <tr> <td> <img src="/images/microphone.png" /> </td> <td> <select id='audiosource' style="width: 208px;"></select> <br/> <canvas id="test" style="background-color: black; width:208px;height: 10px;" ></canvas> </td> </tr> <!-- <tr> <td> <img src="/images/speaker.png" /> </td> <td> <select id='audiosource' style="width: 208px;"></select> </td> </tr>--> <tr> <td valign="top"> <img src="/images/speaker.png" /> </td> <td> <span id="playtestsound" onclick="playtestsound('audio1', 'play');" style="cursor:pointer;">play test sound</span> <br/> </td> </tr> </table> </div> </td> <td> </td> </tr> </table> </div> <audio id="audio1" src="/audio/phone.wav" controls preload="auto" autobuffer style="display: none;"> browser not supported </audio> </body> <script type="text/javascript"> var videoelement = document.queryselector("video"); var audioselect = document.queryselector("select#audiosource"); var videoselect = document.queryselector("select#videosource"); var startbutton = document.queryselector("button#start"); var canvascontext=document.getelementbyid("test"); navigator.getusermedia = navigator.getusermedia || navigator.webkitgetusermedia || navigator.mozgetusermedia; function gotsources(sourceinfos) { (var = 0; != sourceinfos.length; ++i) { var sourceinfo = sourceinfos[i]; var option = document.createelement("option"); option.value = sourceinfo.id; if (sourceinfo.kind === 'audio') { option.text = sourceinfo.label || 'microphone ' + (audioselect.length + 1); audioselect.appendchild(option); } else if (sourceinfo.kind === 'video') { option.text = sourceinfo.label || 'camera ' + (videoselect.length + 1); videoselect.appendchild(option); } else { console.log('some other kind of source: ', sourceinfo); } } } if (typeof mediastreamtrack === 'undefined'){ //alert('this browser not support mediastreamtrack.\n\ntry chrome canary.'); } else { mediastreamtrack.getsources(gotsources); } function successcallback(stream) { window.audiocontext = new webkitaudiocontext(); window.analyser = window.audiocontext.createanalyser(); window.microphone = window.audiocontext.createmediastreamsource(stream ); window.javascriptnode = window.audiocontext.createscriptprocessor(2048, 1, 1); window.analyser.smoothingtimeconstant = 0.3; window.analyser.fftsize = 1024; microphone.connect(analyser); window.analyser.connect(window.javascriptnode); javascriptnode.connect(window.audiocontext.destination); //canvascontext = document.getelementbyid("test"); canvascontext= canvascontext.getcontext("2d"); window.javascriptnode.onaudioprocess = function() { var array = new uint8array(window.analyser.frequencybincount); window.analyser.getbytefrequencydata(array); var values = 0; var length = array.length; (var = 0; < length; i++) { values += array[i]; } var average = values / length; canvascontext.clearrect(0, 0, 300, 130); canvascontext.fillstyle = '#00ff00'; canvascontext.fillrect(average,0,50,130); console.log('>>> ' , average); }; window.stream = stream; // make stream available console videoelement.src = window.url.createobjecturl(stream); videoelement.play(); } function errorcallback(error){ console.log("navigator.getusermedia error: ", error); } function start(){ if (!!window.stream) { videoelement.src = null; window.stream.stop(); } var audiosource = audioselect.value; var videosource = videoselect.value; var constraints = { audio: { optional: [{sourceid: audiosource}] }, video: { optional: [{sourceid: videosource}] } }; navigator.getusermedia(constraints, successcallback, errorcallback); } function playtestsound(soundobj,todo) { var thissound=document.getelementbyid(soundobj); switch(todo) { case 'play': thissound.volume=0.20; thissound.play(); break; case 'stop': thissound.pause(); break; } } audioselect.onchange = start; videoselect.onchange = start; start(); </script> </html>
it seems bug chrome/canary.
in osx 10.9.5 microphone active not working, when went osx controle panel , changed microphone volume level instantly started work.
Comments
Post a Comment