formio.js
formio.js copied to clipboard
Add capture option to file fields
This adds a new capture
option to file fields, which allows a mobile device to open the camera or microphone directly in capture mode. This offers more flexibility over the current webcam
setting as it lets the user configure which device to launch (camera, video, microphone- based on filePattern
) and specify front or rear device, on supported platforms (iOS). Capture can be used alongside webcam and is ignored on desktop.
While working on this, I also tried to tidy up the file input a bit, removing the "Drop files to attach" label on mobile and adding some icons to the link buttons.
Example Configurations
Launch rear-facing camera
{
type: "file",
label: "My Photos",
key: "photos",
storage: "base64",
image: true,
capture: "environment",
filePattern: "image/*",
multiple: true,
imageSize: "250"
}
Launch front-facing video camera
{
type: "file",
label: "My Videos",
key: "videos",
storage: "base64",
capture: "user",
filePattern: "video/*",
multiple: true,
imageSize: "250"
}
Launch microphone
{
type: "file",
label: "My Audio",
key: "audio",
storage: "base64",
capture: "environment",
filePattern: "audio/*",
multiple: true,
imageSize: "250"
}
This is great! Thank you for your contribution. This will most likely get pulled into the 4.15.x versions.
Awesome, thanks! Let me know if I'm missing anything with this PR.
Will we have a chance to see this PR merged in 5.x.x ? Looking for this feature for resolving the issue: when we are taking picture from a mobile, we cannot switch from front camera (selfie) to back camera, on Android.
This is getting pulled into the 5.x branch. Great feature!