xxxxxxxxxx
80
/*
Experimental Photography
Interactive Media Arts @ NYU
Ellen Nickles
*------------------------------------*
USE IN CHROME
*------------------------------------*
ITP/IMA ER webcams and apps to adjust settings: https://tinyurl.com/externalwebcams
*/
const webcams = [];
let num = 0;
function setup() {
pixelDensity(1);
// OPTION TO CHANGE
// Reset width and height based on camera capabilities, check Console
createCanvas(1920, 1080);
// createCanvas(3840, 1080); // adjust when adding cameras
getVideoDevices(getVideo);
}
function draw() {
// mirror video devices
translate(width, 0);
scale(-1, 1);
// if any webcams are detected
if (webcams.length) {
// OPTION TO CHANGE
// specify cameras to draw on canvas, check Console
image(webcams[0], 0, 0, 1920, height);
// image(webcams[1], 1920, 0, 1920, height);
}
// Only use with built-in camera if possible
// For external webcams use separate apps
// filter(GRAY);
}
function mousePressed() {
num++;
saveCanvas(`pic${num}.png`);
}
function getVideoDevices(callback) {
navigator.mediaDevices
.enumerateDevices()
.then((devices) => {
const filtered = devices.filter((device) => device.kind === "videoinput");
callback(filtered);
})
.catch((err) => console.log(`${err.name}: ${err.message}`));
}
function getVideo(cams) {
for (let cam of cams) {
const index = cams.indexOf(cam);
const capabilities = cam.getCapabilities();
const constraints = {
audio: false,
video: {
deviceId: `${cam.deviceId}`,
width: `${capabilities.width.max}`,
height: `${capabilities.height.max}`,
},
};
webcams[index] = createCapture(constraints);
webcams[index].hide();
console.log(
`webcams[${index}]\n${cam.label}\nMax width:\t${constraints.video.width}\nMax height:\t${constraints.video.height}\n`
);
}
}