Feature Request: camera choice

[whimsicaldreamer]

I was hoping if i could use this library on a mobile website and it would open up the rear camera/front camera according to users choice, it would be great. Then i wont be required to use jquery mobile library.

[jhuckaby]

I'm afraid I don't know how to provide a way to select the camera from inside the library. The way it works is that WebcamJS just asks for generic "camera" access, and the browser itself handles asking the user which camera. This is implementation dependent, as all browsers and HTML5 / Flash do it differently. Sorry!

[carvilsi]

Hi.

If your idea is not to use Flash, maybe you can try this (Fork of webcamJS):
https://github.com/carvilsi/webcamjs

Allows to choose a camera device.
Useful with mobile devices with front and back camera or PC with more than one camera attached.

In the "init" function we try to list and store on array "cameraIDs" all IDs of video devices, in your code you can check the length of this array and select one camera ID by "cameraID" variable before call "attach" function.

Something like that:

// webcam set, as usual
Webcam.set({
width: 150,
height: 150,
dest_width: 150,
dest_height: 130,
image_format: 'jpeg',
jpeg_quality: 90,
force_flash: false
});

// selecting camera device
if (Webcam.cameraIDs.length > 1) {
Webcam.cameraID = 1;
}

// attach, as usual
Webcam.attach('#camara');

If you use this, please, some feedback will be great ;)

Best regards.

[rafverhaert]

Following code gives me an error because cameraID is undefined.
Webcamjs shows me the front camera but i need te camera on the back of my tablet

// selecting camera device
if (Webcam.cameraIDs.length > 1) {
Webcam.cameraID = 1;
}

[cyphunk]

@rafverhaert you have to use the fork version of the code which has the cameraid's array https://github.com/carvilsi/webcamjs/blob/master/webcam.js#L72

[duydb]

You can change camera by set value for capture attribute. At https://github.com/jhuckaby/webcamjs/blob/master/webcam.js#L367

See more capture options at: https://www.w3.org/TR/html-media-capture/

Ex:

      var input = document.createElement('input')
      input.id = this.container.id + '-ios_input'
      input.setAttribute('type', 'file')
      input.setAttribute('accept', 'image/*')
      input.setAttribute('capture', 'user')

=> Open front-camera