The full requested path given by the user
The file sources which are available for browsing
Track the active source tab which is being browsed
A callback function to trigger once a file has been selected
The latest set of results browsed from the server
The general file type which controls the set of extensions which will be accepted
The target HTML element this file picker is bound to
A button which controls the display of the picker UI
The display mode of the FilePicker UI
The current set of file extensions which are being filtered upon
The options provided to this application upon initialization
The application ID is a unique incrementing integer which is used to identify every application window drawn by the VTT
An internal reference to the HTML element this application renders
Track the current position and dimensions of the Application UI
DragDrop workflow handlers which are active for this Application
Tab navigation handlers which are active for this Application
SearchFilter handlers which are active for this Application
Track whether the Application is currently minimized
Track the most recent scroll positions for any vertically scrolling containers
The current render state of the Application
The prior render state of this Application. This allows for rendering logic to understand if the application is being rendered for the first time.
Record the last-browsed directory path so that re-opening a different FilePicker instance uses the same target
Record the last-configured tile size which can automatically be applied to new FilePicker instances
Record the last-configured display mode so that re-opening a different FilePicker instance uses the same mode.
Enumerate the allowed FilePicker display modes
Cache the names of S3 buckets which can be used
The sequence of rendering states that track the Application life-cycle.
Given a current file path, determine the directory it belongs to
The currently requested target path
An array of the inferred source and target directory path
Set the application position and store its new location. Returns the updated position object for the application containing the new values.
Positional data
|void}
Browse to a specific location for this FilePicker instance
Render the Application by evaluating it's HTML template against the object of data provided by the getData method If the Application is rendered as a pop-out window, wrap the contained HTML in an outer frame with window controls
Add the rendered application to the DOM if it is not already present. If false, the Application will only be re-rendered if it is already present.
Additional rendering options which are applied to customize the way that the Application is rendered in the DOM.
The rendered Application instance
After rendering, activate event listeners which provide interactivity for the Application. This is where user-defined Application subclasses should attach their event-handling logic.
Change the currently active tab
The target tab name to switch to
Options which configure changing the tab
A specific named tab group, useful if multiple sets of tabs are present
Whether to trigger tab-change callback functions
Bring the application to the top of the rendering stack
Close the application and un-register references to it within UI mappings This function returns a Promise which resolves once the window closing animation concludes
A Promise which resolves once the application is closed
Minimize the pop-out window, collapsing it to a small tab Take no action for applications which are not of the pop-out variety or apps which are already minimized
A Promise which resolves once the minimization action has completed
Maximize the pop-out window, expanding it to its original size Take no action for applications which are not of the pop-out variety or are already maximized
A Promise which resolves once the maximization action has completed
Handle changes to the tile size.
The triggering event.
An asynchronous inner function which handles the rendering of the Application
Render and display the application even if it is not currently displayed.
Additional options which update the current values of the Application#options object
A Promise that resolves to the Application once rendering is complete
Persist the scroll positions of containers within the app before re-rendering the content
The HTML object being traversed
Restore the scroll positions of containers within the app after re-rendering the content
The HTML object being traversed
Render the outer application wrapper
A promise resolving to the constructed jQuery object
Specify the set of config buttons which should appear in the Application header. Buttons should be returned as an Array of objects. The header buttons which are added to the application can be modified by the getApplicationHeaderButtons hook.
Activate required listeners which must be enabled on every Application. These are internal interactions which should not be overridden by downstream subclasses.
Callback actions which occur when a dragged element is over a drop target.
The originating DragEvent
Wait for any images present in the Application to load.
A Promise that resolves when all images have loaded.
Get the valid file extensions for a given named file picker type
Handle a click event to change the display mode of the File Picker
The triggering click event
Handle user submission of the address bar to request an explicit target
The originating keydown event
Handle user interaction with the favorites
The originating click event
Handle requests from the IntersectionObserver to lazily load an image file
Handle file or folder selection within the file picker
The originating click event
Handle backwards navigation of the folder structure.
The triggering click event
Present the user with a dialog to create a subdirectory within their currently browsed file storage location.
The data source being browsed
Handle changes to the bucket selector
The S3 bucket select change event
Handle file upload
The file upload event
Add the given path for the source to the favorites
The source of the folder (e.g. "data", "public")
The path to a folder
Remove the given path from the favorites
The source of the folder (e.g. "data", "public")
The path to a folder
Test a URL to see if it matches a well known s3 key pattern
An input URL to test
A regular expression match
Browse files for a certain directory location
The source location in which to browse. See FilePicker#sources for details
The target within the source location
Optional arguments
A Promise which resolves to the directories and files contained in the location
Configure metadata settings regarding a certain file system path
The source location in which to browse. See FilePicker#sources for details
The target within the source location
Optional arguments which modify the request
Create a subdirectory within a given source. The requested subdirectory path must not already exist.
The source location in which to browse. See FilePicker#sources for details
The target within the source location
Optional arguments which modify the request
Dispatch a POST request to the server containing a directory path and a file to upload
The data source to which the file should be uploaded
The destination path
The File object to upload
Additional options to configure how the method behaves
The response object
A convenience function that uploads a file to a given package's persistent /storage/ directory
The id of the package to which the file should be uploaded. Only supports Systems and Modules.
The relative path in the package's storage directory the file should be uploaded to
The File object to upload
Additional options to configure how the method behaves
The response object
Bind the file picker to a new target field. Assumes the user will provide a HTMLButtonElement which has the data-target and data-type attributes The data-target attribute should provide the name of the input field which should receive the selected file The data-type attribute is a string in ["image", "audio"] which sets the file extensions which will be accepted
The button element
General dispatcher method to submit file management commands to the server
Request data dispatched to the server
Options dispatched to the server
The server response
Return the source object for the currently active source
Return the target directory for the currently active source
Return a flag for whether the current user is able to upload file content
Return the CSS application ID which uniquely references this UI element
Return the active application element, if it currently exists in the DOM
The path to the HTML template file which should be used to render the inner content of the app
Control the rendering style of the application. If popOut is true, the application is rendered in its own wrapper window, otherwise only the inner app content is rendered
Return a flag for whether the Application instance is currently rendered
Whether the Application is currently closing.
Get favorite folders for quick access
Set favorite folders for quick access
An object of Favorite Folders
Return the upload URL to which the FilePicker should post uploaded files
The FilePicker application renders contents of the server-side public directory. This app allows for navigating and uploading files to the public path.
Options that configure the behavior of the FilePicker