Search code examples
javascriptjqueryfile-uploadjquery-file-upload

jQuery File Upload show time remaining?


Hi I am using jQuery File Upload

It is working fine and I am showing the user a progress bar showing upload progress with code like the below:

$('#fileupload').fileupload({
    /* ... */
    progressall: function (e, data) {
        var progress = parseInt(data.loaded / data.total * 100, 10);
        $('#progress .bar').css(
            'width',
            progress + '%'
        );
    }
});

On my page I have just included the jquery.fileupload.js file currently. Within the data of the progressall function I can see the bitrate, the total file size and the data loaded currently, which as I say updates my progress bar as expected. However reading this link on the site it suggests that I can get extra information including the time remaining? I have been unable to get this working however. There is a jquery.fileupload-ui.js file as well - I tried including that after my jquery.fileupload.js but I did not see time remaining propety getting added to the data in the progressall function. I also tried removing jquery.fileupload.js and just included jquery.fileupload-ui.js however that broke my file upload and it did not function.

Is there anyway I could easily calculate the time remaining using the bit rate/data loaded and total size or has anyone got a suggestion of the correct way I should be getting this extended information out of the box from the plugin?


Solution

  • Given the example of Extended Progress Information, try ...

    $('#fileupload').bind('fileuploadprogress', function (e, data) {
        // Log the current bitrate for this upload:
        // console.log(data.bitrate);
        console.log(data);
    });
    

    ... to examine what data is being reported via this data point. Then, you can access what you need.