Have this code when the button is clicked the stream starts but when the stop button is clicked nothing happens? I want to be able to stop the stream and get the recorded Media and display it?

How would i do this? Any Help Will be Great.

<html>
<input type="button" value="Record" onclick="record(this)">
<input type="button" value="Stop" onclick="stop(this)">
<video autoplay></video>
<script language="javascript" type="text/javascript">



var record = function(button) {
navigator.getUserMedia = navigator.webkitGetUserMedia 
|| navigator.getUserMedia;

window.URL = window.URL || window.webkitURL;

navigator.getUserMedia({audio: true, video: true}, function(stream) {
  var video = document.querySelector('video');
  video.src = window.URL.createObjectURL(stream);
  stream.record();
  //setTimeout(stop, 10);
}, function(e) {
  console.log(e);
  //setTimeout(10);
});
};

var stop = function(button){
//alert('button Check');
stream.stop();
stream.getRecordedData(function(blob) {
//alert('Checking');
//upload blobusing XHR2.
});
};


</script>
</html>
Member Avatar

LastMitch

Have this code when the button is clicked the stream starts but when the stop button is clicked nothing happens?

You need to begin with this as it needs a target to stop:

$("#clickable").click(function(e) {}