How can you ask for an alternative video input in Safari? - safari

To get an alternative video input from MediaDevices.getUserMedia, my understanding is that you need to pass in the deviceID as a constraint. But, in Safari, to get access to deviceIDs via enumerateDevices, I need to call getUserMedia and get permission from the browser first (maybe there's another way?). The problem is that this initial getUserMedia call only returns device info for devices I've given permission for, so I still don't have the deviceID of the alternative video input.
How can I get the deviceID for this video input?
In my case, I'm trying to find the deviceID for Snapchat's "Snap Camera". In Chrome, I'm able to find and stream this video input.

Related

Can't send Media Stream of captureStream() through WebRTC

I create a WebRTC with simple peer. I need to capture stream from video element and send it to peers. I use vidEl.captureStream() to get Media Stream from video element and send it to other peer. It's working but only audio and video is blackscreen(not something is display).
[Testing] I create another video element on same origin of first video element and use captureStream() and test setObject with Media Stream captured and it's working.
How to send MediaStream from video.captureStream() to new peer through WebRTC and display video from remote peer.
Sorry for bad english.
https://webrtc.github.io/samples/src/content/capture/video-pc/
This sample does'nt work on chrome, edge but fire is worked. I don't know why.
There is currently an open bug in Chrome which breaks this:
https://bugs.chromium.org/p/chromium/issues/detail?id=1156408

How to determine which cameras are front and back facing when using HTML5 getUserMedia and enumerateDevices APIs?

When accessing the camera using HTML5 getUserMedia APIs, you can either:
Request an unspecified "user" facing camera
Request an unspecified "environment" facing camera (optionally left or right)
Request a list of cameras available
Originally we used the "facing" constraint to choose the camera. If the camera faces the "user" we show it mirror image as is the convention.
We run into problems, however, when a user does not have exactly 1 user-facing and 1 environment-facing camera. They might be missing one of these, or have multiple. This can result in the wrong camera being used, or the camera not being mirrored appropriately.
So we are looking at enumerating the devices. However, I have not found a way to determine whether a video device is "user facing" and should be mirrored.
Is there any API available to determine whether a video input is "user" facing the in these APIs?
When you enumerate devices, devices that are an input may have a method called getCapabilities(). If this method is available you may call it to get a MediaTrackCapabilities object. This object has a field called facingMode which lists the valid facingMode options for that device.
For me this was empty on the PC but on my Android device it populated correctly.
Here's a jsfiddle you can use to check this on your own devices: https://jsfiddle.net/juk61c07/4/
Thanks to the comment from O. Jones for setting me in the right direction.

safari 13.1 navigator.mediaDevices.enumerateDevices() return only audio devices

Im facing with an issue on desktop Safari 13.1 version. If I open the console in the web inspector (with a regular macbook which has webcam and mic) and execute this command on any kind of website:
navigator.mediaDevices.enumerateDevices()
First time it will return in the Promise result with a videoinput and an audioinput.
Second time it will return only 2 audioinput. Videoinput is disappear.
Unfortunately I call this method several times while checking the available devices on my solution.
Any idea why does it happen and how could I get the accurate information about the devices even If I call it more than once?
See the results here
I've found the same issue, also on my iPad running iOS 13.
It seems you need to request camera access first in order to see the correct device list.
navigator.mediaDevices.getUserMedia({ video: true })
This will prompt you for access to the camera (you need to be on HTTPS or localhost).
Grant permission, then run this again and you should see the videoinput device(s) listed in the returned promise:
navigator.mediaDevices.enumerateDevices()
I guess this makes sense as a privacy feature that a website cannot check if a camera exists without first asking your permission.

How to use the Google+ Hangouts API to get the Hangout On Air YouTube Live Video Embed URL?

I created an google+ hangout app.
now i want to get a youtube LIVE video embeded url to display.
i tried below Js in my browser console after starting broadcast
gapi.hangout.onair.getYouTubeLiveId(); <br/>
but i am getting 'null' as the result.
i tried gapi.hangout.onair.isBroadcasting();
but i am getting 'false' as the output in chrome browser console.
i tried gapi.hangout.onair.isOnAirHangout();
but it got 'false' as the output.
can anyone tell me the reason?
According to API documentation, getYouTubeLiveId() returns the YouTube Live ID for the Hangout On Air. Returns null if the ID is not available or the Hangout is not a broadcast hangout. Also, off-hand, I'm not sure it will provide the ID to a non-HOST. It's worth it to try as both Host of HoA and Participant and see if there's a difference.
I'm happy to test with you if you like.

how to connect disconnect the camera device using getUserMedia and webRTC

I am creating an audio/video and chat application using webRTC and Node.js. I need to mute and unmute the camera device.
Presently, I am able to disconnect and the other party is not able to see me, but the problem I see is that it doesn't disconnect the camera. It still remains active and connected as I see the camera flash still on.
I need help how to disconnect when muted and connect it back when unmuted. I want the same feature as we see in skype video call.
It varies a bit between Firefox and Chrome. These steps, in this order, work for me.
1) Set the src property on your video element to empty string ''.
2) Make sure the stop method exists before calling it as a function. Firefox doesn't have it, and if you try to run it, your code will throw an error.
if (localStream && localStream.stop) {
localStream.stop();
}
3) After you call cameraStream.stop() (or not), set localStream = null. (Maybe not actually necessary, but it couldn't hurt to let the object get garbage-collected. And when the user asks to start the camera up again, you can check against the variable to see if you need to clean up after the previous stream before starting a new one.)
When you are getting your media, in your success callback function you have to keep your localstream in a variable. Then, when you want to stop your stream, you can do localstream.stop();
To start again, you can repeat to call your getUserMedia() method again.