Dropzone.js v4 + - display of existing files on the server with limited operation of files and other functions

Question

How to add existing files to the server in dropzone with the correct operation of all functions and the right style?

Answer 1

I wrote a function to add files: addCustomFile (file, thumbnail_url, responce)

Works on version: 4.0.1 stable

Proper operation: maxFiles constraint, maxfilesexceeded event, event success and others

$("#dropzone-images").dropzone({
    url: "...",
    paramName: 'image_temp',
    maxFiles: 1,
    init: function () {
        this.addCustomFile = function(file, thumbnail_url , responce){
            // Push file to collection
            this.files.push(file);
            // Emulate event to create interface
            this.emit("addedfile", file);
            // Add thumbnail url
            this.emit("thumbnail", file, thumbnail_url);
            // Add status processing to file
            this.emit("processing", file);
            // Add status success to file AND RUN EVENT success from responce
            this.emit("success", file, responce , false);
            // Add status complete to file
            this.emit("complete", file);
        }

        this.addCustomFile(
            // File options
            {
                // flag: processing is complete
                processing: true,
                // flag: file is accepted (for limiting maxFiles)
                accepted: true,
                // name of file on page
                name: "The name",
                // image size
                size: 12345,
                // image type
                type: 'image/jpeg',
                // flag: status upload
                status: Dropzone.SUCCESS
            },
            // Thumbnail url
            "http://.../img.jpg",
            // Custom responce for event success
            {
                status: "success"
            }
        );
    }
});