TypeError: Illegal invocation when using Media calls demo

Hi @peers @michellebu I’m trying to use peerjs in my angularjs application. While trying to use the code for media call in your example,

var getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
getUserMedia({video: true, audio: true}, function(stream) {
  var call = peer.call('another-peers-id', stream);
  call.on('stream', function(remoteStream) {
    // Show stream in some <video> element.
  });
}, function(err) {
  console.log('Failed to get local stream' ,err);
});

I got an error message like this: TypeError: Illegal invocation...

But if I try to use it like this, it works just fine.

navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
navigator.getUserMedia({video: true, audio: true}, function(stream) {
  var call = peer.call('another-peers-id', stream);
  call.on('stream', function(remoteStream) {
    // Show stream in some <video> element.
  });
}, function(err) {
  console.log('Failed to get local stream' ,err);
});

Not sure if this is related to the browser navigator api or just an angularjs issues. Do you have any idea? Thanks.

[hasangilak]

these sort of function needs navigator as its context. so with bind we can simply solve the problem.

  var getUserMedia = (function () {
    if(navigator.getUserMedia) {
        return navigator.getUserMedia.bind(navigator)
    }
    if(navigator.webkitGetUserMedia) {
      return navigator.webkitGetUserMedia.bind(navigator)
    }
    if(navigator.mozGetUserMedia) {
      return navigator.mozGetUserMedia.bind(navigator)
    }
  })();

[ocolot]

By the way, this issue is still in the media section of http://peerjs.com