Skip to content
This repository was archived by the owner on Aug 27, 2022. It is now read-only.

Commit

Permalink
restore compatibility with preview from device cam
Browse files Browse the repository at this point in the history 
Change-Id: Id2d48621529cea2733c64102658c1d47ef5a7cda
  • Loading branch information
@andi34
andi34 committed Nov 14, 2020
1 parent 981f4a0 commit e9032a1
Show file tree
Hide file tree
Showing 4 changed files with 88 additions and 49 deletions.
2 changes: 1 addition & 1 deletion api/admin.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,7 @@
$newConfig['login_password'] = NULL;
}

if ($newConfig['preview_mode'] != 'device_cam') {
if ($newConfig['preview_mode'] != 'device_cam' && $newConfig['preview_mode'] != 'gphoto') {
$newConfig['previewCamTakesPic'] = false;
}

Expand Down
2 changes: 1 addition & 1 deletion config/config.inc.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,7 @@

// P R E V I E W
// Please read https://github.com/andi34/photobooth/wiki/FAQ#how-to-use-a-live-stream-as-background-at-countdown
// possible preview_mode values: none, device_cam, url
// possible preview_mode values: none, device_cam, url, gphoto
$config['preview_mode'] = 'none';
$config['previewCamTakesPic'] = false;
$config['previewCamFlipHorizontal'] = true;
Expand Down
3 changes: 2 additions & 1 deletion lib/configsetup.inc.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -367,7 +367,8 @@
'options' => [
'none' => 'None',
'device_cam' => 'from device cam',
'url' => 'from URL'
'url' => 'from URL',
'gphoto' => 'from gphoto2'
],
'value' => $config['preview_mode']
],
Expand Down
130 changes: 84 additions & 46 deletions src/js/core.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -162,48 +162,76 @@ const photoBooth = (function () {
return;
}

jQuery
.post('api/takeVideo.php', dataVideo)
.done(function (result) {
console.log('Start webcam', result);
pid = result.pid;
const getMedia =
navigator.mediaDevices.getUserMedia ||
navigator.mediaDevices.webkitGetUserMedia ||
navigator.mediaDevices.mozGetUserMedia ||
false;

if (!getMedia) {
return;
}
if (config.preview_mode === 'gphoto') {
jQuery
.post('api/takeVideo.php', dataVideo)
.done(function (result) {
console.log('Start webcam', result);
pid = result.pid;
const getMedia =
navigator.mediaDevices.getUserMedia ||
navigator.mediaDevices.webkitGetUserMedia ||
navigator.mediaDevices.mozGetUserMedia ||
false;

if (!getMedia) {
return;
}

if (config.previewCamFlipHorizontal) {
$('#video--view').addClass('flip-horizontal');
$('#video--preview').addClass('flip-horizontal');
}
if (config.previewCamFlipHorizontal) {
$('#video--view').addClass('flip-horizontal');
$('#video--preview').addClass('flip-horizontal');
}

getMedia
.call(navigator.mediaDevices, webcamConstraints)
.then(function (stream) {
if (mode === 'preview') {
$('#video--preview').show();
videoPreview.srcObject = stream;
api.stream = stream;
wrapper.css('background-image', 'none');
wrapper.css('background-color', 'transparent');
} else {
getMedia
.call(navigator.mediaDevices, webcamConstraints)
.then(function (stream) {
$('#video--view').show();
videoView.srcObject = stream;
}
api.stream = stream;
})
.catch(function (error) {
console.log('Could not get user media: ', error);
});
})
.fail(function (xhr, status, result) {
console.log('Could not start webcam', result);
});
} else {
const getMedia =
navigator.mediaDevices.getUserMedia ||
navigator.mediaDevices.webkitGetUserMedia ||
navigator.mediaDevices.mozGetUserMedia ||
false;

if (!getMedia) {
return;
}

if (config.previewCamFlipHorizontal) {
$('#video--view').addClass('flip-horizontal');
$('#video--preview').addClass('flip-horizontal');
}

getMedia
.call(navigator.mediaDevices, webcamConstraints)
.then(function (stream) {
if (mode === 'preview') {
$('#video--preview').show();
videoPreview.srcObject = stream;
api.stream = stream;
})
.catch(function (error) {
console.log('Could not get user media: ', error);
});
})
.fail(function (xhr, status, result) {
console.log('Could not start webcam', result);
});
wrapper.css('background-image', 'none');
wrapper.css('background-color', 'transparent');
} else {
$('#video--view').show();
videoView.srcObject = stream;
}
api.stream = stream;
})
.catch(function (error) {
console.log('Could not get user media: ', error);
});
}
};

api.stopVideo = function (mode) {
Expand Down Expand Up @@ -261,7 +289,7 @@ const photoBooth = (function () {
photoStyle = 'collage';
}

if (config.preview_mode === 'device_cam') {
if (config.preview_mode === 'device_cam' || config.preview_mode === 'gphoto') {
api.startVideo('view');
} else if (config.preview_mode === 'url') {
$('#ipcam--view').show();
Expand Down Expand Up @@ -296,7 +324,13 @@ const photoBooth = (function () {
.appendTo('.cheese');
}

if (config.no_cheese) {
if (config.preview_mode === 'device_cam' && config.previewCamTakesPic && !api.stream && !config.dev) {
console.log('No preview by device cam available!');

api.errorPic({
error: 'No preview by device cam available!'
});
} else if (config.no_cheese) {
api.takePic(photoStyle);
} else {
setTimeout(() => {
Expand All @@ -315,7 +349,16 @@ const photoBooth = (function () {
ioClient.emit('photobooth-socket', 'in progress');
}

if (config.preview_mode === 'url') {
if (config.preview_mode === 'device_cam' || config.preview_mode === 'gphoto') {
if (config.previewCamTakesPic && !config.dev) {
videoSensor.width = videoView.videoWidth;
videoSensor.height = videoView.videoHeight;
videoSensor.getContext('2d').drawImage(videoView, 0, 0);
}
if (config.preview_mode === 'device_cam') {
api.stopVideo('view');
}
} else if (config.preview_mode === 'url') {
$('#ipcam--view').removeClass('streaming');
$('#ipcam--view').hide();
}
Expand All @@ -334,12 +377,7 @@ const photoBooth = (function () {
loader.css('background', config.colors.panel);
loader.css('background-color', config.colors.panel);

if (config.preview_mode === 'device_cam') {
if (config.previewCamTakesPic && !config.dev) {
videoSensor.width = videoView.videoWidth;
videoSensor.height = videoView.videoHeight;
videoSensor.getContext('2d').drawImage(videoView, 0, 0);
}
if (config.preview_mode === 'gphoto') {
api.stopVideoAndTakePic(data);
} else {
api.callTakePicApi(data);
Expand Down

0 comments on commit e9032a1

Please sign in to comment.