Creates new instance of Flmngr client. This action usually made just once to preconfigure Flmngr and do not pass all the options into Flmngr methods. Save returned object and use it as Flmngr API.
Please see [the samples of initialization](@link /doc/open-file-manager).
The directory where to place all quick uploads. Relative to the location of URL specified in urlFiles.
This directory inside your storage will be used when you call some method without defining a directory where to save files.
The list of custom image formats and proportions you need to resize images too.
For example you plan to request images with generated previews by using the method pickFiles - you need to define preview format here just once. This will also affect for filtering images of these formats inside the file manager browser window.
For more details please see FlmngrImageFormat class and the sample
If you wish to use pass some specific settings into ImgPen image editor, use this field to create and pass whole image editor instance as value like: new ImgPen({ cropRatios: [{w: 4, h: 3}, {w: 3, h: 2}] })
Maximum thread number for uploading files. Only this number of connections Flmngr will open at once interacting with the backend.
URL on your server which will serve all requests from Flmgnr. This is the URL you bound Flmngr backend to.
Prefix to your files directory in URL notation.
For example: https://example.com/images/
Asks server to generate another formats of images. For example you need to generate a preview for your image or a set of resized user's avatars in two or more different sizes (this method is very flexible).
The associative array of formats you need to the mode of how to process this format. The formats must be already defined in imageFormats parameter passed to Flmngr.constructor, here you only list which do you require: they will be applied to each URL you pass as urls.
Modes can be:
"ALWAYS" - resized image will be created or recreated"IF_EXISTS" - only update existing previews"DO_NOT_UPDATE" - only create new images (use already existing as cache)Example:
imageFormats: {
"preview": "ALWAYS"
}Success callback returning you a result in format: source URL to map of formats (image format id to an URL of generated image).
Called each time Flmngr has any progress with creating image format.
If set to true, the dialog with the progress indicator will be shown until the request is finished.
The list of URLs stored on your file server which do you need to resize. All of them must start with prefix from urlFiles (passed to Flmngr.constructor) in order to correctly detect their directory (resized images will be places in the same directory).
Opens ImgPen image editor dialog and allows you to decide what to do with a result.
Custom image editing CodePen sample is available
Callback fired when user cancels editing an image.
Callback fired when user presses "Save" button.
URL of Base64 string with image data. URL can link into your storage or outside of it.
Opens ImgPen image editor and saves a result image on the server after user presses "Save". This is a composite method of edit and upload methods (see them for more detailed parameters explanation).
Here is CodePen sample of editing and saving an image
Directory to upload into.
When user presses "Cancel" in the image editor, this callback is called.
Callback fired on upload failed. If this method is not specified, Flmngr will just show this error message.
The same as onFinish callback of upload method, but only one URL is passed here (as string instead of an array of strings).
URL of an image to edit.
Asks a server for a version of backend. This is asynchronous function due to requires to ask server about a version. In case such request was already done (made on Flmngr initialization automatically), callback will be called immediately.
image extensions currently supported by Flmngr.
At this version they are: ['png', 'jpeg', 'jpg', 'webp', 'svg', 'gif', 'bmp'].
Modifies passed URL to be unique.
A new URL parameter no-cache with current time in millis will be added to it.
This is useful especially when you expect user will edit some image, but its URL will not change. In this case there is no other way to force browser reload the image if you show it on the page.
Anyway this will not break caching image on the user side because even such image will stay on public webpage content, its URL is still constant and can be cached by browsers.
You can safely pass such URLs into pickFiles method without any reverse action - it understands this format. And will return URLs cleaned from these `no-cache` parameter, so you will decide to add it again or not.
This is the base method to show file manager dialog and let user to select file or files.
The list of extensions to accept. By default all file extensions are accepted.
You can block files reordering by setting this option to false.
The directory for file uploads. If you do not specify anything defaultUploadsDir passed previosly to Flmngr.constructor will be used here.
The required list of IDs of image formats already defined as imageFormats parameter of Flmngr.constructor.
The flag indicating do we operate a list or a single file.
The list of URLs you already have and want user to extend or modify
Called if user cancelled picking files.
Callback called on success with the list of specified files. files is an array of selected files with additional required formats (inside formats field of each file structure).
Opens standard browser dialog to select a files (not Flmngr dialog of pickFiles method).
The flag shows files of which extension can user specify. Note. Not all browsers support this option, some legacy ones can ignore it or use not too accurate.
The flag shows can user specify many files or just one. Note. Not all browsers support this flag, some legacy ones can ignore it.
The callback fired when user selected some files.
Opens the dialog where user can specify some URL or list of URLs.
The flag shows can user specify many files or just one.
Called when user presses "Cancel" button.
The callback fired when user specified a list of URLs and pressed "OK".
Uploads files or links (a list of URLs) to a specified directory on the server. If there is no directory selected, the default upload directory (defaultUploadDir parameter passed to Flmngr.constructor) will be used.
See explained CodePen sample of uploading files
The directory to upload files into. If not specified, the default upload directory will be used. Relative to the root of the file storage.
The list of files or links to upload. You can pass file objects of your own application, ask user for files with the method selectFiles or specify external URLs.
Callback returning you an error occurred on upload. Getting this error means all partially uploaded files were already removed from the server and there is no any garbage neither in the upload directory nor in the temporary one (Flmngr implements transactional uploads model).
Success callback is called when all files were uploaded. urls arrays contain a list of URLs fully formed with using prefix from urlFiles parameter you passed to Flmngr.constructor. Alternatively you can use raw paths argument to obtain paths relative to urlFiles (before merging with it).
a list of URLs of uploaded files in callback, or error message in callback.
This is Flmngr class you should use to interact with your server to access files: upload, list, modify or delete them. This class contains API both for atomic actions (select file, upload, ...) and for further using main API of Flmngr.
Here are installation docs
See explained examples of usage with CodePen samples: