It is possible to set a specific device, like a USB camera or a different onboard camera, to retrieve images. Note that, in mobile devices, usually "user" stands for the front camera and "environment" stands for the rear camera.
<div class="card">
<h:form>
<h:panelGrid columns="3" cellpadding="5">
<p:outputPanel id="photoCamPnl">
<p:photoCam widgetVar="pc" listener="#{photoCamView.oncapture}" update="photo"/>
<select onchange="reload()" class="photoCamDevices">
<option value="">Select device</option>
<option value="user">"user" device</option>
<option value="environment">"environment" device</option>
</select>
</p:outputPanel>
<p:commandButton type="button" value="Capture" onclick="PF('pc').capture()"/>
<p:outputPanel id="photo">
<p:graphicImage name="demo/images/photocam/#{photoCamView.filename}.jpeg"
rendered="#{not empty photoCamView.filename}"/>
</p:outputPanel>
</h:panelGrid>
</h:form>
</div>
<script>
//<![CDATA[
function reload() {
var cam = PF('pc');
var deviceSelector = document.querySelector("select.photoCamDevices");
var device = deviceSelector.value;
cam.device = device;
cam.reload();
}
function populateDeviceMenu() {
var photoCam = PF('pc');
var deviceSelector = document.querySelector("select");
var availableDevices = photoCam.getAvailableDevices();
if (availableDevices) {
availableDevices.then(devices => devices.forEach(device => {
var option = document.createElement("option");
option.text = device.label;
option.value = device.deviceId;
deviceSelector.appendChild(option);
})
);
} else {
console.log("no devices available");
}
}
populateDeviceMenu();
//]]>
</script>
@Named
@ViewScoped
public class PhotoCamView implements Serializable {
private String filename;
private String getRandomImageName() {
int i = (int) (Math.random() * 10000000);
return String.valueOf(i);
}
public String getFilename() {
return filename;
}
public void oncapture(CaptureEvent captureEvent) {
filename = getRandomImageName();
byte[] data = captureEvent.getData();
ExternalContext externalContext = FacesContext.getCurrentInstance().getExternalContext();
String newFileName = externalContext.getRealPath("") + File.separator + "resources" + File.separator + "demo"
+ File.separator + "images" + File.separator + "photocam" + File.separator + filename + ".jpeg";
FileImageOutputStream imageOutput;
try {
imageOutput = new FileImageOutputStream(new File(newFileName));
imageOutput.write(data, 0, data.length);
imageOutput.close();
}
catch (IOException e) {
throw new FacesException("Error in writing captured image.", e);
}
}
}