Docs
- Getting Started
- SME Uploader
- Companion
- List of Plugins
- Common Plugin Options
- Custom Stores
- Locale Packs
UI Elements
Sources
- Drag & Drop
- File Input
- Webcam
- Provider Plugins
- ⓒ Dropbox
- ⓒ Google Drive
- ⓒ OneDrive
- ⓒ Zoom
- ⓒ Import From URL
Destinations
File Processing
- Image Editor
- Robodog Introduction
- Robodog File Picker
- Robodog Form
- Robodog Upload
- Robodog Dashboard
- Transloadit
Miscellaneous
Contributing
Robodog: File Picker API
Show a modal UI that allows users to pick files from their device and from the web. It uploads files to Transloadit for processing.
const resultPromise = Robodog.pick({ params: { auth: { key: '' }, template_id: '' } }) |
resultPromise
is a Promise that resolves with an object:
successful
- An array containing data about files that were uploaded successfullyfailed
- An array containing data about files that failed to uploadtransloadit
- An array of Assembly statusesresults
- An array of results produced by the assembly, ifwaitForEncoding
was used
options.target
DOM element or CSS selector to place the modal element in. document.body
is usually fine in this case because the modal is absolutely positioned on top of everything anyway.
Transloadit
All the options to the Transloadit plugin are supported.
The Promise resolution value has a transloadit
and results
key.
result.transloadit
contains an array of Assembly statuses. Assembly statuses are objects as described in the Transloadit documentation. There may be multiple Assembly statuses if the getAssemblyOptions
option was used, because different files may be processed by different Assemblies.
result.results
contains an array of results produced by the Assemblies. Each result has an assemblyId
property containing the string ID of the Assembly that produced it, and a stepName
property containing the string name of the Assembly step that produced it.
Restrictions
Set rules and conditions to limit the type and/or number of files that can be selected. Restrictions are configured by the restrictions
option.
restrictions.maxFileSize
Maximum file size in bytes for each individual file.
restrictions.minFileSize
Minimum file size in bytes for each individual file.
restrictions.maxNumberOfFiles
The total number of files that can be selected. If this is equal to 1, users can only select a single file in system dialogs; else they can select multiple.
restrictions.minNumberOfFiles
The minimum number of files that must be selected before the upload.
restrictions.allowedFileTypes
Array of mime type wildcards image/*
, exact mime types image/jpeg
, or file extensions .jpg
: ['image/*', '.jpg', '.jpeg', '.png', '.gif']
.
If provided, the <input accept>
attribute will be used for the internal file input field, so only acceptable files can be selected in the system file dialog.
Providers
Providers import files from third party services using SME Uploader Companion or from local sources like the device camera.
By default, the Picker will use Transloadit’s SME Uploader Companion servers for imports from third party service. You can self-host your own instances as well.
providers: []
Array of providers to use. Each entry is the name of a provider. The available ones are:
'dropbox'
– Import files from Dropbox using SME Uploader Companion.'google-drive'
– Import files from Google Drive using SME Uploader Companion.'instagram'
– Import files from Instagram using SME Uploader Companion.'url'
– Import files from public Web URLs using SME Uploader Companion.'webcam'
– Take photos and record videos using thee user’s device camera.
companionUrl: Transloadit.COMPANION
The URL to a SME Uploader Companion server to use.
companionAllowedHosts: Transloadit.COMPANION_PATTERN
The valid and authorised URL(s) from which OAuth responses should be accepted.
This value can be a String
, a Regex
pattern, or an Array
of both.
This is useful when you have your SME Uploader Companion running on multiple hosts. Otherwise, the default value should do just fine.
companionHeaders: {}
Custom headers to send to SME Uploader Companion.
dropbox: {}
Specific options for the Dropbox provider.
googleDrive: {}
Specific options for the Google Drive provider.
instagram: {}
Specific options for the Instagram provider.
url: {}
Specific options for the URL provider.
webcam: {}
Specific options for the Webcam provider.