diff --git a/packages/@uppy/dashboard/src/Dashboard.jsx b/packages/@uppy/dashboard/src/Dashboard.jsx
index 28c3bd18f3..6b973422f9 100644
--- a/packages/@uppy/dashboard/src/Dashboard.jsx
+++ b/packages/@uppy/dashboard/src/Dashboard.jsx
@@ -971,6 +971,7 @@ export default class Dashboard extends UIPlugin {
showSelectedFiles: this.opts.showSelectedFiles,
showNativePhotoCameraButton: this.opts.showNativePhotoCameraButton,
showNativeVideoCameraButton: this.opts.showNativeVideoCameraButton,
+ nativeCameraFacingMode: this.opts.nativeCameraFacingMode,
handleCancelRestore: this.handleCancelRestore,
handleRequestThumbnail: this.handleRequestThumbnail,
handleCancelThumbnail: this.handleCancelThumbnail,
diff --git a/packages/@uppy/dashboard/src/components/AddFiles.jsx b/packages/@uppy/dashboard/src/components/AddFiles.jsx
index 23be378855..835cc57dfc 100644
--- a/packages/@uppy/dashboard/src/components/AddFiles.jsx
+++ b/packages/@uppy/dashboard/src/components/AddFiles.jsx
@@ -47,7 +47,7 @@ class AddFiles extends Component {
)
}
- renderHiddenCameraInput = (type, refCallback) => {
+ renderHiddenCameraInput = (type, nativeCameraFacingMode, refCallback) => {
const typeToAccept = { photo: 'image/*', video: 'video/*' }
const accept = typeToAccept[type]
@@ -60,7 +60,7 @@ class AddFiles extends Component {
type="file"
name={`camera-${type}`}
onChange={this.onFileInputChange}
- capture="user"
+ capture={nativeCameraFacingMode}
accept={accept}
ref={refCallback}
/>
@@ -275,14 +275,18 @@ class AddFiles extends Component {
}
render () {
- const { showNativePhotoCameraButton, showNativeVideoCameraButton } = this.props
+ const {
+ showNativePhotoCameraButton,
+ showNativeVideoCameraButton,
+ nativeCameraFacingMode,
+ } = this.props
return (
{this.renderHiddenInput(false, (ref) => { this.fileInput = ref })}
{this.renderHiddenInput(true, (ref) => { this.folderInput = ref })}
- {showNativePhotoCameraButton && this.renderHiddenCameraInput('photo', (ref) => { this.mobilePhotoFileInput = ref })}
- {showNativeVideoCameraButton && this.renderHiddenCameraInput('video', (ref) => { this.mobileVideoFileInput = ref })}
+ {showNativePhotoCameraButton && this.renderHiddenCameraInput('photo', nativeCameraFacingMode, (ref) => { this.mobilePhotoFileInput = ref })}
+ {showNativeVideoCameraButton && this.renderHiddenCameraInput('video', nativeCameraFacingMode, (ref) => { this.mobileVideoFileInput = ref })}
{this.renderDropPasteBrowseTagline()}
{this.renderSourcesList(this.props.acquirers, this.props.disableLocalFiles)}
diff --git a/packages/@uppy/webcam/src/Webcam.jsx b/packages/@uppy/webcam/src/Webcam.jsx
index 10fef4964a..1b1df15cbf 100644
--- a/packages/@uppy/webcam/src/Webcam.jsx
+++ b/packages/@uppy/webcam/src/Webcam.jsx
@@ -98,7 +98,7 @@ export default class Webcam extends UIPlugin {
],
mirror: true,
showVideoSourceDropdown: false,
- facingMode: 'user',
+ facingMode: 'user', // @TODO: remove in the next major
preferredImageMimeType: null,
preferredVideoMimeType: null,
showRecordingLength: false,
@@ -595,12 +595,13 @@ export default class Webcam extends UIPlugin {
}
install () {
- const { mobileNativeCamera, modes } = this.opts
+ const { mobileNativeCamera, modes, facingMode, videoConstraints } = this.opts
if (mobileNativeCamera) {
this.uppy.getPlugin('Dashboard').setOptions({
showNativeVideoCameraButton: isModeAvailable(modes, 'video-only') || isModeAvailable(modes, 'video-audio'),
showNativePhotoCameraButton: isModeAvailable(modes, 'picture'),
+ nativeCameraFacingMode: videoConstraints?.facingMode || facingMode,
})
return
}
diff --git a/packages/@uppy/webcam/types/index.d.ts b/packages/@uppy/webcam/types/index.d.ts
index ee3ee618e7..58b7820371 100644
--- a/packages/@uppy/webcam/types/index.d.ts
+++ b/packages/@uppy/webcam/types/index.d.ts
@@ -12,6 +12,9 @@ export interface WebcamOptions extends PluginOptions {
onBeforeSnapshot?: () => Promise
countdown?: number | boolean
mirror?: boolean
+ /**
+ * @deprecated Use `videoConstraints.facingMode` instead.
+ */
facingMode?: string
showVideoSourceDropdown?: boolean
modes?: WebcamMode[]
diff --git a/website/src/docs/webcam.md b/website/src/docs/webcam.md
index fe15844d2e..b9fcfc31cd 100644
--- a/website/src/docs/webcam.md
+++ b/website/src/docs/webcam.md
@@ -64,15 +64,16 @@ uppy.use(Webcam, {
'picture',
],
mirror: true,
+ showVideoSourceDropdown: false,
+ /** @deprecated Use `videoConstraints.facingMode` instead. */
+ facingMode: 'user',
videoConstraints: {
facingMode: 'user',
- width: { min: 720, ideal: 1280, max: 1920 },
- height: { min: 480, ideal: 800, max: 1080 },
},
- showRecordingLength: false,
- preferredVideoMimeType: null,
preferredImageMimeType: null,
- mobileNativeCamera: isMobile(),
+ preferredVideoMimeType: null,
+ showRecordingLength: false,
+ mobileNativeCamera: isMobile({ tablet: true }),
locale: {},
})
```